Cleaned up the commander

This commit is contained in:
Devine Lu Linvega 2019-07-13 09:20:05 +09:00
parent b7120ab8a9
commit 6cae4937c2
4 changed files with 35 additions and 16 deletions

View File

@ -1,4 +1,4 @@
body { margin:0px; padding:0px; overflow:hidden; font-family:"input_mono_medium",courier,monospace; background:000; -webkit-app-region: drag; -webkit-user-select: none;}
body { margin:0px; padding:0px; overflow:hidden; font-family:"input_mono_regular",courier,monospace; background:000; -webkit-app-region: drag; -webkit-user-select: none; font-size:12px;}
*:focus {outline: none; }
yu { display:block; }
@ -11,8 +11,9 @@ yu { display:block; }
#below { z-index:799; position: absolute; }
#ronin { background:var(--b_low); height: 100vh; width:100vw; }
#commander { z-index: 9000; top: 15px; position: absolute; transition: all 150ms; left: 15px; width: 300px; height: calc(100vh - 60px); border-radius: 3px; padding: 15px;}
#commander textarea { background: none; width: 100%; height: calc(100% - 45px); resize: none; font-size: 12px;color: white; }
#commander { z-index: 9000; top: 15px; position: absolute; transition: all 150ms; left: 15px; width: calc(50vw - 60px); height: calc(100vh - 60px); padding: 15px; border-right: 1px solid #333;}
#commander textarea { background: none; width: 100%; height: calc(100vh - 75px); resize: none; font-size: 12px;color: white; }
#commander div#status { color:#555; }
#commander.hidden { top:-40px; }
#commander.visible { top:0px; }

View File

@ -1,23 +1,45 @@
function Commander () {
this.el = document.createElement('yu')
this.el.id = 'commander'
this.input_el = document.createElement('textarea')
this.input_el.value = `
this._input = document.createElement('textarea')
this._status = document.createElement('div')
this._status.id = 'status'
this.install = function (host) {
this.el.appendChild(this._input)
this.el.appendChild(this._status)
host.appendChild(this.el)
this._input.addEventListener('input', this.onInput)
}
this.start = function () {
this._input.value = `
; Get Image
(load "../media/test.png"
(rect 0 0 600 600))
; Some operations
(scale 0.5 0.5
(resize 150 150
(crop
(rect 0 0 300 300))))`.trim()
this.install = function () {
this.el.appendChild(this.input_el)
ronin.el.appendChild(this.el)
this.input_el.focus()
this._status.textContent = 'Idle.'
this._input.focus()
}
this.update = function () {
}
this.onInput = function () {
}
this.getQuery = function () {
}

View File

@ -13,10 +13,6 @@ function Guide () {
this.draw_inspector()
}
if (ronin.commander.input_el.value == '~') {
this.toggle_color_picker(true)
}
// Brush mirrors
for (id in ronin.brush.pointers) {
var pointer = ronin.brush.pointers[id]

View File

@ -57,7 +57,7 @@ function Ronin () {
this.frame.width = window.innerWidth
this.frame.height = window.innerHeight
this.commander.install()
this.commander.install(this.el)
this.frame.install()
this.cursor.target = this.layers.above
@ -73,6 +73,8 @@ function Ronin () {
this.start = function () {
this.theme.start()
this.commander.start()
window.addEventListener('dragover', ronin.io.drag_over)
window.addEventListener('drop', ronin.io.drop)
ronin.frame.el.addEventListener('mousedown', ronin.cursor.mouse_down)
@ -81,13 +83,11 @@ function Ronin () {
ronin.frame.el.addEventListener('contextmenu', ronin.cursor.mouse_alt)
window.addEventListener('keydown', ronin.keyboard.key_down)
window.addEventListener('keyup', ronin.keyboard.key_up)
ronin.commander.input_el.addEventListener('input', ronin.commander.on_input)
console.log('Ronin', 'Started')
this.above.update()
this.below.update()
this.guide.update()
this.commander.update()
this.load()
}