We have created a monster

desktop/sources/scripts/commander.js

@@ -113,50 +113,6 @@ function Commander (ronin) {
     return this._input.value.substr(pos).split(' ')[0].replace(/\(/g, '').replace(/\)/g, '').trim()
   }
 
-  // Mouse
-
-  this.mouseRect = { x: 0, y: 0, w: 0, h: 0, a: { x: 0, y: 0 }, b: { x: 0, y: 0 } }
-  this.mouseDown = false
-
-  this.onMouseDown = (e) => {
-    this.mouseDown = true
-    const offset = this.makeMouseOffset({ x: e.offsetX, y: e.offsetY })
-    this.mouseRect.x = offset.x
-    this.mouseRect.y = offset.y
-    this.mouseRect.a.x = offset.x
-    this.mouseRect.a.y = offset.y
-    this.mouseRect.t = 'pos'
-    this.capture()
-    this.show()
-  }
-
-  this.onMouseMove = (e) => {
-    if (this.mouseDown !== true) { return }
-    const offset = this.makeMouseOffset({ x: e.offsetX, y: e.offsetY })
-    this.mouseRect.w = offset.x - this.mouseRect.x
-    this.mouseRect.h = offset.y - this.mouseRect.y
-    this.mouseRect.b.x = offset.x
-    this.mouseRect.b.y = offset.y
-    this.commit()
-  }
-
-  this.onMouseUp = (e) => {
-    this.mouseDown = false
-    const offset = this.makeMouseOffset({ x: e.offsetX, y: e.offsetY })
-    this.mouseRect.w = offset.x - this.mouseRect.x
-    this.mouseRect.h = offset.y - this.mouseRect.y
-    this.mouseRect.b.x = offset.x
-    this.mouseRect.b.y = offset.y
-    this.mouseRect.t = ''
-    this.commit()
-    this._input.focus()
-    ronin.surface.clearGuide()
-  }
-
-  this.makeMouseOffset = (pos) => {
-    return { x: pos.x * ronin.surface.ratio, y: pos.y * ronin.surface.ratio }
-  }
-
   // Injection
 
   this.cache = ''

desktop/sources/scripts/library.js

@@ -403,6 +403,10 @@ function Library (ronin) {
     return window
   }
 
+  this.on = (event, f) => {
+    ronin.bind(event, f)
+  }
+
   this.test = (name, a, b) => {
     if (`${a}` !== `${b}`) {
       console.warn('failed ' + name, a, b)

desktop/sources/scripts/ronin.js

@@ -23,9 +23,10 @@ function Ronin () {
   this.library = new Library(this)
   this.interpreter = new Lisp(this.library, this.includes)
   this.osc = new Osc(this)
-  // Parameters
 
+  // Parameters
   this.always = false
+  this.bindings = {}
 
   this.install = function (host = document.body) {
     this._wrapper = document.createElement('div')
@@ -67,6 +68,36 @@ function Ronin () {
     this.commander.loop()
   }
 
+  this.bind = (event, fn) => {
+    this.bindings[event] = fn
+  }
+
+  this.mouseIsDown = false
+
+  this.onMouseDown = (e, id = 'mouse-down') => {
+    this.mouseIsDown = true
+    if (this.bindings[id]) {
+      this.bindings[id](this.makeMouseOffset({ x: e.offsetX, y: e.offsetY }, 'mouse-down'))
+    }
+  }
+
+  this.onMouseMove = (e, id = 'mouse-move') => {
+    if (this.bindings[id]) {
+      this.bindings[id](this.makeMouseOffset({ x: e.offsetX, y: e.offsetY }, 'mouse-move'))
+    }
+  }
+
+  this.onMouseUp = (e, id = 'mouse-up') => {
+    this.mouseIsDown = false
+    if (this.bindings[id]) {
+      this.bindings[id](this.makeMouseOffset({ x: e.offsetX, y: e.offsetY }, 'mouse-up'))
+    }
+  }
+
+  this.makeMouseOffset = (pos, type) => {
+    return { x: pos.x * ronin.surface.ratio, y: pos.y * ronin.surface.ratio, 'type': type, 'is-down': this.mouseIsDown }
+  }
+
   // Zoom
 
   this.modZoom = function (mod = 0, set = false) {

desktop/sources/scripts/surface.js

@@ -12,9 +12,9 @@ function Surface (ronin) {
     host.appendChild(this.el)
     host.appendChild(this._guide)
     window.addEventListener('resize', (e) => { this.onResize() }, false)
-    this._guide.addEventListener('mousedown', ronin.commander.onMouseDown, false)
+    this._guide.addEventListener('mousedown', ronin.onMouseDown, false)
-    this._guide.addEventListener('mousemove', ronin.commander.onMouseMove, false)
+    this._guide.addEventListener('mousemove', ronin.onMouseMove, false)
-    this._guide.addEventListener('mouseup', ronin.commander.onMouseUp, false)
+    this._guide.addEventListener('mouseup', ronin.onMouseUp, false)
   }
 
   this.start = function () {

examples/events.lisp

@@ -0,0 +1,37 @@
+(clear)
+;
+(def prev-pos {:x 0 :y 0})
+;
+(defn draw-line 
+  (e) 
+  (
+    (debug e) 
+    (debug prev-pos) 
+    (if 
+      (of e :is-down) 
+      (
+        (stroke 
+          (line prev-pos e) 2 "white")
+        (set prev-pos :x 
+          (of e :x))
+        (set prev-pos :y 
+          (of e :y))))))
+;
+(defn draw-circle 
+  (e) 
+  (
+    (debug e) 
+    (debug 
+      (of e :type)) 
+    (def stroke-color 
+      (if 
+        (eq 
+          (of e :type) "mouse-down") "red" "#72dec2")) 
+    (stroke 
+      (circle 
+        (of e :x) 
+        (of e :y) 10) 4 stroke-color)))
+;
+(on "mouse-down" draw-circle)
+(on "mouse-up" draw-circle)
+(on "mouse-move" draw-line)