Cleaned up the commander

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 () {
 
   }

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]

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()
   }