1 files changed, 148 insertions, 0 deletions
diff --git a/js/ui/selection.js b/js/ui/selection.js
new file mode 100644
index 0000000..cbd15bf
--- /dev/null
+++ b/js/ui/selection.js
@@ -0,0 +1,148 @@
+var selection = (function(){
+
+  var creating = false, moving = false, copying = false
+  
+	var selection_canvas = new Matrix (1, 1, function(x,y){
+		var lex = new Lex (x,y)
+		lex.build()
+		return lex
+	})
+	
+	var selector_el = document.createElement("div")
+	selector_el.className = "selector_el"
+	selection_canvas.append(selector_el)
+	document.body.appendChild(selector_el)
+
+  // in selection mode..
+  // - we start by clicking the canvas. this positions the selection, and copies
+  //   the character
+  // - then we drag down and to the right. this resizes the selection and pushes new
+  //   rows and columns. each of these copies the character underneath.
+  // - on mouseup, the selection is locked. then..
+  // - drag the selection to move it -- this "cuts" it and leaves a blank space on the canvas.
+  // - shift-drag the selection to copy it
+  
+  var a = [0, 0]
+  var b = [0, 0]
+  var c = [0, 0]
+  var d = [0, 0]
+  
+  function reset () {
+  	a[0] = a[1] = b[0] = b[1] = 0
+  }
+  function left (a,b) { return min(a[0],b[0]) }
+  function top (a,b) { return min(a[1],b[1]) }
+  function right (a,b) { return max(a[0],b[0]) }
+  function bottom (a,b) { return max(a[1],b[1]) }
+  function width (a,b) { return abs(a[0]-b[0])+1 }
+  function height (a,b) { return abs(a[1]-b[1])+1 }
+  function mag_x (a,b) { return a[0]-b[0] }
+  function mag_y (a,b) { return a[1]-b[1] }
+  function orient (a,b) {
+  	var l = left(a,b), m = top(a,b), n = right(a,b), o = bottom(a,b)
+  	a[0] = l ; a[1] = m ; b[0] = n ; b[1] = o
+  }
+  
+  function contains (a,b,point) {
+    var contains_x = a[0] <= point[0] && point[0] <= b[0]
+    var contains_y = a[1] <= point[1] && point[1] <= b[1]
+    return (contains_x && contains_y)
+  }
+  function reposition (a,b) {
+    var cell = canvas.aa[top(a,b)][left(a,b)].span
+    var cell_left = cell.offsetLeft
+    var cell_top = cell.offsetTop
+    var cell_width = 9
+    var cell_height = 17
+    var w = width(a,b)
+    var h = height(a,b)
+    selector_el.style.top = (cell_top-1) + "px"
+    selector_el.style.left = (cell_left-2) + "px"
+    selector_el.style.width = (cell_width*w+1) + "px"
+    selector_el.style.height = (cell_height*h+1) + "px"
+  }
+  function down (e, lex, point){
+    if ( ! contains(a,b,point) ) {
+      copying = false
+      moving = false
+      creating = true
+      a[0] = point[0]
+      a[1] = point[1]
+      b[0] = point[0]
+      b[1] = point[1]
+			reposition(a,b)
+      selector_el.classList.add("creating")
+		} else {
+      copying = false
+      moving = true
+      creating = false
+      c[0] = point[0]
+      c[1] = point[1]
+      d[0] = point[0]
+      d[1] = point[1]
+    }
+    show()
+		selector_el.classList.remove("dragging")
+  }
+  function move (e, lex, point){
+    if (creating) {
+      b[0] = point[0]
+      b[1] = point[1]
+      reposition(a,b)
+    }
+    else if (moving) {
+      d[0] = point[0]
+      d[1] = point[1]
+      var dx = - clamp( mag_x(c,d), b[0] - canvas.w + 1, a[0] )
+      var dy = - clamp( mag_y(c,d), b[1] - canvas.h + 1, a[1] )
+      reposition( [ a[0] + dx, a[1] + dy ], [ b[0] + dx, b[1] + dy ])
+    }
+    else if (copying) {
+    }
+  }
+  function up (e) {
+  	if (creating) {
+  		orient(a,b)
+  		selection_canvas.resize(width(a,b), height(a,b))
+  		blit.copy_from( canvas, selection_canvas, a[0], a[1] )
+  		selection_canvas.build()
+      selector_el.classList.remove("creating")
+  	}
+  	if (moving) {
+      var dx = - clamp( mag_x(c,d), b[0] - canvas.w + 1, a[0] )
+      var dy = - clamp( mag_y(c,d), b[1] - canvas.h + 1, a[1] )
+      a[0] += dx
+      a[1] += dy
+      b[0] += dx
+      b[1] += dy
+  		blit.copy_to( canvas, selection_canvas, a[0], a[1] )
+  	}
+  	if (copying) {
+  	}
+  	creating = moving = copying = false
+		selector_el.classList.remove("dragging")
+  }
+  
+  function show () {
+    selecting = true
+    controls.grid.show()
+  }
+  function hide () {
+  	reset()
+    selector_el.style.top = "-9999px"
+    selector_el.style.left = "-9999px"
+    selector_el.style.width = "0px"
+    selector_el.style.height = "0px"
+    selecting = false
+  }
+  
+  var selection = {}
+  selection.down = down
+  selection.move = move
+  selection.up = up
+  selection.canvas = selection_canvas
+  selection.show = show
+  selection.hide = hide
+	return selection
+
+})()