enable hidpi canvas in main app

8 files changed, 29 insertions, 21 deletions

diff --git a/Gruntfile.js b/Gruntfile.js
index f7af106..70a8b13 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -13,6 +13,7 @@ module.exports = function(grunt) {
           "public/assets/javascripts/vendor/bower_components/momentjs/min/moment.min.js",
           "public/assets/javascripts/vendor/bower_components/fiber/src/fiber.min.js",
           "public/assets/javascripts/vendor/bower_components/marked/lib/marked.js",
+          "public/assets/javascripts/vendor/bower_components/hidpi-canvas/dist/hidpi-canvas.js",
           "public/assets/javascripts/vendor/tube.js",
           "public/assets/javascripts/vendor/loader.js",
           "public/assets/javascripts/vendor/polyfill.js",
diff --git a/bower.json b/bower.json
index c78310d..e3e83ca 100644
--- a/bower.json
+++ b/bower.json
@@ -10,6 +10,6 @@
     "jquery-jsonview": "1.2.0",
     "prefixfree": "",
     "marked": "0.3.2",
-    "hidpi-canvas": "~1.0.9"
+    "hidpi-canvas": "git://github.com/julescarbon/hidpi-canvas-polyfill.git#master"
   }
 }
diff --git a/public/assets/javascripts/rectangles/engine/map/draw.js b/public/assets/javascripts/rectangles/engine/map/draw.js
index eceda3c..5a9b592 100644
--- a/public/assets/javascripts/rectangles/engine/map/draw.js
+++ b/public/assets/javascripts/rectangles/engine/map/draw.js
@@ -56,9 +56,9 @@ Map.Draw = function(map, opt){
 		}
 
 		var canvas = document.createElement("canvas")
-		ctx = canvas.getContext('2d')
 		canvas.width = thumbnail_width
 		canvas.height = thumbnail_height
+		ctx = canvas.getContext('2d')
 		
 		draw.clear()
 
diff --git a/public/assets/javascripts/ui/lib/LabColorPicker.js b/public/assets/javascripts/ui/lib/LabColorPicker.js
index 7ddcdd5..2c8fb90 100644
--- a/public/assets/javascripts/ui/lib/LabColorPicker.js
+++ b/public/assets/javascripts/ui/lib/LabColorPicker.js
@@ -1,9 +1,12 @@
 var LabColorPicker = function (parent, w, h) {
   var base = this
   var canvas = this.canvas = document.createElement('canvas')
-  var ctx = this.ctx = canvas.getContext('2d')
-  var imageData = ctx.createImageData(w,h)
-  var data = imageData.data
+  canvas.width = w
+  canvas.height = h
+  var ctx = this.ctx = canvas.getContext('2d-lodpi')
+//  canvas.className = "colorPicker"
+//   var imageData = ctx.createImageData(w, h)
+//   var data = imageData.data
 
   var cursor = this.cursor = document.createElement("div")
   cursor.className = "colorPickerCursor"
@@ -15,10 +18,6 @@ var LabColorPicker = function (parent, w, h) {
 	brightnessControl.setAttribute("max", "110")
 	brightnessControl.setAttribute("value", "0")
 
-  canvas.width = w
-  canvas.height = h
-  canvas.className = "colorPicker"
-
   var ww = w-1
   var hh = h-1
   
@@ -84,11 +83,14 @@ var LabColorPicker = function (parent, w, h) {
   }
   this.paint = function() {
     val = clamp(val, L_range[0], L_range[1])
-    var x, y, t
-    for (var i = 0; i < w; i++) {
-      for (var j = 0; j < h; j++) {
-        x = mix( i/ww, a_range[0], a_range[1] )
-        y = mix( j/hh, b_range[0], b_range[1] )
+		var imageData = ctx.createImageData(canvas.width, canvas.height)
+		var data = imageData.data
+    var x, y, t, cw = imageData.width, ch = imageData.height
+    var cww = cw-1, chh = ch-1
+    for (var i = 0; i < cw; i++) {
+      for (var j = 0; j < ch; j++) {
+        x = mix( i/cww, a_range[0], a_range[1] )
+        y = mix( j/chh, b_range[0], b_range[1] )
         t = (j*w + i) * 4
         rgb = xyz2rgb(hunterlab2xyz(val, x, y))
         data[t] = Math.round( rgb[0] )
diff --git a/public/assets/javascripts/ui/reader/Tracker.js b/public/assets/javascripts/ui/reader/Tracker.js
index ce32c59..d2dec39 100644
--- a/public/assets/javascripts/ui/reader/Tracker.js
+++ b/public/assets/javascripts/ui/reader/Tracker.js
@@ -1,8 +1,12 @@
-(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
-(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
-m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
-})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
-
+if (window.location.host.indexOf("lvh.me") === -1) {
+	(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+	(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+	m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+	})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+}
+else {
+	ga = function(){}
+}
 ga('create', 'UA-56883705-1', 'auto');
 ga('send', 'pageview');
 
diff --git a/public/assets/test/surface.html b/public/assets/test/surface.html
index 02b473d..9e6abe8 100644
--- a/public/assets/test/surface.html
+++ b/public/assets/test/surface.html
@@ -2,7 +2,7 @@
 
 <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/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>
diff --git a/views/controls/editor/color-control.ejs b/views/controls/editor/color-control.ejs
index c035e24..bcc955d 100644
--- a/views/controls/editor/color-control.ejs
+++ b/views/controls/editor/color-control.ejs
@@ -1,4 +1,4 @@
-<div class="vvbox colorcontrol">
+<div class="vvbox colorcontrol active">
 	<h4>Edit Room Colors</h4>
 
   <div class="colors">
diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs
index a58eca1..011644b 100644
--- a/views/partials/scripts.ejs
+++ b/views/partials/scripts.ejs
@@ -5,6 +5,7 @@
 <script type="text/javascript" src="/assets/javascripts/vendor/bower_components/lodash/lodash.min.js"></script>
 <script type="text/javascript" src="/assets/javascripts/vendor/bower_components/momentjs/min/moment.min.js"></script>
 <script type="text/javascript" src="/assets/javascripts/vendor/bower_components/fiber/src/fiber.min.js"></script>
+<script type="text/javascript" src="/assets/javascripts/vendor/bower_components/hidpi-canvas/dist/hidpi-canvas.js"></script>
 <!-- <script type="text/javascript" src="/assets/javascripts/vendor/bower_components/prefixfree/prefixfree.min.js"></script> -->
 <script type="text/javascript" src="/assets/javascripts/vendor/bower_components/marked/lib/marked.js"></script>
 <script type="text/javascript" src="/assets/javascripts/vendor/tube.js"></script>