From ef68e52438c74dd40a09f3797460e2e1a80759ef Mon Sep 17 00:00:00 2001 From: Devine Lu Linvega Date: Thu, 18 Jul 2019 11:37:51 +0900 Subject: [PATCH] Begin implementing onscreen docs. --- desktop/sources/links/main.css | 4 +- desktop/sources/scripts/commander.js | 30 +++++++----- desktop/sources/scripts/source.js | 5 +- examples/resize.lisp | 8 ++-- examples/theme.lisp | 68 ++++++++++++++++------------ 5 files changed, 66 insertions(+), 49 deletions(-) diff --git a/desktop/sources/links/main.css b/desktop/sources/links/main.css index edf46f1..f2d5491 100644 --- a/desktop/sources/links/main.css +++ b/desktop/sources/links/main.css @@ -5,8 +5,8 @@ body { margin:0px; padding:0px; overflow:hidden; font-family:"input_mono_regular #ronin { height: calc(100vh - 60px); width:calc(100vw - 60px); -webkit-app-region: drag; padding: 30px;overflow: hidden; } #ronin #wrapper { overflow: hidden; position: relative; } #ronin #wrapper #commander { z-index: 9000;position: relative;width: 310px;height: calc(100vh - 60px);-webkit-app-region: no-drag;padding-right: 30px;transition: margin-left 250ms;} -#ronin #wrapper #commander textarea { background: none; width: 100%; height: calc(100vh - 80px); resize: none; font-size: 12px;line-height: 15px; padding-right: 15px} -#ronin #wrapper #commander div#status { position: absolute; bottom: 0px; } +#ronin #wrapper #commander textarea { background: none; width: 100%; height: calc(100vh - 90px); resize: none; font-size: 12px;line-height: 15px; padding-right: 15px} +#ronin #wrapper #commander div#status { position: absolute; bottom: 0px; text-transform: lowercase;} #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,"); background-size: 10px 10px; background-position: -4px -4px; width:100%; height:100%; left:340px; transition: left 250ms} diff --git a/desktop/sources/scripts/commander.js b/desktop/sources/scripts/commander.js index b855cc3..e645a9a 100644 --- a/desktop/sources/scripts/commander.js +++ b/desktop/sources/scripts/commander.js @@ -4,18 +4,28 @@ function Commander (ronin) { this._input = document.createElement('textarea') this._status = document.createElement('div') this._status.id = 'status' + this._log = document.createElement('div') + this._log.id = 'log' + this._source = document.createElement('div') + this._source.id = 'source' + this._help = document.createElement('div') + this._help.id = 'help' this.isVisible = true this.install = function (host) { this.el.appendChild(this._input) + this._status.appendChild(this._log) + this._status.appendChild(this._source) + this._status.appendChild(this._help) this.el.appendChild(this._status) host.appendChild(this.el) this._input.addEventListener('input', this.onInput) + this._input.addEventListener('click', this.onClick) this.docs.install() } this.start = function () { - this._status.textContent = 'Idle. (zoom 100%)' + this.setStatus('Ready.') this._input.focus() this.run() this.hide() @@ -54,21 +64,22 @@ function Commander (ronin) { } this.setStatus = function (msg) { - if (!msg || msg === this._status.textContent) { return } - this._status.textContent = `${(msg + '').substr(0, 40)}` - console.log(...msg) + if (!msg || msg === this._log.textContent) { return } + this._log.textContent = `${msg}` + this._source.textContent = `${ronin.source} ${this._input.value.split('\n').length} lines` + console.log(msg) } this.update = function () { } - this.onInput = function () { - + this.onInput = () => { + console.log('input', this._input.selectionStart) } - this.getQuery = function () { - + this.onClick = () => { + console.log('click', this._input.selectionStart) } // Mouse @@ -83,7 +94,6 @@ function Commander (ronin) { this.mouseRect.a.x = e.offsetX this.mouseRect.a.y = e.offsetY this.mouseRect.t = 'pos' - this._status.textContent = `${this.mouseRect.x},${this.mouseRect.y} ${this.mouseRect.w},${this.mouseRect.h}` this.capture() this.show() } @@ -94,7 +104,6 @@ function Commander (ronin) { this.mouseRect.h = e.offsetY - this.mouseRect.y this.mouseRect.b.x = e.offsetX this.mouseRect.b.y = e.offsetY - this._status.textContent = `${this.mouseRect.x},${this.mouseRect.y} ${this.mouseRect.w},${this.mouseRect.h}` this.commit() } } @@ -106,7 +115,6 @@ function Commander (ronin) { this.mouseRect.b.x = e.offsetX this.mouseRect.b.y = e.offsetY this.mouseRect.t = '' - this._status.textContent = `${this.mouseRect.x},${this.mouseRect.y} ${this.mouseRect.w},${this.mouseRect.h}` this.commit() this._input.focus() ronin.surface.clearGuide() diff --git a/desktop/sources/scripts/source.js b/desktop/sources/scripts/source.js index 71bb8eb..c6bfd72 100644 --- a/desktop/sources/scripts/source.js +++ b/desktop/sources/scripts/source.js @@ -15,6 +15,7 @@ function Source (ronin) { console.log('Source', 'Make a new file..') this.path = null ronin.surface.clear() + ronin.log(`New file.`) } this.open = function () { @@ -57,6 +58,7 @@ function Source (ronin) { if (quitAfter === true) { app.exit() } + ronin.log(`Writing file.`) } this.read = function (loc = this.path) { @@ -65,6 +67,7 @@ function Source (ronin) { console.log('Source', 'Reading ' + loc) this.path = loc this.load(fs.readFileSync(this.path, 'utf8')) + ronin.log(`Reading file.`) } this.run = function () { @@ -144,7 +147,7 @@ function Source (ronin) { } this.toString = function () { - return this.path ? this.name() : 'unsaved' + return this.path ? this.name() + '.lisp' : 'unsaved' } function isDifferent (a, b) { diff --git a/examples/resize.lisp b/examples/resize.lisp index 620a36c..5dbd409 100644 --- a/examples/resize.lisp +++ b/examples/resize.lisp @@ -1,7 +1,5 @@ ; resize - ( - (clear) - (open "../../PREVIEW.jpg") - (resize 0.5 0.5) -) \ No newline at end of file + (clear) + (open "../../PREVIEW.jpg") + (resize 0.5 0.5)) \ No newline at end of file diff --git a/examples/theme.lisp b/examples/theme.lisp index 498e19f..9c50830 100644 --- a/examples/theme.lisp +++ b/examples/theme.lisp @@ -1,30 +1,38 @@ -((clear) - (def col - (lambda - (i) - (of - ((theme "f_high") - (theme "f_med") - (theme "f_low") - (theme "f_inv") - (theme "b_high") - (theme "b_med") - (theme "b_low") - (theme "b_inv")) - (mod i 8)))) - (def rec - (lambda - (v i) - (if (gt v 0) - ((fill - (circle - (add - (div (of (frame) "w") 1.6) - (mul 1.5 v)) - (mul 10 v) - (mul v (div v 5))) - (col i)) - (rec - (sub v 3) - (add i 1)))))) - (rec 40 0)) \ No newline at end of file +; theme +( + (clear) + (def col + (lambda + (i) + (of + ( + (theme "f_high") + (theme "f_med") + (theme "f_low") + (theme "f_inv") + (theme "b_high") + (theme "b_med") + (theme "b_low") + (theme "b_inv")) + (mod i 8)))) + (def rec + (lambda + (v i) + (if + (gt v 0) + ( + (fill + (circle + (add + (div + (of + (frame) "w") 1.6) + (mul 1.5 v)) + (mul 10 v) + (mul v + (div v 5))) + (col i)) + (rec + (sub v 3) + (add i 1)))))) + (rec 40 0)) \ No newline at end of file