making the point/vec2 naming more normal

6 files changed, 84 insertions, 380 deletions

diff --git a/assets/javascripts/math/point.js b/assets/javascripts/math/point.js
index 5a5d0db..bb2dc4f 100644
--- a/assets/javascripts/math/point.js
+++ b/assets/javascripts/math/point.js
@@ -1,230 +1,38 @@
 (function(){
 	function clamp(n,a,b){ return n<a?a:n<b?n:b }
 
-	var point = function (a,b){
-		this.a = a
-		this.b = b
+	var point = function (x, y){
+		this.x = x
+		this.y = y
 	}
 
 	point.prototype.distanceTo = function(p){
 	  return Math.sqrt(this.dot(p))
 	}
 	point.prototype.dot = function(p){
-	  return Math.pow(this.a - p.a, 2) + Math.pow(this.b - p.b, 2)
-	}
-
-
-	point.prototype.magnitude = function(){
-		return this.b-this.a
-	}
-	point.prototype.length = function(){
-		return Math.abs(this.b-this.a)
-	}
-	point.prototype.dist = function(){
-		return dist(0,this.a,0,this.b)
+	  return Math.pow(this.x - p.x, 2) + Math.pow(this.y - p.y, 2)
 	}
 	point.prototype.clone = function(){
-		return new point(this.a, this.b)
-	}
-	point.prototype.assign = function(v){
-		this.a = v.a
-		this.b = v.b
-		return this
-	}
-	point.prototype.abs = function(){
-		if (this.b < this.a) {
-			this.invert()
-		}
-		return this
-	}
-	point.prototype.invert = function(){
-		this.a = this.a ^ this.b
-		this.b = this.a ^ this.b
-		this.a = this.a ^ this.b
-		return this
-	}
-	point.prototype.midpoint = function(){
-		return lerp(0.5, this.a, this.b)
-	}
-	point.prototype.lerp = function(n){
-	  return lerp(n, this.a, this.b)
-	}
-	point.prototype.eq = function(v){
-		return this.a == v.a && this.b == v.b
-	}
-	point.prototype.add = function(n){
-		this.a += n
-		this.b += n
-		return this
-	}
-	point.prototype.sub = function(n){
-		this.a -= n
-		this.b -= n
-		return this
-	}
-	point.prototype.mul = function(n){
-		this.a *= n
-		this.b *= n
-		return this
-	}
-	point.prototype.div = function(n){
-		this.a /= n
-		this.b /= n
-		return this
-	}
-	point.prototype.addVec = function(v){
-	  this.a += v.a
-	  this.b += v.b
-	  return this
-	}
-  point.prototype.subVec = function(v){
-	  this.a -= v.a
-	  this.b -= v.b
-	  return this
-	}
-	point.prototype.zero = function(){
-		this.a = this.b = 0
-	}
-	point.prototype.round = function(){
-	  this.a = Math.round(this.a)
-	  this.b = Math.round(this.b)
-	}
-	point.prototype.setPosition = function(n){
-		var len = this.length()
-		this.a = n
-		this.b = n + len
-	}
-	point.prototype.setLength = function(n){
-		this.b = this.a + n
-	}
-	point.prototype.normalize = function(){
-		var dim = max(this.a, this.b)
-		this.a = this.a/dim
-		this.b = this.b/dim
-		return this
-	}
-	point.prototype.contains = function(n){
-		return this.a <= n && n <= this.b
-	}
-	point.prototype.containsCenter = function(n){
-		return this.a < n && n < this.b
-	}
-	point.prototype.containsDisc = function(n,r){
-		return this.a <= n-r && n+r <= this.b
-	}
-	point.prototype.clamp = function(n){
-		return clamp(n, this.a, this.b)
-	}
-	point.prototype.clampDisc = function(n,r){
-		return clamp(n, this.a+r, this.b-r)
-	}
-	point.prototype.intersects = function(v){
-		if (this.a == v.a || this.b == v.b || this.a == v.b || this.b == v.a) {
-			return true
-		}
-		else if (this.a < v.a) {
-			return (v.a < this.b && this.b <= v.b) || (this.a < v.b && v.b <= this.b)
-		}
-		else if (this.a > v.a) {
-			return (this.a < v.b && v.b <= this.b) || (v.a < this.b && this.b <= v.b)
-		}
-	}
-	point.prototype.overlaps = function(v){
-		if (this.a == v.a || this.b == v.b) {
-			return true
-		}
-		if (this.a < v.a) {
-			return (v.a < this.b && this.b < v.b) || (this.a < v.b && v.b < this.b)
-		}
-		else if (v.a < this.a) {
-			return (this.a < v.b && v.b < this.b) || (v.a < this.b && this.b < v.b)
-		}
-	}
-
-
-	point.prototype.adjacent = function(v){
-		if (this.a == v.a || this.b == v.b || this.a == v.b || this.b == v.a) {
-			return true
-		}
-		return false
-	}
-	point.prototype.union = function(v){
-		if (this.intersects(v)) {
-			return new point( Math.min(this.a,v.a), Math.max(this.b, v.b) )
-		}
-	}
-	point.prototype.intersection = function(v){
-		if (this.intersects(v)) {
-			return new point( Math.max(this.a,v.a), Math.min(this.b, v.b) )
-		}
-	}
-
-	// given two vectors, test how they overlap
-	// return the set of overlapping segments in the initial vector, labelled with sides
-	point.prototype.split = function(v, left, right){
-		var intervals = [], _len
-
-		if (this.eq(v)) {
-			intervals.push([ new point( this.a, this.b ), left | right ])
-		}
-		
-		// a---A===b---B  (rightways overlap)
-		else if (this.contains(v.a) && v.contains(this.b)) {
-			intervals.push([ new point( this.a,    v.a ), left  ])
-			intervals.push([ new point(    v.a, this.b ), right ])
-		}
-
-    // A---a===B---b  (leftways overlap)
-		else if (v.contains(this.a) && this.contains(v.b)) {
-			intervals.push([ new point( this.a,    v.b ), left  ])
-			intervals.push([ new point(    v.b, this.b ), right ])
-		}
-	
-		// a---A===B---b  (contains v)
-		else if (this.contains(v.a) && this.contains(v.b)) {
-			intervals.push([ new point( this.a,    v.a ), left  ])
-			intervals.push([ new point(    v.a, 	  v.b ), 0     ])
-			intervals.push([ new point(    v.b, this.b ), right ])
-		}
-		
-		// A---a===b---B  (contained in v)
-		else { // if (v.contains(this.a) && v.contains(v.b)) {
-			intervals.push([ new point( this.a, this.b ), left | right ])
-		}
-		
-		// cull empty vectors
-		_len = intervals.length
-		if (_len > 1) {
-			if (intervals[0][0].magnitude() == 0) {
-				intervals[1][1] |= intervals[0][1]
-				intervals.shift()
-			}
-			else if (intervals[_len-1][0].magnitude() == 0) {
-				intervals[_len-2][1] |= intervals[_len-1][1]
-				intervals.pop()
-			}
-		}
-		
-		return intervals
+	  return new point(this.x, this.y)
 	}
 
 	point.prototype.toString = function(){
-		return "[" + round(this.a) + " " + round(this.b) + "]"
+		return "[" + round(this.x) + " " + round(this.y) + "]"
 	}
 	point.prototype.exactString = function(){
-		return "[" + this.a + " " + this.b + "]"
+		return "[" + this.x + " " + this.y + "]"
 	}
 	point.prototype.serialize = function(){
-		return [ round(this.a), round(this.b) ]
+		return [ round(this.x), round(this.y) ]
 	}
 	point.prototype.deserialize = function(data){
-		this.a = data[0]
-		this.b = data[1]
+		this.x = data[0]
+		this.y = data[1]
 	}
 	point.prototype.quantize = function(n){
 		n = n || 10
-		this.a = quantize(this.a, n)
-		this.b = quantize(this.b, n)
+		this.x = quantize(this.x, n)
+		this.y = quantize(this.y, n)
 	}
 	
 	if ('window' in this) {
diff --git a/assets/javascripts/math/vec2.js b/assets/javascripts/math/vec2.js
index 550d0db..75fd859 100644
--- a/assets/javascripts/math/vec2.js
+++ b/assets/javascripts/math/vec2.js
@@ -8,146 +8,44 @@
 		point = require('./point')
 	}
 
-	var vec2 = function (x0,y0,x1,y1){
+	var vec2 = function (x0,y0, x1,y1){
 		if (x0 instanceof point) {
-			this.x = x0
-			this.y = y0
+			this.a = x0
+			this.b = y0
 		}
 		else if (x1 === undefined) {
-			this.x = new point(x0,x0)
-			this.y = new point(y0,y0)
+			this.a = new point(x0,y0)
+			this.b = new point(x0,y0)
 		}
 		else {
-			this.x = new point(x0,x1)
-			this.y = new point(y0,y1)
+			this.a = new point(x0,y0)
+			this.b = new point(x1,y1)
 		}
 	}
 	vec2.prototype.clone = function(){
-		return new vec2( this.x.clone(), this.y.clone() )
-	}
-	vec2.prototype.assign = function(r) {
-	  this.x.assign(r.x)
-	  this.y.assign(r.y)
-		return this
-	}
-	vec2.prototype.center = function(){
-		return new point(this.x.midpoint(), this.y.midpoint())
-	}
-	vec2.prototype.area = function(){
-		return this.x.length() * this.y.length()
-	}
-	vec2.prototype.magnitude = function(){
-		return dist(this.x.a, this.y.a, this.x.b, this.y.b)
-	}
-	vec2.prototype.maxDimension = function(){
-		return abs(this.width) > abs(this.height) ? this.width : this.height
+		return new vec2( this.a.clone(), this.b.clone() )
 	}
 
-	vec2.prototype.mul = function(n){
-		this.x.mul(n)
-		this.y.mul(n)
-		return this
-	}
-	vec2.prototype.div = function(n){
-		this.x.div(n)
-		this.y.div(n)
-		return this
-	}
+	vec2.prototype.delta = function(){ return new point( this.width(), this.height() ) }
+	vec2.prototype.width = function(){ return this.b.x - this.a.x }
+	vec2.prototype.height = function(){ return this.b.y - this.a.y }
 
-	vec2.prototype.translate = function(translation){
-		var translation = translation || this.translation
-		this.x.abs().add(translation.a)
-		this.y.abs().add(translation.b)
-		this.translation.a = this.translation.b = 0
-		return this
-	}
 
-	vec2.prototype.contains = function(x,y){
-		return this.x.contains(x) && this.y.contains(y)
-	}
-	vec2.prototype.contains_point = function(p){
-	  return this.x.contains(p.x) && this.y.contains(p.y)
-	}
-	vec2.prototype.containsDisc = function(x,y,r){
-		return this.x.containsDisc(x,r) && this.y.containsDisc(y,r)
-	}
-	vec2.prototype.overlaps = function(rect){
-		return this.x.overlaps(rect.x) && this.y.overlaps(rect.y)
-	}
-	vec2.prototype.intersects = function(r){
-		var corner_intersect = (this.x.b === r.x.a && this.y.b === r.y.a)
-		return this.x.intersects(r.x) && this.y.intersects(r.y) && ! corner_intersect
-	}
-	vec2.prototype.adjacent = function(r){
-		return this.x.adjacent(r.x) && this.y.adjacent(r.y)
-	}
-	vec2.prototype.eq = function(r){
-		return this.x.eq(r.x) && this.y.eq(r.y)
-	}
-	vec2.prototype.fits = function(v){
-		return this.x.length() >= v.a && this.y.length() >= v.b
-	}
-	vec2.prototype.zero = function(){
-		this.a.zero()
-		this.b.zero()
-	}
-// 	vec2.prototype.nearEdge = function (x, y, r) {
-// 		var edges = 0
-// 		if (x < this.x.a+r) {
-// 			edges |= LEFT
-// 		}
-// 		else if (x > this.x.b-r) {
-// 			edges |= RIGHT
-// 		}
-// 		if (y < this.y.a+r) {
-// 			edges |= FRONT
-// 		}
-// 		else if (y > this.y.b-r) {
-// 			edges |= BACK
-// 		}
-// 		return edges
-// 	}
-	vec2.prototype.width = function(){ return this.x.length() }
-	vec2.prototype.height = function(){ return this.y.length() }
-	vec2.prototype.delta = function(){ return new point( this.x.magnitude(), this.y.magnitude() ) }
-	vec2.prototype.expand = function(rect){
-	  this.x.a = Math.min( this.x.a, rect.x.a )
-	  this.x.b = Math.max( this.x.b, rect.x.b )
-	  this.y.a = Math.min( this.y.a, rect.y.a )
-	  this.y.b = Math.max( this.y.b, rect.y.b )
-	  return this
-	}
-	vec2.prototype.square = function(){
-	  var width = this.x.length()
-	  var height = this.y.length()
-	  var diff
-	  if (width < height) {
-	    diff = (height - width) / 2
-	    this.x.a -= diff
-	    this.x.b += diff
-	  }
-	  else {
-	    diff = (width - height) / 2
-	    this.y.a -= diff
-	    this.y.b += diff
-	  }
-	  return this
-	}
 	vec2.prototype.toString = function(){
-		var s = "[" + this.x.toString() + " " + this.y.toString() + "] "
+		var s = "[" + this.a.toString() + " " + this.b.toString() + "] "
 		return s
 	}
 	vec2.prototype.exactString = function(){
-		var s = "[" + this.x.exactString() + " " + this.y.exactString() + "] "
+		var s = "[" + this.a.exactString() + " " + this.b.exactString() + "] "
 		return s
 	}
 	
 	vec2.prototype.serialize = function(){
-		return { x: this.x.serialize(), y: this.y.serialize() }
+		return { a: this.a.serialize(), b: this.b.serialize() }
 	}
 	vec2.prototype.quantize = function(n){
-		this.x.quantize(n)
-		this.y.quantize(n)
+		this.a.quantize(n)
+		this.b.quantize(n)
 		return this
 	}
 	
diff --git a/assets/javascripts/util/mouse.js b/assets/javascripts/util/mouse.js
index d113d10..6d07f07 100644
--- a/assets/javascripts/util/mouse.js
+++ b/assets/javascripts/util/mouse.js
@@ -5,17 +5,17 @@
       el: document.querySelector("#map"),
       down: function(e, cursor){
         // do something with val
-        // cursor.x.a
-        // cursor.y.a
+        // cursor.a.x
+        // cursor.a.y
       },
       move: function(e, cursor){
         // var delta = cursor.delta()
-        // delta.a (x)
-        // delta.b (y)
+        // delta.x
+        // delta.y
       },
       up: function(e, cursor, new_cursor){
-        // cursor.x.a
-        // cursor.y.a
+        // cursor.a.x
+        // cursor.a.y
       },
     })
 
@@ -43,7 +43,7 @@ function mouse (opt) {
   base.creating = false
   base.dragging = false
 
-  base.cursor = new vec2(0,0,0,0)
+  base.cursor = new vec2 (0,0,0,0)
 
   base.tube = new Tube ()
   opt.down && base.tube.on("down", opt.down)
@@ -102,8 +102,7 @@ function mouse (opt) {
     
     var pos = positionFromMouse(e)
     
-    var x = pos.a, y = pos.b
-    base.cursor = new vec2 (x,y, x,y)
+    base.cursor = new vec2 (pos.x, pos.y)
     base.down = true
     e.clickAccepted = true
     
@@ -125,17 +124,17 @@ function mouse (opt) {
       pos.quantize(10)
     }
 
-    var x = pos.a, y = pos.b
+    var x = pos.x, y = pos.y
     
     if (base.down) {
-      base.cursor.x.b = x
-      base.cursor.y.b = y
+      base.cursor.b.x = x
+      base.cursor.b.y = y
       base.tube("drag", e, base.cursor)
       e.stopPropagation()
     }
     else {
-      base.cursor.x.a = base.cursor.x.b = x
-      base.cursor.y.a = base.cursor.y.b = y
+      base.cursor.a.x = base.cursor.b.x = x
+      base.cursor.a.y = base.cursor.b.y = y
       base.tube("move", e, base.cursor)
     }
   }
@@ -156,7 +155,7 @@ function mouse (opt) {
       e.stopPropagation()
       base.down = false
       pos = positionFromMouse(e)
-      new_cursor = new vec2 (pos.a, pos.b)
+      new_cursor = new vec2 (pos.x, pos.y)
       base.tube("up", e, base.cursor, new_cursor)
       base.cursor = new_cursor
     }
diff --git a/assets/test/brush/index.html b/assets/test/brush/index.html
index 4bdaf98..cd31198 100644
--- a/assets/test/brush/index.html
+++ b/assets/test/brush/index.html
@@ -33,23 +33,23 @@ var mymouse = new mouse({
   el: canvas,
   down: function(e, cursor){
     drawing = true
-    lastPoint.a = cursor.x.a
-    lastPoint.b = cursor.y.a
+    lastPoint.x = cursor.a.x
+    lastPoint.y = cursor.a.y
 //     mask.clearRect(0,0,w,h)
 //     imagedata = ctx.getImageData( 0, 0, canvas.width, canvas.height )
 //     data = imagedata.data
   },
   drag: function(e, cursor){
-    newPoint.a = cursor.x.b
-    newPoint.b = cursor.y.b
+    newPoint.x = cursor.b.x
+    newPoint.y = cursor.b.y
     drawLine(lastPoint, newPoint)
 
-    lastPoint.a = newPoint.a
-    lastPoint.b = newPoint.b
+    lastPoint.x = newPoint.x
+    lastPoint.y = newPoint.y
   },
   up: function(e, cursor, new_cursor){
     drawing = false
-    drawLine({ a: cursor.x.a, b: cursor.y.a }, { a: cursor.x.b, b: cursor.y.b })
+    drawLine(cursor.a, cursor.b)
     console.log("hi")
   },
 })
@@ -57,11 +57,11 @@ var mymouse = new mouse({
 function drawLine (u, v) {
   var radius = 10
 
-  var xmin = Math.min(u.a, v.a)
-  var ymin = Math.min(u.b, v.b)
+  var xmin = Math.min(u.x, v.x)
+  var ymin = Math.min(u.y, v.y)
 
-  var w = scratch.width = abs(u.a - v.a) + radius*2
-  var h = scratch.height = abs(u.b - v.b) + radius*2
+  var w = scratch.width = abs(u.x - v.x) + radius*2
+  var h = scratch.height = abs(u.y - v.y) + radius*2
 
   var p = new point (0,0)
   var radius2 = radius * radius
@@ -74,8 +74,8 @@ function drawLine (u, v) {
     for (j = 0; j < h; j++) {
       t = (j * w + i) * 4
       
-      p.a = xmin + i - radius
-      p.b = ymin + j - radius
+      p.x = xmin + i - radius
+      p.y = ymin + j - radius
       
       dist = distToSegmentSquared( p, u, v )
 
@@ -96,14 +96,14 @@ drawLine( new point( 100, 100 ), new point( 100, 400 ) )
 // drawLine( new point( 100, 100 ), new point( 400, 400 ) )
 
 function sqr(x) { return x * x }
-function dist2(v, w) { return sqr(v.a - w.a) + sqr(v.b - w.b) }
+function dist2(v, w) { return sqr(v.x - w.x) + sqr(v.y - w.y) }
 function distToSegmentSquared (p, v, w) {
 	var l2 = dist2(v, w)
-  var t = ((p.a - v.a) * (w.a - v.a) + (p.b - v.b) * (w.b - v.b)) / l2
+  var t = ((p.x - v.x) * (w.x - v.x) + (p.y - v.y) * (w.y - v.y)) / l2
   if (t < 0) return dist2(p, v)
   if (t > 1) return dist2(p, w)
-  return dist2(p, { a: v.a + t * (w.a - v.a),
-                    b: v.b + t * (w.b - v.b) })
+  return dist2(p, { x: v.x + t * (w.x - v.x),
+                    y: v.y + t * (w.y - v.y) })
 }
 
 
diff --git a/assets/test/brush/index2.html b/assets/test/brush/index2.html
index 004b030..7094ca8 100644
--- a/assets/test/brush/index2.html
+++ b/assets/test/brush/index2.html
@@ -13,6 +13,7 @@ canvas { position: absolute; top: 0; left: 0; }
 <script src="/assets/javascripts/vendor/bower_components/jquery/dist/jquery.min.js"></script>
 <script src="/assets/javascripts/vendor/bower_components/lodash/dist/lodash.min.js"></script>
 <script src="/assets/javascripts/vendor/canvasutilities.js"></script>
+<script src="/assets/javascripts/vendor/jsBezier-0.6.js"></script>
 <script src="/assets/javascripts/vendor/tube.js"></script>
 <script src="/assets/javascripts/math/util.js"></script>
 <script src="/assets/javascripts/math/point.js"></script>
@@ -35,24 +36,23 @@ var mymouse = new mouse({
   el: canvas,
   down: function(e, cursor){
     drawing = true
-    lastPoint.a = cursor.x.a
-    lastPoint.b = cursor.y.a
+    lastPoint.x = cursor.a.x
+    lastPoint.y = cursor.a.y
     maskCtx.clearRect(0,0,w,h)
     drawLine(lastPoint, lastPoint)
 //     imagedata = ctx.getImageData( 0, 0, canvas.width, canvas.height )
 //     data = imagedata.data
   },
   drag: function(e, cursor){
-    newPoint.a = cursor.x.b
-    newPoint.b = cursor.y.b
+    newPoint.x = cursor.b.x
+    newPoint.y = cursor.b.y
     drawLine(lastPoint, newPoint)
 
-    lastPoint.a = newPoint.a
-    lastPoint.b = newPoint.b
+    lastPoint.x = newPoint.x
+    lastPoint.y = newPoint.y
   },
   up: function(e, cursor, new_cursor){
     drawing = false
-//     drawLine({ a: cursor.x.a, b: cursor.y.a }, { a: cursor.x.b, b: cursor.y.b })
 		ctx.globalCompositeOperation = "multiply"
 		ctx.drawImage(mask, 0, 0)
     maskCtx.clearRect(0,0,w,h)
@@ -62,11 +62,11 @@ var mymouse = new mouse({
 function drawLine (u, v) {
   var radius = 20
 
-  var xmin = Math.min(u.a, v.a)
-  var ymin = Math.min(u.b, v.b)
+  var xmin = Math.min(u.x, v.x)
+  var ymin = Math.min(u.y, v.y)
 
-  var w = scratch.width = abs(u.a - v.a) + radius*2
-  var h = scratch.height = abs(u.b - v.b) + radius*2
+  var w = scratch.width = abs(u.x - v.x) + radius*2
+  var h = scratch.height = abs(u.y - v.y) + radius*2
 
   var p = new point (0,0)
   var radius2 = radius * radius
@@ -81,8 +81,8 @@ function drawLine (u, v) {
     for (j = 0; j < h; j++) {
       t = (j * w + i) * 4
       
-      p.a = xmin + i - radius
-      p.b = ymin + j - radius
+      p.x = xmin + i - radius
+      p.y = ymin + j - radius
       
       dist = distToSegmentSquared( p, u, v )
 
@@ -96,7 +96,7 @@ function drawLine (u, v) {
     }
   }
   scratchCtx.putImageData(imagedata, 0, 0)
-	maskCtx.globalCompositeOperation = 'destination-out';
+	maskCtx.globalCompositeOperation = 'darken';
   maskCtx.drawImage(scratch, xmin - radius, ymin - radius)
 }
 
@@ -105,16 +105,15 @@ drawLine( new point( 100, 100 ), new point( 400, 100 ) )
 drawLine( new point( 100, 100 ), new point( 400, 400 ) )
 
 function sqr(x) { return x * x }
-function dist2(v, w) { return sqr(v.a - w.a) + sqr(v.b - w.b) }
+function dist2(v, w) { return sqr(v.x - w.x) + sqr(v.y - w.y) }
 function distToSegmentSquared (p, v, w) {
 	var l2 = dist2(v, w)
   if (l2 == 0) return dist2(p, v)
-  var t = ((p.a - v.a) * (w.a - v.a) + (p.b - v.b) * (w.b - v.b)) / l2
+  var t = ((p.x - v.x) * (w.x - v.x) + (p.y - v.y) * (w.y - v.y)) / l2
   if (t < 0) return dist2(p, v)
   if (t > 1) return dist2(p, w)
-  return dist2(p, { a: v.a + t * (w.a - v.a),
-                    b: v.b + t * (w.b - v.b) })
+  return dist2(p, { x: v.x + t * (w.x - v.x),
+                    y: v.y + t * (w.y - v.y) })
 }
 
-
 </script>
diff --git a/assets/test/lasso/index.html b/assets/test/lasso/index.html
index f136f6d..62a9744 100644
--- a/assets/test/lasso/index.html
+++ b/assets/test/lasso/index.html
@@ -28,22 +28,22 @@ var mymouse = new mouse({
   down: function(e, cursor){
     // compare to initial point
     if (placing) {
-      if (points.length > 2 && points[0].distanceTo({ a: cursor.x.a, b: cursor.y.a }) < 3) {
+      if (points.length > 2 && points[0].distanceTo(cursor.a) < 3) {
         points.push(points[0].clone())
         placing = false
       }
       else {
-        points.push( new point( cursor.x.a, cursor.y.a ) )
+        points.push( cursor.a )
       }
     }
     else {
       placing = true
       points.length = 0
-      points.push( new point( cursor.x.a, cursor.y.a ) )
+      points.push( cursor.a )
     }
   },
   move: function(e, cursor){
-    if (placing && points.length > 2 && points[0].distanceTo({ a: cursor.x.a, b: cursor.y.a }) < 3 ) {
+    if (placing && points.length > 2 && points[0].distanceTo(cursor.a) < 3 ) {
       document.body.style.cursor = "pointer"
     }
     else {
@@ -62,15 +62,15 @@ function draw (time) {
 
   if (points.length == 1) {
     ctx.fillStyle = "#000"
-    ctx.fillRect(points[0].a, points[0].b, 1, 1)
+    ctx.fillRect(points[0].x, points[0].y, 1, 1)
   }
   if (points.length > 1) {
     ctx.fillStyle = "#000"
     ctx.strokeStyle = "#000"
     ctx.beginPath()
-    ctx.moveTo(points[0].a, points[0].b)
+    ctx.moveTo(points[0].x, points[0].y)
     points.forEach(function(point, i){
-      i && ctx.lineTo(point.a, point.b)
+      i && ctx.lineTo(point.x, point.y)
     })
     if (placing) {
       ctx.stroke()