From f599c7edf7e635241e839fc024e4016ae0dcc210 Mon Sep 17 00:00:00 2001
From: Jules Laplace <jules@okfoc.us>
Date: Fri, 31 Oct 2014 16:03:12 -0400
Subject: intersection test 2 - hit-testing on wall structure

---
 public/assets/test/intersect2.html | 218 +++++++++++++++++++++++++++++++++++++
 1 file changed, 218 insertions(+)
 create mode 100644 public/assets/test/intersect2.html

(limited to 'public/assets/test/intersect2.html')

diff --git a/public/assets/test/intersect2.html b/public/assets/test/intersect2.html
new file mode 100644
index 0000000..fade288
--- /dev/null
+++ b/public/assets/test/intersect2.html
@@ -0,0 +1,218 @@
+<style>
+body,html{margin:0;padding:0;}
+#hud { position: absolute; top: 0; left: 0; pointer-events: none; }
+</style>
+<canvas id="canvas"></canvas>
+<div id="hud"></div>
+
+<script src="/assets/javascripts/util.js"></script>
+<script src="/assets/javascripts/vendor/tube.js"></script>
+<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/mx/mx.js"></script>
+<script src="/assets/javascripts/mx/extensions/mx.scene.js"></script>
+<script src="/assets/javascripts/rectangles/util/constants.js"></script>
+<script src="/assets/javascripts/rectangles/util/mouse.js"></script>
+<script src="/assets/javascripts/rectangles/util/sort.js"></script>
+<script src="/assets/javascripts/rectangles/util/uid.js"></script>
+<script src="/assets/javascripts/rectangles/models/vec2.js"></script>
+<script src="/assets/javascripts/rectangles/models/rect.js"></script>
+<script src="/assets/javascripts/rectangles/models/room.js"></script>
+<script src="/assets/javascripts/rectangles/models/surface.js"></script>
+<script src="/assets/javascripts/rectangles/models/wall.js"></script>
+<script src="/assets/javascripts/rectangles/models/floor.js"></script>
+<script src="/assets/javascripts/rectangles/engine/rooms/_rooms.js"></script>
+<script src="/assets/javascripts/rectangles/engine/rooms/_walls.js"></script>
+<script src="/assets/javascripts/rectangles/engine/rooms/clipper.js"></script>
+<script src="/assets/javascripts/rectangles/engine/rooms/builder.js"></script>
+<script src="/assets/javascripts/rectangles/engine/rooms/grouper.js"></script>
+<script src="/assets/javascripts/vendor/canvasutilities.js"></script>
+<script>
+
+var ctx = canvas.getContext('2d')
+var scene = new MX.Scene()
+
+var w = canvas.width = window.innerWidth
+var h = canvas.height = window.innerHeight
+
+var cursor = new Rect( 150, 250, 150, 250 )
+var wall_vec = new Rect ( 0, 0, 0, 0 )
+var points = [ cursor.x, cursor.y ]
+
+var origins = new Rect()
+origins.x = cursor.x
+origins.y = wall_vec.x
+
+var radius = 1
+
+var rect       = new Rect( new vec2(100,400), new vec2(100,400) )
+var east       = new Rect( new vec2(200,600), new vec2(100,400) )
+var corner     = new Rect( new vec2(300,700), new vec2(300,700) )
+var peninsula  = new Rect( new vec2(400,600), new vec2(600,800) )
+var peninsula2 = new Rect( new vec2(650,750), new vec2(350,450) )
+
+var rect_room       = new Room({ id: "rect", rect: rect, height: 2 })
+var east_room       = new Room({ id: "east", rect: east, height: 2 })
+var corner_room     = new Room({ id: "corner", rect: corner, height: 2 })
+var peninsula_room  = new Room({ id: "peninsula", rect: peninsula, height: 3 })
+var peninsula2_room = new Room({ id: "peninsula2", rect: peninsula2, height: 3 })
+
+Rooms.add( rect_room )
+Rooms.add( east_room )
+Rooms.add( corner_room )
+Rooms.add( peninsula_room )
+Rooms.add( peninsula2_room )
+
+Rooms.clipper.update()
+Rooms.builder.build()
+Rooms.grouper.build()
+
+var r = 4
+
+var intersect = new vec2 ()
+
+var dragging = false, dragging_a, dragging_b
+var delta = new vec2( 0, 0 )
+
+var mymouse = new mouse({
+  el: canvas,
+  down: function(e, cursor){
+    points.some(function(p){
+      if (-cursor.x.a > p.a - r && -cursor.x.a < p.a + r &&
+           cursor.y.a > p.b - r &&  cursor.y.a < p.b + r) {
+        dragging_a = p.a
+        dragging_b = p.b
+        dragging = p
+        return true
+      }
+    })
+  },
+  drag: function(e, cursor){
+    if (! dragging) return
+    delta = cursor.delta()
+    delta.a = - delta.a
+    dragging.a = dragging_a + delta.a
+    dragging.b = dragging_b + delta.b
+  },
+  up: function(e, cursor, new_cursor){
+    delta.zero()
+    dragging.dragging = false
+    dragging = false
+  },
+})
+
+function draw () {
+  ctx.fillStyle = "#fff"
+  ctx.fillRect(0,0,w,h)
+
+  Rooms.forEach(function(room, i){
+    ctx.fillStyle = "#eee"
+    ctx.fillRect(room.rect.x.a, room.rect.y.a, room.rect.width(), room.rect.height())
+  })
+  
+  ctx.fillStyle = "#333"
+  points.forEach(drawPoint)
+  
+  drawLine(cursor.x, cursor.y, "#f00")
+  hud.innerHTML = ""
+  Walls.list.forEach(function(wall, i){
+    if (wall.side & LEFT_RIGHT) {
+      wall_vec.x.a = wall.edge
+      wall_vec.x.b = wall.vec.a
+      wall_vec.y.a = wall.edge
+      wall_vec.y.b = wall.vec.b
+    }
+    else {
+      wall_vec.x.a = wall.vec.a
+      wall_vec.x.b = wall.edge
+      wall_vec.y.a = wall.vec.b
+      wall_vec.y.b = wall.edge
+    }
+    drawLine(wall_vec.x, wall_vec.y, "#888", true)
+    drawLine(origins.x, origins.y, "rgba(0,0,0,0.1)")
+
+    var t = perp(origins, wall_vec) / ( perp(cursor, wall_vec) || 0.0000001 )
+    intersect.a = cursor.x.a + ( cursor.y.a - cursor.x.a ) * t
+    intersect.b = cursor.x.b + ( cursor.y.b - cursor.x.b ) * t
+
+    var collinear = is_collinear( intersect, wall_vec )
+    var long_enough_to_intersect = 0 <= t && t <= 1
+    var actually_intersects = false
+    var intersecting_face
+    var msg
+  
+    if (long_enough_to_intersect && collinear) {
+      if (wall.side & LEFT_RIGHT) {
+        intersecting_face = wall.surface.face_for_x(intersect.b)
+      }
+      else {
+        intersecting_face = wall.surface.face_for_x(intersect.a)
+      }
+      actually_intersects = !! (intersecting_face && intersecting_face.y.a == 0)
+    }
+    
+    if (actually_intersects) {
+      ctx.fillStyle = "#f00"
+      msg = "through"
+    }
+    else if (collinear) {
+      ctx.fillStyle = "#0f0"
+      msg = "to"
+    }
+    else {
+      ctx.fillStyle = "rgba(0,0,0,0.1)"
+      msg = "off"
+    }
+    
+    drawPoint(intersect)
+    if (intersecting_face) {
+      hud.innerHTML += intersecting_face.y.a + "<br>"
+    }
+  })
+
+}
+function drawLine (pa, pb, color, headless) {
+  ctx.fillStyle = color
+  ctx.strokeStyle = color
+  var x1 = pa.a
+  var y1 = pa.b
+  var x2 = pb.a
+  var y2 = pb.b
+  drawArrow(ctx, x1, y1, x2, y2, 3, headless ? 0 : 1)
+}
+function drawPoint (p) {
+  var x = p.a - r
+  var y = p.b - r
+  ctx.fillRect(x, y, r*2, r*2)
+}
+function perp (va, vb) {
+  return (va.y.a - va.x.a) * (vb.y.b - vb.x.b) - (va.y.b - va.x.b) * (vb.y.a - vb.x.a)
+}
+function is_collinear (p, vec) {
+  var on_x, on_y
+  var pa = round(p.a), pb = round(p.b)
+  
+  if (vec.x.a < vec.y.a) {
+    on_x = vec.x.a <= pa && pa <= vec.y.a
+  }
+  else {
+    on_x = vec.x.a >= pa && pa >= vec.y.a
+  }
+  
+  if (vec.x.b < vec.y.b) {
+    on_y = vec.x.b <= pb && pb <= vec.y.b
+  }
+  else {
+    on_y = vec.x.b >= pb && pb >= vec.y.b
+  }
+
+  return !! (on_x && on_y)
+}
+
+function animate(){
+  requestAnimationFrame(animate)
+  draw()
+}
+animate()
+
+</script>
-- 
cgit v1.2.3-70-g09d2


