8 files changed, 112 insertions, 22 deletions

diff --git a/public/assets/javascripts/ui/lib/AnimatedView.js b/public/assets/javascripts/ui/lib/AnimatedView.js
new file mode 100644
index 0000000..3c50b0a
--- /dev/null
+++ b/public/assets/javascripts/ui/lib/AnimatedView.js
@@ -0,0 +1,31 @@
+var AnimatedView = View.extend({
+
+  _animating: false,
+  last_t: 0,
+  
+  startAnimating: function(){
+    if (this._animating) return
+    this._animating = true
+    this._animate()
+  },
+
+	stopAnimating: function(){
+	  this._animating = false
+	},
+
+	_animate: function(t){
+	  if (! this._animating) return
+
+    requestAnimationFrame(this._animate.bind(this))
+    
+    var dt = t - this.last_t
+    this.last_t = t
+
+    if (! t) return
+    
+    this.animate(t, dt)
+	},
+	
+	animate: function(t, dt){},
+
+})
\ No newline at end of file
diff --git a/public/assets/javascripts/ui/lib/ConfirmModal.js b/public/assets/javascripts/ui/lib/ConfirmModal.js
index a72b31e..7d9da67 100644
--- a/public/assets/javascripts/ui/lib/ConfirmModal.js
+++ b/public/assets/javascripts/ui/lib/ConfirmModal.js
@@ -4,21 +4,31 @@ var ConfirmModal = new( ModalFormView.extend({
   el: ".mediaDrawer.confirm",
 
   events: {
-    "click .yes": "advance",
-    "click .no": "hide",
+    "click .yes": "agree",
+    "click .no": "cancel",
   },
   
-  confirm: function(question, callback){
+  confirm: function(question, agreeCallback, cancelCallback){
     this.$(".question").empty().append(question)
-    this.callback = callback
+    this.agreeCallback = agreeCallback
+    this.cancelCallback = cancelCallback
     this.show()
   },
   
-  advance: function(e){
+  agree: function(e){
     e && e.preventDefault()
     this.hide()
-    this.callback && this.callback()
-    this.callback = null
+    this.agreeCallback && this.agreeCallback()
+    this.agreeCallback = null
+    this.cancelCallback = null
+  },
+
+  cancel: function(e){
+    e && e.preventDefault()
+    this.hide()
+    this.cancelCallback && this.cancelCallback()
+    this.agreeCallback = null
+    this.cancelCallback = null
   }
 
 }) )
\ No newline at end of file
diff --git a/public/assets/javascripts/ui/lib/FormView.js b/public/assets/javascripts/ui/lib/FormView.js
index f5845e7..33effc8 100644
--- a/public/assets/javascripts/ui/lib/FormView.js
+++ b/public/assets/javascripts/ui/lib/FormView.js
@@ -63,7 +63,7 @@ var FormView = View.extend({
   save: function(e, successCallback, errorCallback){
     e && e.preventDefault()
 
-    this.$errors.hide().css("opacity", 0.0);
+    this.$errors && this.$errors.hide().css("opacity", 0.0);
     
     if (this.validate) {
       var errors = this.validate()
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/lib/ModalView.js b/public/assets/javascripts/ui/lib/ModalView.js
index 6f1c729..e0070ce 100644
--- a/public/assets/javascripts/ui/lib/ModalView.js
+++ b/public/assets/javascripts/ui/lib/ModalView.js
@@ -35,6 +35,11 @@ var ModalView = View.extend({
     $("body").removeClass("noOverflow");
   },
   
+  hideClose: function(){
+    $("#fixed_close").removeClass("active")
+    $("#fixed_close").unbind("click", this.hide.bind(this))
+  },
+  
   close: function(){
     if (window.isModalView) {
       window.location.pathname = "/"
diff --git a/public/assets/javascripts/ui/lib/Parser.js b/public/assets/javascripts/ui/lib/Parser.js
index 411f425..ab9d08d 100644
--- a/public/assets/javascripts/ui/lib/Parser.js
+++ b/public/assets/javascripts/ui/lib/Parser.js
@@ -62,10 +62,11 @@ var Parser = {
 				dataType: "jsonp",
 				data: {
 					id: id,
-					key: "AIzaSyDYPKGD0-_VRBWpUYRmX8Qg6BtWmcPU_cM",
+					key: "AIzaSyCMlxLNawPWFwOIsrEz3bwfl_gZgkQwfMk",
 					part: "id,contentDetails,snippet,status",
 				},
 				success: function(result){
+          console.log(result.items)
 					var res = result.items[0]
 					done({
 						url: url,
@@ -279,4 +280,4 @@ var Parser = {
   },
 
 };
-Parser.lookup = _.indexBy(Parser.integrations, 'type');
+Parser.lookup = _.keyBy(Parser.integrations, 'type');
diff --git a/public/assets/javascripts/ui/lib/ToggleableView.js b/public/assets/javascripts/ui/lib/ToggleableView.js
new file mode 100644
index 0000000..371629f
--- /dev/null
+++ b/public/assets/javascripts/ui/lib/ToggleableView.js
@@ -0,0 +1,19 @@
+var ToggleableView = View.extend({
+
+	toggle: function(state){
+		this.$el.toggleClass("active", state)
+	},
+	
+	show: function(){
+	  this.toggle(true)
+	},
+
+	hide: function(){
+	  this.toggle(false)
+	},
+	
+	visible: function(){
+	  return this.$el.hasClass("active")
+	}
+
+})
\ No newline at end of file
diff --git a/public/assets/javascripts/ui/lib/Toolbar.js b/public/assets/javascripts/ui/lib/Toolbar.js
new file mode 100644
index 0000000..a9ce51c
--- /dev/null
+++ b/public/assets/javascripts/ui/lib/Toolbar.js
@@ -0,0 +1,22 @@
+var Toolbar = Fiber.extend(function(base){
+  var exports = {}
+  exports.init = function(rapper){
+    this.rapper = (typeof rapper == "string") ? $(rapper)[0] : rapper
+    this.tools = {}
+    this.els = {}
+  }
+  exports.add = function(role, fn){
+    var self = this
+    this.tools[role] = fn
+    this.els[role] = $("[data-role=" + role + "]", self.rapper)
+    this.els[role].click(function(){
+      $(".active", self.rapper).removeClass('active')
+      $(this).addClass('active')
+      fn()
+    })
+  }
+  exports.pick = function(role){
+    this.els[role].trigger("click")
+  }
+  return exports
+})
\ No newline at end of file