Improved client

This commit is contained in:
Devine Lu Linvega 2019-07-22 15:46:57 +09:00
parent 5d1d94415e
commit 8f54f954d2
2 changed files with 12 additions and 6 deletions

View File

@ -8,10 +8,15 @@ body { margin:0px; padding:0px; overflow:hidden; font-family:"input_mono_regular
#ronin #wrapper #commander textarea { background: none; width: 100%; height: calc(100vh - 105px); resize: none; font-size: 12px;line-height: 15px; padding-right: 15px} #ronin #wrapper #commander textarea { background: none; width: 100%; height: calc(100vh - 105px); resize: none; font-size: 12px;line-height: 15px; padding-right: 15px}
#ronin #wrapper #commander div#status { position: absolute; bottom: 0px; text-transform: lowercase;} #ronin #wrapper #commander div#status { position: absolute; bottom: 0px; text-transform: lowercase;}
#ronin.expand #wrapper #commander { width:100%; } #ronin.expand #wrapper #commander { width:100%; }
#ronin.hidden #wrapper #commander { margin-left:-331px; } #ronin canvas#surface,#ronin canvas#guide { position: absolute; top:0px; -webkit-user-select: none;-webkit-app-region: no-drag; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20'><circle cx='10' cy='10' r='1' fill='%23555'></circle></svg>"); background-size: 10px 10px; background-position: -4px -4px; width:100%; height:100%; transition: left 250ms}
/* Default */
#ronin.hidden #wrapper #commander { margin-left:-40vw; }
#ronin.hidden canvas#surface, #ronin.hidden canvas#guide { left:0; }
#ronin.hidden #wrapper #commander { margin-left:calc(-40vw - 30px); }
#ronin canvas#surface,#ronin canvas#guide { left:40vw; }
#ronin canvas#surface,#ronin canvas#guide { position: absolute; top:0px; -webkit-user-select: none;-webkit-app-region: no-drag; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20'><circle cx='10' cy='10' r='1' fill='%23555'></circle></svg>"); background-size: 10px 10px; background-position: -4px -4px; width:100%; height:100%; left:340px; transition: left 250ms}
#ronin canvas#guide { background:none; } #ronin canvas#guide { background:none; }
#ronin canvas#surface { border-radius: 2px } #ronin canvas#surface { border-radius: 2px }
#ronin.hidden canvas#surface, #ronin.hidden canvas#guide { left:0px; }

View File

@ -26,9 +26,8 @@ function Commander (ronin) {
this.start = function () { this.start = function () {
this.setStatus('Ready.') this.setStatus('Ready.')
this._input.focus()
this.run() this.run()
this.hide() this.show()
} }
this.run = (txt = this._input.value) => { this.run = (txt = this._input.value) => {
@ -157,12 +156,14 @@ function Commander (ronin) {
if (this.isVisible === true) { return } if (this.isVisible === true) { return }
ronin.el.className = expand ? 'expand' : '' ronin.el.className = expand ? 'expand' : ''
this.isVisible = true this.isVisible = true
this._input.focus()
} }
this.hide = function () { this.hide = function () {
if (this.isVisible !== true) { return } if (this.isVisible !== true) { return }
ronin.el.className = 'hidden' ronin.el.className = 'hidden'
this.isVisible = false this.isVisible = false
this._input.blur()
} }
this.toggle = function (expand = false) { this.toggle = function (expand = false) {