From 60e86d8be94281d06d5327d6dad46b98e5df6a62 Mon Sep 17 00:00:00 2001
From: Jules Laplace <jules@okfoc.us>
Date: Fri, 31 Oct 2014 16:53:44 -0400
Subject: enabling mobile routes

---
 public/assets/javascripts/ui/_router.js | 12 ++++++++++++
 public/assets/test/intersect2.html      |  2 +-
 2 files changed, 13 insertions(+), 1 deletion(-)

(limited to 'public/assets/test/intersect2.html')

diff --git a/public/assets/javascripts/ui/_router.js b/public/assets/javascripts/ui/_router.js
index 0c95664..d5a8e7f 100644
--- a/public/assets/javascripts/ui/_router.js
+++ b/public/assets/javascripts/ui/_router.js
@@ -18,6 +18,7 @@ var SiteRouter = Router.extend({
 	
 	routes: {
 		"/":                    'home',
+		"/home":                'home',
 		"/login":               'signin',
 		"/signup":              'signup',
 
@@ -45,7 +46,16 @@ var SiteRouter = Router.extend({
 	mobileRoutes: {
 		"/":                    'home',
 		"/home":                'home',
+		"/login":               'signin',
+		"/signup":              'signup',
+		"/auth/usernameTaken":  'usernameTaken',
+		"/auth/password":       'passwordReset',
+		"/auth/forgotPassword": 'passwordForgot',
+
 		"/profile":             'profile',
+		"/profile/edit":        'editProfile',
+		"/profile/:name":       'profile',
+
 		"/project/:name":       'projectViewer',
 	},
 
@@ -63,10 +73,12 @@ var SiteRouter = Router.extend({
 		
 		this.route()
 		
+		/*
 		if (is_mobile) {
 			$(".topLinks").hide()
 			$(".share").hide()
 		}
+		*/
 		
 		$("body").removeClass("loading")
 	},
diff --git a/public/assets/test/intersect2.html b/public/assets/test/intersect2.html
index fade288..3df9f30 100644
--- a/public/assets/test/intersect2.html
+++ b/public/assets/test/intersect2.html
@@ -55,7 +55,7 @@ var rect_room       = new Room({ id: "rect", rect: rect, height: 2 })
 var east_room       = new Room({ id: "east", rect: east, height: 2 })
 var corner_room     = new Room({ id: "corner", rect: corner, height: 2 })
 var peninsula_room  = new Room({ id: "peninsula", rect: peninsula, height: 3 })
-var peninsula2_room = new Room({ id: "peninsula2", rect: peninsula2, height: 3 })
+var peninsula2_room = new Room({ id: "peninsula2", rect: peninsula2, height: 1 })
 
 Rooms.add( rect_room )
 Rooms.add( east_room )
-- 
cgit v1.2.3-70-g09d2


From d67ead4ebbe27dc66d89927ff3ab91662fabdae4 Mon Sep 17 00:00:00 2001
From: Jules Laplace <jules@okfoc.us>
Date: Tue, 3 Feb 2015 13:25:23 -0500
Subject: fix tests

---
 public/assets/javascripts/app.js             |  2 --
 public/assets/javascripts/mx/mx.js           | 16 ++++++++--------
 public/assets/javascripts/vendor/polyfill.js |  3 ++-
 public/assets/test/intersect2.html           |  5 +++--
 public/assets/test/intersect3.html           |  5 +++--
 public/assets/test/surface.html              |  2 +-
 6 files changed, 17 insertions(+), 16 deletions(-)

(limited to 'public/assets/test/intersect2.html')

diff --git a/public/assets/javascripts/app.js b/public/assets/javascripts/app.js
index a146325..6ff062e 100644
--- a/public/assets/javascripts/app.js
+++ b/public/assets/javascripts/app.js
@@ -23,8 +23,6 @@ app.launch = function () {
   
 	var movements
 
-	app.devicePixelRatio = is_mobile ? devicePixelRatio : 1
-
 	scene = new MX.Scene().addTo('#scene')
 	scene.width = window.innerWidth
 	scene.height = window.innerHeight
diff --git a/public/assets/javascripts/mx/mx.js b/public/assets/javascripts/mx/mx.js
index ab9a9a0..60651eb 100644
--- a/public/assets/javascripts/mx/mx.js
+++ b/public/assets/javascripts/mx/mx.js
@@ -25,7 +25,7 @@ var MX = MX || (function (undefined) {
     var MX = {
         version: '0.1.0',
         prefix: undefined,
-        rotationUnit: 'rad'
+        rotationUnit: 'rad',
     }
 
     var floatPrecision = 5
@@ -162,24 +162,24 @@ var MX = MX || (function (undefined) {
         Object.defineProperty(this, 'width', {
             get: function () {
                 return width
-                    || parseInt(self.el.style.width, 10) * app.devicePixelRatio
+                    || parseInt(self.el.style.width, 10) * app_devicePixelRatio
                     || 0
             },
             set: function (val) {
                 width = val
-                this.el.style.width = (width/app.devicePixelRatio) + 'px'
+                this.el.style.width = (width/app_devicePixelRatio) + 'px'
             }
         })
 
         Object.defineProperty(this, 'height', {
             get: function () {
                 return height
-                    || parseInt(self.el.style.height, 10) * app.devicePixelRatio
+                    || parseInt(self.el.style.height, 10) * app_devicePixelRatio
                     || 0
             },
             set: function (val) {
                 height = val
-                this.el.style.height = (height/app.devicePixelRatio) + 'px'
+                this.el.style.height = (height/app_devicePixelRatio) + 'px'
             }
         })
     }
@@ -302,9 +302,9 @@ var MX = MX || (function (undefined) {
                         + (-this.y).toFixed(floatPrecision) + 'px,'
                         + (-this.z).toFixed(floatPrecision) + 'px) '
                     + 'scale3d('
-                        + (app.devicePixelRatio * this.scaleX).toFixed(floatPrecision) + ','
-                        + (app.devicePixelRatio * this.scaleY).toFixed(floatPrecision) + ','
-                        + (app.devicePixelRatio * this.scaleZ).toFixed(floatPrecision) + ') '
+                        + (app_devicePixelRatio * this.scaleX).toFixed(floatPrecision) + ','
+                        + (app_devicePixelRatio * this.scaleY).toFixed(floatPrecision) + ','
+                        + (app_devicePixelRatio * this.scaleZ).toFixed(floatPrecision) + ') '
 
                 if (rotationTranslation) {
                     transformString += rotationTranslation.before
diff --git a/public/assets/javascripts/vendor/polyfill.js b/public/assets/javascripts/vendor/polyfill.js
index 499cbc5..2139618 100644
--- a/public/assets/javascripts/vendor/polyfill.js
+++ b/public/assets/javascripts/vendor/polyfill.js
@@ -48,7 +48,7 @@ function has3d(){
   } else if ( browser.webkit ) {
     browser.safari = true;
   }
-  $.browser = browser;
+  if (window.$) $.browser = browser;
   return browser;
 })( navigator.userAgent );
 
@@ -58,6 +58,7 @@ var is_ipad = (navigator.userAgent.match(/iPad/i))
 var is_android = (navigator.userAgent.match(/Android/i))
 var is_mobile = is_iphone || is_ipad || is_android
 var is_desktop = ! is_mobile;
+var app_devicePixelRatio = is_mobile ? devicePixelRatio : 1;
 
 
 // rAF shim
diff --git a/public/assets/test/intersect2.html b/public/assets/test/intersect2.html
index 3df9f30..9a6deb2 100644
--- a/public/assets/test/intersect2.html
+++ b/public/assets/test/intersect2.html
@@ -6,9 +6,10 @@ body,html{margin:0;padding:0;}
 <div id="hud"></div>
 
 <script src="/assets/javascripts/util.js"></script>
-<script src="/assets/javascripts/vendor/tube.js"></script>
 <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/bower_components/lodash/lodash.min.js"></script>
+<script src="/assets/javascripts/vendor/polyfill.js"></script>
+<script src="/assets/javascripts/vendor/tube.js"></script>
 <script src="/assets/javascripts/mx/mx.js"></script>
 <script src="/assets/javascripts/mx/extensions/mx.scene.js"></script>
 <script src="/assets/javascripts/rectangles/util/constants.js"></script>
diff --git a/public/assets/test/intersect3.html b/public/assets/test/intersect3.html
index 5440a76..0db85f0 100644
--- a/public/assets/test/intersect3.html
+++ b/public/assets/test/intersect3.html
@@ -6,9 +6,10 @@ body,html{margin:0;padding:0;}
 <div id="hud"></div>
 
 <script src="/assets/javascripts/util.js"></script>
-<script src="/assets/javascripts/vendor/tube.js"></script>
 <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/bower_components/lodash/lodash.min.js"></script>
+<script src="/assets/javascripts/vendor/polyfill.js"></script>
+<script src="/assets/javascripts/vendor/tube.js"></script>
 <script src="/assets/javascripts/mx/mx.js"></script>
 <script src="/assets/javascripts/mx/extensions/mx.scene.js"></script>
 <script src="/assets/javascripts/rectangles/util/constants.js"></script>
diff --git a/public/assets/test/surface.html b/public/assets/test/surface.html
index 85e3a7b..02be479 100644
--- a/public/assets/test/surface.html
+++ b/public/assets/test/surface.html
@@ -1,7 +1,7 @@
 <canvas id="canvas"></canvas>
 
 <script src="/assets/javascripts/util.js"></script>
-<script src="/assets/javascripts/vendor/tube.js"></script>
+<script src="/assets/javascripts/vendor/vendor/tube.js"></script>
 <script src="/assets/javascripts/rectangles/util/constants.js"></script>
 <script src="/assets/javascripts/rectangles/util/mouse.js"></script>
 <script src="/assets/javascripts/rectangles/models/vec2.js"></script>
-- 
cgit v1.2.3-70-g09d2


From 7da20303ba24f40366e94586b45efd2f04734338 Mon Sep 17 00:00:00 2001
From: Jules Laplace <jules@okfoc.us>
Date: Tue, 3 Feb 2015 13:45:31 -0500
Subject: hidpi canvas polyfill

---
 bower.json                         | 3 ++-
 public/assets/test/bg.html         | 1 +
 public/assets/test/intersect.html  | 5 +++--
 public/assets/test/intersect2.html | 7 ++++---
 public/assets/test/intersect3.html | 7 ++++---
 public/assets/test/surface.html    | 5 +++--
 6 files changed, 17 insertions(+), 11 deletions(-)

(limited to 'public/assets/test/intersect2.html')

diff --git a/bower.json b/bower.json
index 5f35d6c..c78310d 100644
--- a/bower.json
+++ b/bower.json
@@ -9,6 +9,7 @@
     "fiber": "",
     "jquery-jsonview": "1.2.0",
     "prefixfree": "",
-    "marked": "0.3.2"
+    "marked": "0.3.2",
+    "hidpi-canvas": "~1.0.9"
   }
 }
diff --git a/public/assets/test/bg.html b/public/assets/test/bg.html
index fecf811..65dd5d9 100644
--- a/public/assets/test/bg.html
+++ b/public/assets/test/bg.html
@@ -5,6 +5,7 @@
 <div id="cursor" style="width:30px;height:30px;background:blue;display:inline-block;"></div>
 </div>
 <script src="/assets/javascripts/util.js"></script>
+<script src="/assets/javascripts/vendor/bower_components/hidpi-canvas/dist/hidpi-canvas.js"></script>
 <script src="/assets/javascripts/vendor/tube.js"></script>
 <script src="/assets/javascripts/vendor/loader.js"></script>
 <script src="/assets/javascripts/rectangles/util/constants.js"></script>
diff --git a/public/assets/test/intersect.html b/public/assets/test/intersect.html
index 4e5b0bb..92f1d5d 100644
--- a/public/assets/test/intersect.html
+++ b/public/assets/test/intersect.html
@@ -2,6 +2,7 @@
 <div id="hud"></div>
 
 <script src="/assets/javascripts/util.js"></script>
+<script src="/assets/javascripts/vendor/bower_components/hidpi-canvas/dist/hidpi-canvas.js"></script>
 <script src="/assets/javascripts/vendor/tube.js"></script>
 <script src="/assets/javascripts/rectangles/util/constants.js"></script>
 <script src="/assets/javascripts/rectangles/util/mouse.js"></script>
@@ -10,11 +11,11 @@
 <script src="/assets/javascripts/vendor/canvasutilities.js"></script>
 <script>
 
-var ctx = canvas.getContext('2d')
-
 var w = canvas.width = 600
 var h = canvas.height = 400
 
+var ctx = canvas.getContext('2d')
+
 var vec_a = new Rect( 100, 120, 50, 100 )
 var vec_b = new Rect( 20, 200, 120, 120 )
 var vecs = [ vec_a, vec_b ]
diff --git a/public/assets/test/intersect2.html b/public/assets/test/intersect2.html
index 9a6deb2..553e2f7 100644
--- a/public/assets/test/intersect2.html
+++ b/public/assets/test/intersect2.html
@@ -8,6 +8,7 @@ body,html{margin:0;padding:0;}
 <script src="/assets/javascripts/util.js"></script>
 <script src="/assets/javascripts/vendor/bower_components/jquery/dist/jquery.min.js"></script>
 <script src="/assets/javascripts/vendor/bower_components/lodash/lodash.min.js"></script>
+<script src="/assets/javascripts/vendor/bower_components/hidpi-canvas/dist/hidpi-canvas.js"></script>
 <script src="/assets/javascripts/vendor/polyfill.js"></script>
 <script src="/assets/javascripts/vendor/tube.js"></script>
 <script src="/assets/javascripts/mx/mx.js"></script>
@@ -30,12 +31,12 @@ body,html{margin:0;padding:0;}
 <script src="/assets/javascripts/vendor/canvasutilities.js"></script>
 <script>
 
-var ctx = canvas.getContext('2d')
-var scene = new MX.Scene()
-
 var w = canvas.width = window.innerWidth
 var h = canvas.height = window.innerHeight
 
+var ctx = canvas.getContext('2d')
+var scene = new MX.Scene()
+
 var cursor = new Rect( 150, 250, 150, 250 )
 var wall_vec = new Rect ( 0, 0, 0, 0 )
 var points = [ cursor.x, cursor.y ]
diff --git a/public/assets/test/intersect3.html b/public/assets/test/intersect3.html
index 0db85f0..b8f9a0d 100644
--- a/public/assets/test/intersect3.html
+++ b/public/assets/test/intersect3.html
@@ -8,6 +8,7 @@ body,html{margin:0;padding:0;}
 <script src="/assets/javascripts/util.js"></script>
 <script src="/assets/javascripts/vendor/bower_components/jquery/dist/jquery.min.js"></script>
 <script src="/assets/javascripts/vendor/bower_components/lodash/lodash.min.js"></script>
+<script src="/assets/javascripts/vendor/bower_components/hidpi-canvas/dist/hidpi-canvas.js"></script>
 <script src="/assets/javascripts/vendor/polyfill.js"></script>
 <script src="/assets/javascripts/vendor/tube.js"></script>
 <script src="/assets/javascripts/mx/mx.js"></script>
@@ -30,12 +31,12 @@ body,html{margin:0;padding:0;}
 <script src="/assets/javascripts/vendor/canvasutilities.js"></script>
 <script>
 
-var ctx = canvas.getContext('2d')
-var scene = new MX.Scene()
-
 var w = canvas.width = window.innerWidth
 var h = canvas.height = window.innerHeight
 
+var ctx = canvas.getContext('2d')
+var scene = new MX.Scene()
+
 var cursor = new Rect( new vec2(400, 200), new vec2(800, 500) )
 var wall_vec = new Rect ( 0, 0, 0, 0 )
 var points = [ cursor.x, cursor.y ]
diff --git a/public/assets/test/surface.html b/public/assets/test/surface.html
index 02be479..02b473d 100644
--- a/public/assets/test/surface.html
+++ b/public/assets/test/surface.html
@@ -1,6 +1,7 @@
 <canvas id="canvas"></canvas>
 
 <script src="/assets/javascripts/util.js"></script>
+<script src="/assets/javascripts/vendor/bower_components/hidpi-canvas/dist/hidpi-canvas.js"></script>
 <script src="/assets/javascripts/vendor/vendor/tube.js"></script>
 <script src="/assets/javascripts/rectangles/util/constants.js"></script>
 <script src="/assets/javascripts/rectangles/util/mouse.js"></script>
@@ -9,11 +10,11 @@
 <script src="/assets/javascripts/rectangles/models/surface.js"></script>
 <script>
 
-var ctx = canvas.getContext('2d')
-
 var w = canvas.width = 600
 var h = canvas.height = 400
 
+var ctx = canvas.getContext('2d')
+
 var surface = new Surface ()
 surface.add( new Rect( new vec2(10, 100), new vec2(0, 400) ) )
 surface.add( new Rect( new vec2(100, 300), new vec2(200, 400) ) )
-- 
cgit v1.2.3-70-g09d2