Moved everything to /desktop

desktop/main.js

@@ -23,7 +23,7 @@ app.on('ready', () => {
   })
 
   app.win.loadURL(`file://${__dirname}/sources/index.html`)
-  // app.inspect()
+  app.inspect()
 
   app.win.on('closed', () => {
     win = null

desktop/sources/index.html

@@ -26,8 +26,7 @@
     <script type="text/javascript" src="scripts/core/port.js"></script>
     <script type="text/javascript" src="scripts/core/query.js"></script>
     <script type="text/javascript" src="scripts/core/keyboard.js"></script>
-    
-    <script type="text/javascript" src="scripts/core/hint.js"></script>
+  
     <script type="text/javascript" src="scripts/core/commander.js"></script>
     
     <script type="text/javascript" src="scripts/ronin.js"></script>
@@ -56,6 +55,14 @@
       ronin.controller.add("default","*","Reset",() => { dotgrid.reset(); dotgrid.theme.reset(); },"CmdOrCtrl+Backspace");
       ronin.controller.add("default","*","Quit",() => { app.exit(); },"CmdOrCtrl+Q");
 
+      ronin.controller.addRole('default', 'Edit', 'undo')
+      ronin.controller.addRole('default', 'Edit', 'redo')
+      ronin.controller.addRole('default', 'Edit', 'cut')
+      ronin.controller.addRole('default', 'Edit', 'copy')
+      ronin.controller.addRole('default', 'Edit', 'paste')
+      ronin.controller.addRole('default', 'Edit', 'delete')
+      ronin.controller.addRole('default', 'Edit', 'selectall')
+
       ronin.controller.commit();
 
       ronin.install(document.body);

desktop/sources/links/main.css

@@ -0,0 +1,22 @@
+body { margin:0px; padding:0px; overflow:hidden; font-family:"input_mono_medium",courier,monospace; background:000; -webkit-app-region: drag; -webkit-user-select: none;}
+*:focus {outline: none; }
+
+yu { display:block; }
+
+:root { --background: "#222"; --f_high: "#fff";--f_med: "#777";--f_low: "#444";--f_inv: "#000";--b_high: "#000";--b_med: "#affec7";--b_low: "#000";--b_inv: "#affec7"; }  
+
+#cursor { z-index:899; position: absolute; }
+#guide { z-index:810;position: absolute; transition: opacity 250ms; opacity: 0}
+#above { z-index:800; position: absolute; }
+#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.hidden { top:-40px; }
+#commander.visible { top:0px; }
+
+surface { display: block; background:var(--background); position: absolute; top:0px; transition: all 100ms; }
+surface .layer { border-radius: 4px; overflow: hidden; width:100%; height:100%;}
+

desktop/sources/scripts/core/commander.js

@@ -0,0 +1,24 @@
+function Commander () {
+  this.el = document.createElement('yu')
+  this.el.id = 'commander'
+  this.input_el = document.createElement('textarea')
+  this.input_el.value = `
+(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.update = function () {
+
+  }
+
+  this.getQuery = function () {
+
+  }
+}

desktop/sources/scripts/core/cursor.js

@@ -134,27 +134,4 @@ function Cursor (rune) {
       ronin.commander.inject(ronin.cursor.query.replace('$', str))
     }
   }
-
-  this.hint = function () {
-    var html = ''
-
-    var mode = 'paint'
-
-    if (ronin.keyboard.is_down['Alt'] && ronin.keyboard.is_down['Shift']) {
-      mode = 'pick'
-    } else if (ronin.keyboard.is_down['Alt']) {
-      mode = 'erase'
-    } else if (ronin.keyboard.is_down['Shift']) {
-      mode = 'drag'
-    }
-
-    return `
-    <t class='frame'>${ronin.frame.width}X${ronin.frame.height} ${(ronin.frame.width / ronin.frame.height).toFixed(2)}:1</t>
-    <t class='target_${ronin.cursor.target.name}'></t><t class='size ${mode}'>${ronin.cursor.size}</t><t class='zoom'>${ronin.frame.zoom.scale}</t>
-    ${ronin.brush.swatch.hint()}`
-  }
-
-  function distance_between (a, b) {
-    return Math.sqrt((a.x - b.x) * (a.x - b.x) + (a.y - b.y) * (a.y - b.y))
-  }
 }

desktop/sources/scripts/core/keyboard.js

@@ -2,7 +2,6 @@ function Keyboard () {
   this.is_down = {}
 
   this.key_up = function (e) {
-    ronin.hint.update(e)
   }
 
   this.key_down = function (e) {
@@ -14,10 +13,7 @@ function Keyboard () {
     }
 
     if (ronin.commander.is_focused()) {
-      ronin.hint.update(e)
-      return
-    }
 
-    ronin.hint.update(e)
+    }
   }
 }

desktop/sources/scripts/core/method.js

@@ -4,10 +4,6 @@ function Method (name, params, info = 'Missing documentation', f) {
   this.info = info
   this.run = f
 
-  this.hint = function () {
-    return '<b>' + this.name + '</b>:' + this.params + ' '
-  }
-
   this.docs = function () {
     return '<b>' + this.params + '</b> <i>' + this.info + '</i>'
   }

desktop/sources/scripts/core/module.js

@@ -0,0 +1,6 @@
+function Module (name, docs = 'Missing documentation.') {
+  this.name = name
+  this.methods = {}
+
+  this.docs = docs
+}

desktop/sources/scripts/core/swatch.js

@@ -17,9 +17,4 @@ function Swatch () {
   this.color = function (offset = 0) {
     return this.colors[(this.index + offset) % this.colors.length]
   }
-
-  this.hint = function () {
-    this.update()
-    return `<svg width="20px" height="20px" xmlns="http://www.w3.org/2000/svg" baseProfile="full" version="1.1" id='swatch' style='background-color:${this.color(1)}'><circle cx='10' cy='10' r='${ronin.cursor.size * 0.75}' fill='${this.color()}'/></svg>`
-  }
 }

desktop/sources/scripts/layers/guide.js

@@ -131,18 +131,18 @@ function Guide () {
     ctx.closePath()
   }
 
-  this.find_units = function (q = ronin.commander.query()) {
+  this.find_units = function (q = ronin.commander.getQuery()) {
     var a = []
 
-    for (method_id in q.methods) {
-      var params = q.methods[method_id]
-      if (params.from && params.to) {
-        a = a.concat(params.from)
-        a = a.concat(params.to)
-      } else {
-        a = a.concat(params)
-      }
-    }
+    // for (method_id in q.methods) {
+    //   var params = q.methods[method_id]
+    //   if (params.from && params.to) {
+    //     a = a.concat(params.from)
+    //     a = a.concat(params.to)
+    //   } else {
+    //     a = a.concat(params)
+    //   }
+    // }
     return a
   }
 

desktop/sources/scripts/modules/brush.js

@@ -23,7 +23,6 @@ function Brush () {
     var c = new Color().rgb_to_hex(pixel)
     var color = new Color(c)
     ronin.cursor.color = color.hex
-    ronin.hint.update()
   })
 
   this.methods.set_color = new Method('set_color', '#ff0033', 'Set color', function (q) {

desktop/sources/scripts/ronin.js

@@ -19,7 +19,6 @@ function Ronin () {
   this.keyboard = new Keyboard()
   this.commander = new Commander()
   this.cursor = new Cursor()
-  this.hint = new Hint()
   this.docs = new Docs()
 
   this.guide = new Guide()
@@ -69,8 +68,6 @@ function Ronin () {
     this.guide.install()
 
     this.guide.update()
-
-    this.hint.install()
     this.theme.install(host, () => { this.update() })
   }
 
@@ -92,8 +89,6 @@ function Ronin () {
     this.guide.update()
     this.commander.update()
 
-    this.frame.resize_to({ width: 900, height: 540 })
-
     this.load()
   }
 

sources/links/fonts.css

@@ -1,15 +0,0 @@
-/* Input Mono */
-
-@font-face {
-    font-family: 'input_mono_regular';
-    src: url('../media/fonts/input_mono_regular.ttf') format('truetype');
-    font-weight: normal;
-    font-style: normal;
-}
-
-@font-face {
-    font-family: 'input_mono_medium';
-    src: url('../media/fonts/input_mono_medium.ttf') format('truetype');
-    font-weight: normal;
-    font-style: normal;
-}

sources/links/main.css

@@ -1,41 +0,0 @@
-body { margin:0px; padding:0px; overflow:hidden; font-family:"input_mono_medium",courier,monospace; background:000;}
-*:focus {outline: none; }
-
-yu { display:block; }
-
-:root { --background: "#222"; --f_high: "#fff";--f_med: "#777";--f_low: "#444";--f_inv: "#000";--b_high: "#000";--b_med: "#affec7";--b_low: "#000";--b_inv: "#affec7"; }  
-
-#cursor { z-index:899; position: absolute; }
-#guide { z-index:810;position: absolute; transition: opacity 250ms; opacity: 0}
-#above { z-index:800; position: absolute; }
-#below { z-index:799; position: absolute; }
-
-#ronin { background:var(--b_low); height: 100vh; width:100vw; background-image:url(../media/assets/grid.svg);}
-#commander, #hint { width: 100vw;line-height: 40px;-webkit-user-select: none;-webkit-app-region: drag;z-index: 900;height: 40px; font-size:11px; cursor: default;}
-#commander { z-index: 9000;background: #000;bottom: 0px;position: relative; transition: top 150ms; }
-#commander input { background: transparent;width: calc(100vw - 30px);display: block;line-height: 40px;font-size: 11px;color: var(--f_low); margin-left:20px; z-index: 9000;position: relative; }
-
-#commander.hidden { top:-40px; }
-#commander.visible { top:0px; }
-
-#hint { color:var(--f_med); padding-left:20px; position: absolute;top: 0px;}
-#hint b { font-family: 'input_mono_regular'; color:var(--f_low);}
-#hint i { font-style: italic; }
-#hint .autocomplete { background:var(--b_high); color:var(--f_low); }
-
-#commander #cursor_hint { position: fixed;top: 0px;right: 10px;color: var(--f_med); padding: 0px 10px; font-size:11px; padding-right: 40px; }
-#commander #cursor_hint .mode {}
-#commander #cursor_hint .zoom::after  { content:"*"; }
-#commander #cursor_hint .pick::after  { content:"#"; }
-#commander #cursor_hint .paint::after { content:"+"; }
-#commander #cursor_hint .erase::after { content:"-"; }
-#commander #cursor_hint .drag::after  { content:"/"; }
-#commander #cursor_hint .target_above::after  { content:"^"; }
-#commander #cursor_hint .target_below::after  { content:"v"; }
-
-#commander #swatch { background:red; display: block; position:fixed; top:10px; right:10px; width:20px; height:20px; border-radius:10px; }
-#commander #swatch .primary { background: red;display: block;position: fixed;top: 20px;right: 20px;width: 20px;height: 20px;border-radius: 10px; }
-
-surface { display: block; background:var(--background); position: absolute; top:0px; transition: all 100ms; }
-surface .layer { border-radius: 4px; overflow: hidden; width:100%; height:100%;}
-

sources/media/assets/grid.svg

@@ -1,3 +0,0 @@
-<svg width="30" height="30" xmlns="http://www.w3.org/2000/svg" baseProfile="full" version="1.1">
-  <circle cx="15" cy="15" r="0.5" fill="#fff"></circle>
-</svg>

sources/scripts/core/commander.js

@@ -1,128 +0,0 @@
-function Commander () {
-  this.el = document.createElement('yu')
-  this.el.id = 'commander'
-  this.input_el = document.createElement('input')
-  this.input_el.value = ''
-
-  this.install = function () {
-    this.el.appendChild(this.input_el)
-    ronin.el.appendChild(this.el)
-    this.input_el.focus()
-  }
-
-  this.validate = function (q = ronin.commander.query()) {
-    if (!ronin.modules[q.module]) { console.log('Unknown module', q.module); return }
-    if (q.raw.indexOf('$') > -1) { console.log('Variables present'); return }
-    if (q.raw.indexOf(';') > -1) { this.validate_multi(q); return }
-
-    // Run methods
-    for (method_id in q.methods) {
-      var method_param = q.methods[method_id]
-      if (!ronin.modules[q.module].methods[method_id]) { console.log('Missing method', method_id); return }
-      ronin.modules[q.module].methods[method_id].run(method_param)
-    }
-
-    ronin.commander.input_el.value = ''
-    ronin.hint.update()
-    ronin.guide.update()
-  }
-
-  this.queue = []
-
-  this.validate_multi = function (q) {
-    var queue = []
-    var queries = q.string.split(';')
-
-    for (id in queries) {
-      var q = new Query(queries[id].trim())
-      queue.push(q)
-    }
-    this.queue = queue
-    this.run_queue()
-  }
-
-  this.run_queue = function () {
-    if (ronin.commander.queue.length == 0) { return }
-
-    ronin.commander.validate(ronin.commander.queue[0])
-
-    ronin.commander.queue = ronin.commander.queue.splice(1, ronin.commander.queue.length - 1)
-
-    setTimeout(ronin.commander.run_queue, 250)
-  }
-
-  this.update = function () {
-    var q = ronin.commander.query()
-    if (ronin.modules[q.module] && ronin.modules[q.module]['preview']) {
-      ronin.modules[q.module].preview(q)
-    }
-    ronin.hint.update()
-    ronin.guide.update()
-  }
-
-  this.autocomplete = function () {
-    var target_module = ronin.commander.query().module
-
-    var ac = ronin.modules[target_module] ? ronin.hint.find_autocomplete(ronin.modules[target_module].methods, ':') : ronin.hint.find_autocomplete(ronin.modules, ' ')
-
-    this.focus()
-    if (ac.lenght < 1 || !ac[0]) { return }
-    if (ronin.commander.query().string.length < 1) { return }
-
-    this.append(ac[0])
-  }
-
-  this.on_input = function (e) {
-    ronin.commander.update()
-  }
-
-  this.is_focused = function () {
-    return this.input_el === document.activeElement
-  }
-
-  this.focus = function () {
-    this.input_el.focus()
-  }
-
-  this.blur = function () {
-    this.input_el.blur()
-  }
-
-  this.active_module = function () {
-    return this.query().module
-  }
-
-  this.inject = function (str) {
-    ronin.commander.input_el.value = str
-    ronin.commander.update()
-    ronin.commander.show()
-  }
-
-  this.append = function (str) {
-    ronin.commander.input_el.value += str
-    ronin.commander.update()
-  }
-
-  this.activate = function () {
-    ronin.commander.autocomplete()
-    ronin.commander.show()
-    setTimeout(() => { ronin.commander.focus }, 100)
-  }
-
-  this.deactivate = function () {
-    this.blur()
-    this.hide()
-  }
-
-  this.show = function () {
-    this.el.className = 'visible'
-  }
-
-  this.hide = function () {
-    this.el.className = 'hidden'
-  }
-
-  this.query = function () {
-    return new Query(ronin.commander.input_el.value)
-  }
-}

sources/scripts/core/hint.js

@@ -1,68 +0,0 @@
-function Hint () {
-  this.el = document.createElement('yu')
-  this.el.id = 'hint'
-  this.cursor_hint_el = document.createElement('yu')
-  this.cursor_hint_el.id = 'cursor_hint'
-
-  this.install = function () {
-    ronin.commander.el.appendChild(this.el)
-    ronin.commander.el.appendChild(this.cursor_hint_el)
-  }
-
-  this.find_autocomplete = function (collection, append = '') {
-    var target = ronin.commander.query().last
-    var a = []
-
-    for (id in collection) {
-      var name = collection[id].name
-      if (name && name.substr(0, target.length) == target) {
-        a.push(name.substr(target.length, 20) + append)
-      }
-    }
-
-    return a
-  }
-
-  this.update = function (e = null) {
-    var html = ''
-
-    for (module_id in ronin.modules) {
-      var module = ronin.modules[module_id]
-      html += module_id + ' '
-    }
-
-    var target_module = ronin.commander.query().module
-    var target_method = Object.keys(ronin.commander.query().methods).length > 0 ? Object.keys(ronin.commander.query().methods)[0] : null
-
-    if (ronin.commander.input_el.value == '') {
-      this.el.innerHTML = html
-    } else if (ronin.modules[target_module] && ronin.modules[target_module].methods[target_method]) {
-      this.el.innerHTML = this.pad(ronin.commander.input_el.value) + ' ' + ronin.modules[target_module].methods[target_method].docs()
-    } else if (ronin.modules[target_module]) {
-      var ac = this.find_autocomplete(ronin.modules[target_module].methods, ':')
-      if (ac.length > 0) {
-        this.el.innerHTML = this.pad(ronin.commander.input_el.value) + "<span class='autocomplete'>" + ac[0] + '</span> > Press tab to autocomplete.'
-      } else {
-        this.el.innerHTML = this.pad(ronin.commander.input_el.value) + ' ' + ronin.modules[target_module].hint()
-      }
-    } else {
-      var ac = this.find_autocomplete(ronin.modules)
-      if (ac.length > 0) {
-        this.el.innerHTML = this.pad(ronin.commander.input_el.value) + "<span class='autocomplete'>" + ac[0] + '</span> > Press tab to autocomplete.'
-      } else if (ronin.commander.input_el.value == '~') {
-        this.el.innerHTML = this.pad(ronin.commander.input_el.value) + ' > Select a color.'
-      } else {
-        this.el.innerHTML = this.pad(ronin.commander.input_el.value) + ' > Unknown command.'
-      }
-    }
-    this.cursor_hint_el.innerHTML = ronin.cursor.hint()
-  }
-
-  this.pad = function (input) {
-    var s = ''
-    for (i = 0; i < input.length; i++) {
-      s += '_'
-    }
-    return "<span style='color:RGBA(0,0,0,0)'>" + s + '</span>'
-  }
-}

sources/scripts/core/module.js

@@ -1,17 +0,0 @@
-function Module (name, docs = 'Missing documentation.') {
-  this.name = name
-  this.methods = {}
-
-  this.docs = docs
-
-  this.hint = function () {
-    var html = ''
-
-    for (id in this.methods) {
-      var v = this.methods[id]
-      html += v.hint()
-    }
-
-    return html.trim() != '' ? ' ' + html.trim() : ''
-  }
-}