diff --git a/lib/atom-nyancat-view.coffee b/lib/atom-nyancat-view.coffee index 29c0fae..ecc3d07 100644 --- a/lib/atom-nyancat-view.coffee +++ b/lib/atom-nyancat-view.coffee @@ -1,10 +1,30 @@ module.exports = class AtomNyancatView + + catHeadSize = 18 + catArseSize = 9 + catSize = catArseSize + catHeadSize + constructor: (serializedState) -> # Create root element @element = document.createElement('div') @element.classList.add('inline-block', 'atom-nyancat') + @catTrail = document.createElement('span') + @catTrail.classList.add('atom-nyancat-trail') + @catTrail.style.minWidth = catArseSize + "px"; + + catHead = document.createElement('span') + catHead.classList.add('atom-nyancat-head') + + catArse = document.createElement('span') + catArse.classList.add('atom-nyancat-arse') + + @catTrail.appendChild(catArse) + @element.appendChild(@catTrail) + @element.appendChild(catHead) + + # Returns an object that can be retrieved when package is activated serialize: -> @@ -29,28 +49,10 @@ class AtomNyancatView # percentage should be number between 0 and 1 updateScroll: (progress) -> - # round percentage up - if progress + .000001 > 1 - progress = 1 - percentage = 100 * parseFloat(progress) - - catHeadSize = 18 - catArseSize = 9 - catSize = catArseSize + catHeadSize - maxWidth = 200 - trailSize = (maxWidth - catHeadSize) * progress + catArseSize - @element.style.width = maxWidth + "px" - - catTrail = document.createElement('span') - catTrail.classList.add('atom-nyancat-trail') - catTrail.style.width = Math.min(trailSize, maxWidth - catHeadSize) + "px" - - catHead = document.createElement('span') - catHead.classList.add('atom-nyancat-head') + progress = Math.min(progress * 100, 100); + @catTrail.style.width = "calc(" + progress + "% - " + catHeadSize + "px)" - catArse = document.createElement('span') - catArse.classList.add('atom-nyancat-arse') - - catTrail.appendChild(catArse) - @element.appendChild(catTrail) - @element.appendChild(catHead) + hide: -> + @element.classList.add('hide') + unhide: -> + @element.classList.remove('hide') diff --git a/lib/atom-nyancat.coffee b/lib/atom-nyancat.coffee index 24db07d..deccf0c 100644 --- a/lib/atom-nyancat.coffee +++ b/lib/atom-nyancat.coffee @@ -2,9 +2,6 @@ AtomNyancatView = require './atom-nyancat-view' {CompositeDisposable} = require 'atom' module.exports = AtomNyancat = - atomNyancatView: null - modalPanel: null - subscriptions: null activate: (state) -> console.log "nyancat enabled" @@ -12,14 +9,23 @@ module.exports = AtomNyancat = @view = new AtomNyancatView() @subs = new CompositeDisposable - @subs.add atom.workspace.observeActivePaneItem => - @unsubLastActive() - @subActive() + @subs.add atom.workspace.onDidChangeActiveTextEditor => + @attachToActiveTextEditor() + @attachToActiveTextEditor() + + attachToActiveTextEditor: -> + @scrollBind?.dispose() + editor = atom.workspace.getActiveTextEditor() + @scrollBind = editor?.element.onDidChangeScrollTop(@update.bind(this)) + if editor? + @view.unhide() @update() + else + @view.hide() deactivate: -> - @unsubLastActive() @subs.dispose() + @scrollBind?.dispose() @view.destroy() @statusBar = null @@ -28,28 +34,12 @@ module.exports = AtomNyancat = priority = 500 @view.mount(@statusBar, priority) - subActive: -> - editor = atom.workspace.getActiveTextEditor() - if not editor? - return - editorElement = editor.getElement() - @editor_subs = new CompositeDisposable - @editor_subs.add editorElement.onDidChangeScrollTop (top) => - @update() - @update() # update once regardles - - unsubLastActive: -> - if @editor_subs? - @editor_subs.dispose() - @editor_subs = null - update: -> editor = atom.workspace.getActiveTextEditor() - @view.clear() - if editor? - lastVisibleRow = editor.firstVisibleScreenRow - lastScreenLine = editor.getLineCount() - editor.rowsPerPage - percent = lastVisibleRow/parseFloat(lastScreenLine) + + maxScrollTop = editor?.element.getMaxScrollTop() + if maxScrollTop > 0 + percent = editor.element.getScrollTop() / maxScrollTop else - precent = 1 + percent = 1 @view.updateScroll(percent) diff --git a/styles/atom-nyancat.less b/styles/atom-nyancat.less index 86dc904..2e16394 100644 --- a/styles/atom-nyancat.less +++ b/styles/atom-nyancat.less @@ -4,36 +4,43 @@ // for a full listing of what's available. @import "ui-variables"; -.atom-nyancat { - background-color: @app-background-color; - height: 23px; - padding: 3px 0 3px 0; -} +.status-bar .status-bar-left { + display: flex; + flex-direction: row; -.atom-nyancat-trail { - position: relative; - display: inline-block; - width: 9px; - background-image: url(data:image/gif;base64,R0lGODlhCAARAKIAAIsX//+AAACA//8AAAD/AP//AAAAAAAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMwMTQgNzkuMTU2Nzk3LCAyMDE0LzA4LzIwLTA5OjUzOjAyICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxNCAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo0RUFENzZDRTE3OEQxMUU1QjYyNTg5Qjg0MzBCNkFERSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo0RUFENzZDRjE3OEQxMUU1QjYyNTg5Qjg0MzBCNkFERSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjRFQUQ3NkNDMTc4RDExRTVCNjI1ODlCODQzMEI2QURFIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjRFQUQ3NkNEMTc4RDExRTVCNjI1ODlCODQzMEI2QURFIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Af/+/fz7+vn49/b19PPy8fDv7u3s6+rp6Ofm5eTj4uHg397d3Nva2djX1tXU09LR0M/OzczLysnIx8bFxMPCwcC/vr28u7q5uLe2tbSzsrGwr66trKuqqainpqWko6KhoJ+enZybmpmYl5aVlJOSkZCPjo2Mi4qJiIeGhYSDgoGAf359fHt6eXh3dnV0c3JxcG9ubWxramloZ2ZlZGNiYWBfXl1cW1pZWFdWVVRTUlFQT05NTEtKSUhHRkVEQ0JBQD8+PTw7Ojk4NzY1NDMyMTAvLi0sKyopKCcmJSQjIiEgHx4dHBsaGRgXFhUUExIREA8ODQwLCgkIBwYFBAMCAQAAIfkEAAAAAAAsAAAAAAgAEQAAAx04uty+IcpJqyw4680z+WAojqBgnmiqnkDrvjCQAAA7); - background-repeat: repeat-x; - height: 17px; -} + .atom-nyancat { + background-color: @app-background-color; + height: 23px; + padding: 3px 0 3px 0; + max-width: none; + flex: 1; + } -.atom-nyancat-arse { - position: absolute; - top: 0; - right: 0; - width: 11px; - height: 17px; - background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAARCAYAAAAL4VbbAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4AwDDAU5Jr125AAAANNJREFUKM+VkbGNAjEQRZ8RHdCAXcM14Ah34q2BCja+0K6BAtiLXAAUMJuYkITs8rkAgVhYebkvORjp+fvPt1FVluScU4D1J2Dd7wBYLYKH79twim0YgN8LnCLk/AF8V4z/gF8z37dehJ1zOgxD84J57nkcRy2lPOau69Bjui34GiOEQN/3eO+nljm/O89lr/vdvPMDqNXUWk2zjaZanzJp5StDjKCqk2OtVRHRlJKKiFprFVBAZ51LKXjvCSFw3mxNSgkReW/j+fnzZmsA7PVHAf4A43VnSDYb0X0AAAAASUVORK5CYII=); - background-repeat: no-repeat; -} + .atom-nyancat-trail { + position: relative; + display: inline-block; + width: 9px; + background-image: url(data:image/gif;base64,R0lGODlhCAARAKIAAIsX//+AAACA//8AAAD/AP//AAAAAAAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMwMTQgNzkuMTU2Nzk3LCAyMDE0LzA4LzIwLTA5OjUzOjAyICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxNCAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo0RUFENzZDRTE3OEQxMUU1QjYyNTg5Qjg0MzBCNkFERSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo0RUFENzZDRjE3OEQxMUU1QjYyNTg5Qjg0MzBCNkFERSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjRFQUQ3NkNDMTc4RDExRTVCNjI1ODlCODQzMEI2QURFIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjRFQUQ3NkNEMTc4RDExRTVCNjI1ODlCODQzMEI2QURFIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Af/+/fz7+vn49/b19PPy8fDv7u3s6+rp6Ofm5eTj4uHg397d3Nva2djX1tXU09LR0M/OzczLysnIx8bFxMPCwcC/vr28u7q5uLe2tbSzsrGwr66trKuqqainpqWko6KhoJ+enZybmpmYl5aVlJOSkZCPjo2Mi4qJiIeGhYSDgoGAf359fHt6eXh3dnV0c3JxcG9ubWxramloZ2ZlZGNiYWBfXl1cW1pZWFdWVVRTUlFQT05NTEtKSUhHRkVEQ0JBQD8+PTw7Ojk4NzY1NDMyMTAvLi0sKyopKCcmJSQjIiEgHx4dHBsaGRgXFhUUExIREA8ODQwLCgkIBwYFBAMCAQAAIfkEAAAAAAAsAAAAAAgAEQAAAx04uty+IcpJqyw4680z+WAojqBgnmiqnkDrvjCQAAA7); + background-repeat: repeat-x; + height: 17px; + } + + .atom-nyancat-arse { + position: absolute; + top: 0; + right: 0; + width: 11px; + height: 17px; + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAARCAYAAAAL4VbbAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4AwDDAU5Jr125AAAANNJREFUKM+VkbGNAjEQRZ8RHdCAXcM14Ah34q2BCja+0K6BAtiLXAAUMJuYkITs8rkAgVhYebkvORjp+fvPt1FVluScU4D1J2Dd7wBYLYKH79twim0YgN8LnCLk/AF8V4z/gF8z37dehJ1zOgxD84J57nkcRy2lPOau69Bjui34GiOEQN/3eO+nljm/O89lr/vdvPMDqNXUWk2zjaZanzJp5StDjKCqk2OtVRHRlJKKiFprFVBAZ51LKXjvCSFw3mxNSgkReW/j+fnzZmsA7PVHAf4A43VnSDYb0X0AAAAASUVORK5CYII=); + background-repeat: no-repeat; + } -.atom-nyancat-head { - position: relative; - display: inline-block; - width: 18px; - height: 17px; - background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAARCAYAAADQWvz5AAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4AwDDAYPwiqwvgAAAP9JREFUOMuVk7FtxDAMRUnjygzgkjdDhnAmkcrUnkAzUJu48wB3A7BjmQHSK8WBgiRLPucDAgyKfCC/KSSiBP+QqmIvjunB10EfM9y/vrswTJyugT7jKWwa1aFHQF/kPt3r/P7kUGnLNIIwMzDzCxbjIYeI0rZtGXZ7NxEzA4BrDQdmhn3fc+x2xZ5qxAyvdQnUK2xVexRj9sfknOsWWnxdVyCiNDW3x7GwHst7340f9sg6MmQ8Gcdy7iEUo8X41gfrpvqe5/Fmtz6VgFIiAsuygKri8Im0sJ5CCPmp4NnrV1Xb4moRS0D1+1UV22P7IyK5SETGSzu6KDs1UC9m+gNMcIplpf1Y+AAAAABJRU5ErkJggg==); - background-repeat: no-repeat; + .atom-nyancat-head { + position: relative; + display: inline-block; + width: 18px; + height: 17px; + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAARCAYAAADQWvz5AAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4AwDDAYPwiqwvgAAAP9JREFUOMuVk7FtxDAMRUnjygzgkjdDhnAmkcrUnkAzUJu48wB3A7BjmQHSK8WBgiRLPucDAgyKfCC/KSSiBP+QqmIvjunB10EfM9y/vrswTJyugT7jKWwa1aFHQF/kPt3r/P7kUGnLNIIwMzDzCxbjIYeI0rZtGXZ7NxEzA4BrDQdmhn3fc+x2xZ5qxAyvdQnUK2xVexRj9sfknOsWWnxdVyCiNDW3x7GwHst7340f9sg6MmQ8Gcdy7iEUo8X41gfrpvqe5/Fmtz6VgFIiAsuygKri8Im0sJ5CCPmp4NnrV1Xb4moRS0D1+1UV22P7IyK5SETGSzu6KDs1UC9m+gNMcIplpf1Y+AAAAABJRU5ErkJggg==); + background-repeat: no-repeat; + } }