From 6cae4937c2b01b369c5f7a75017881483dc689f0 Mon Sep 17 00:00:00 2001
From: Devine Lu Linvega <aliceffekt@gmail.com>
Date: Sat, 13 Jul 2019 09:20:05 +0900
Subject: [PATCH] Cleaned up the commander
---
desktop/sources/links/main.css | 7 +++--
desktop/sources/scripts/core/commander.js | 34 +++++++++++++++++++----
desktop/sources/scripts/layers/guide.js | 4 ---
desktop/sources/scripts/ronin.js | 6 ++--
4 files changed, 35 insertions(+), 16 deletions(-)
diff --git a/desktop/sources/links/main.css b/desktop/sources/links/main.css
index 56167d4..70478cc 100644
--- a/desktop/sources/links/main.css
+++ b/desktop/sources/links/main.css
@@ -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; }
diff --git a/desktop/sources/scripts/core/commander.js b/desktop/sources/scripts/core/commander.js
index 7b7bdbf..c83c629 100644
--- a/desktop/sources/scripts/core/commander.js
+++ b/desktop/sources/scripts/core/commander.js
@@ -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 () {
}
diff --git a/desktop/sources/scripts/layers/guide.js b/desktop/sources/scripts/layers/guide.js
index b19f115..a56e271 100644
--- a/desktop/sources/scripts/layers/guide.js
+++ b/desktop/sources/scripts/layers/guide.js
@@ -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]
diff --git a/desktop/sources/scripts/ronin.js b/desktop/sources/scripts/ronin.js
index ebb8fad..c26a941 100644
--- a/desktop/sources/scripts/ronin.js
+++ b/desktop/sources/scripts/ronin.js
@@ -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()
}