Atlas48/pointvec
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Hide menu with tab

Browse Source
This commit is contained in:
Devine Lu Linvega 2019-01-12 16:22:38 +12:00
parent f4aa6fae54
commit dd549617b5
4 changed files with 21 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
desktop/sources/index.html
View File

@ -84,12 +84,13 @@
DOTGRID.controller.add("default","Layers","Foreground",() => { DOTGRID.tool.selectLayer(0) },"CmdOrCtrl+1");
DOTGRID.controller.add("default","Layers","Middleground",() => { DOTGRID.tool.selectLayer(1) },"CmdOrCtrl+2");
DOTGRID.controller.add("default","Layers","Background",() => { DOTGRID.tool.selectLayer(2) },"CmdOrCtrl+3");
DOTGRID.controller.add("default","Layers","Next Layer",() => { DOTGRID.tool.selectNextLayer() },"Tab");
DOTGRID.controller.add("default","Layers","Prev Layer",() => { DOTGRID.tool.selectPrevLayer() },"Shift+Tab");
DOTGRID.controller.add("default","Layers","Next Layer",() => { DOTGRID.tool.selectNextLayer() });
DOTGRID.controller.add("default","Layers","Prev Layer",() => { DOTGRID.tool.selectPrevLayer() });
DOTGRID.controller.add("default","Layers","Merge Layers",() => { DOTGRID.tool.merge() },"M");
DOTGRID.controller.add("default","View","Color Picker",() => { DOTGRID.picker.start(); },"G");
DOTGRID.controller.add("default","View","Toggle Grid",() => { DOTGRID.renderer.toggle(); },"H");
DOTGRID.controller.add("default","View","Toggle Interface",() => { DOTGRID.interface.toggle(); },"Tab");
DOTGRID.controller.add("default","Theme","Open Theme",() => { DOTGRID.theme.open(); },"CmdOrCtrl+Shift+o")
DOTGRID.controller.add("default","Theme","Reset Theme",() => { DOTGRID.theme.reset(); },"CmdOrCtrl+Shift+Backspace")

4
desktop/sources/links/main.css
View File

@ -9,8 +9,8 @@ body { padding: 0px; font-family: 'input_mono_regular'; -webkit-user-select: non
/* Interface */
#interface { font-size: 11px;line-height: 30px;text-transform: uppercase;-webkit-app-region: no-drag; transition: all 150ms; width: 100%; position:fixed; bottom:20px; left:45px; height:30px; max-width:calc(100vw - 85px); overflow: hidden;}
#interface.hidden { bottom:10px;opacity: 0 }
#interface.visible { bottom:20px; opacity: 1 }
#interface.hidden { bottom:10px !important;opacity: 0 !important }
#interface.visible { bottom:20px !important; opacity: 1 !important}
#interface #menu { opacity: 1; position: absolute; top:0px; transition: all 250ms; z-index: 900; overflow: hidden; height:30px; width:100%;}
#interface #menu svg.icon { width:30px; height:30px; margin-right:-9px; opacity: 0.6; transition: opacity 250ms; }
#interface #menu svg.icon.inactive { opacity: 0.2 }

13
desktop/sources/scripts/interface.js
View File

@ -7,7 +7,7 @@ function Interface (dotgrid) {
this.el.appendChild(this.menu_el = document.createElement('div'))
this.menu_el.id = 'menu'
this.is_visible = true
this.isVisible = true
this.zoom = false
this.install = function (host) {
@ -142,7 +142,14 @@ function Interface (dotgrid) {
}
this.toggle = function () {
this.is_visible = !this.is_visible
this.el.className = this.is_visible ? 'visible' : 'hidden'
this.isVisible = !this.isVisible
this.el.className = this.isVisible ? 'visible' : 'hidden'
}
document.onkeydown = function (e) {
if (e.key === 'Tab') {
DOTGRID.interface.toggle()
e.preventDefault()
}
}
}

12
desktop/sources/scripts/picker.js
View File

@ -4,16 +4,16 @@ function Picker (dotgrid) {
this.memory = ''
this.el = document.createElement('div')
this.el.id = 'picker'
this.is_active = false
this.isActive = false
this.input = document.createElement('input')
this.input.id = 'picker_input'
this.el.appendChild(this.input)
this.start = function () {
if (this.is_active) { return }
if (this.isActive) { return }
this.is_active = true
this.isActive = true
this.input.setAttribute('placeholder', `${DOTGRID.tool.style().color.replace('#', '').trim()}`)
this.input.setAttribute('maxlength', 6)
@ -26,7 +26,7 @@ function Picker (dotgrid) {
}
this.update = function () {
if (!this.is_active) { return }
if (!this.isActive) { return }
if (!is_color(this.input.value)) { return }
const hex = `#${this.input.value}`
@ -36,9 +36,9 @@ function Picker (dotgrid) {
}
this.stop = function () {
if (!this.is_active) { return }
if (!this.isActive) { return }
this.is_active = false
this.isActive = false
DOTGRID.interface.el.className = ''
this.input.blur()