Merge branch 'master' of lmno:dither

18 files changed, 468 insertions, 203 deletions

diff --git a/js/api/gallery.js b/js/api/gallery.js
index 92764c6..8f9914b 100644
--- a/js/api/gallery.js
+++ b/js/api/gallery.js
@@ -22,37 +22,59 @@ shader_gallery.bind = function(){
 
 	ShaderAPI.list_users(function(err, users){
 		var $el = $("#pick-user").empty()
-		for (var i in users) {
+
+		var $option = $("<option>")
+		var username = "users"
+		$option.val("LATEST").html(username)
+		$el.append( $option )
+
+		users.sort(function(a,b){
+			return a.username < b.username ? -1 : a.username > b.username ? 1 : 0
+		}).forEach(function(user){
 			var $option = $("<option>")
-			var username = users[i].username
+			var username = user.username
 			$option.val(username).html(username)
 			$el.append( $option )
-		}
-	})
+		})
+	});
 	
 	$(document).on("change", "#pick-user", function(){
 		var name = $(this).val()
-		ShaderAPI.username(name, load_shaders)
+		if (name == "LATEST") {
+			ShaderAPI.latest(load_shaders)
+		}
+		else {
+			ShaderAPI.username(name, load_shaders)
+		}
 	})
 	$(document).on("click", ".shader", function(){
 		run_shader( $(this).data("shader") )
 	})
 }
 
-function new_shader(){
+function new_shader(opt){
+	opt = opt || {}
+	shader_id_root = null
 	run_shader({
 		id: "",
 		shader_id: "",
 		image_url: $("#url").val(),
-		script: "",
-		name: ""
+		script: opt.shader || "",
+		name: opt.name || ""
 	})
 }
 function run_shader(shader_object){
 	console.log(shader_object)
 	shader_id_root = shader_object.shader_id
 	if ($("#persist-image:checked").length) {
+		var new_w = parseInt(shader_object.width, 10)
+		var new_h = parseInt(shader_object.height, 10)
 		$("#url").val( shader_object.image_url )
+		if (new_w && new_h) {
+			preserve_dimensions = true
+			actual_w = w = new_w
+			actual_h = h = new_h
+		}
 		load()
 	}
 	$("#shader").val(shader_object.script)
@@ -75,10 +97,12 @@ function load_shaders(err, shaders){
 function display_shader(shader_object){
 	var $shader = $("<div>").addClass("shader")
 	$shader.data("shader", shader_object)
+	$shader.data("id", shader_object.id)
 	var html = shader_gallery_template
 	for (var field in shader_object) {
 		html = html.replace("{" + field + "}", shader_object[field])
 	}
 	$shader.html(html)
+	shader_object.id && $shader.data("id", shader_object.id)
 	return $shader;
 }
diff --git a/js/api/get.js b/js/api/get.js
index ae06dbd..742d41f 100644
--- a/js/api/get.js
+++ b/js/api/get.js
@@ -1,5 +1,5 @@
 ;var ShaderAPI = {}
-ShaderAPI.limit = 24
+ShaderAPI.limit = 50
 
 // info - fetch a single shader
 //   id: shader id
diff --git a/js/api/localstorage.js b/js/api/localstorage.js
index eeae658..835d139 100644
--- a/js/api/localstorage.js
+++ b/js/api/localstorage.js
@@ -5,8 +5,8 @@ local_shaders.init = function(){
 }
 local_shaders.bind = function(){
   local_shaders.buttons = {}
-  if ('SHADERS' in window) {
-    local_shaders.bindButtons( window.SHADERS )
+  if ('EXAMPLE_SHADERS' in window) {
+    local_shaders.bindButtons( window.EXAMPLE_SHADERS )
   }
   local_shaders.bindButtons( local_shaders.getShaders() )
   document.getElementById("add-shader").addEventListener("click", local_shaders.save, false)
diff --git a/js/api/set.js b/js/api/set.js
index 92cc071..19f3f26 100644
--- a/js/api/set.js
+++ b/js/api/set.js
@@ -6,18 +6,23 @@ function save_shader(){
 		image_url: $("#url").val(),
 		username: user.username,
 		name: $("#shader-name").val() || "",
-		shader_id: shader_id_root
+		shader_id: shader_id_root,
+		width: $("#width").int() || "",
+		height: $("#height").int() || ""
 	}
-	var blob = dataUriToBlob(cc.clone().resize(200,200).canvas.toDataURL("image/png"))
+	var thumb = make_thumbnail()
 
+	status('saving..')
 	console.log(params)
-	$.post("http://asdf.us/cgi-bin/im/shader/save", params, function(resp){
+	$.post("/cgi-bin/im/shader/save", params, function(resp){
 		console.log(resp);
 		data = JSON.parse(resp)
 		if (data.ERROR){
+			status('error saving shader')
 			alert(data.ERROR)
 			return false
 		}
+		status('uploading thumbnail')
 		if (! shader_id_root) {
 			shader_id_root = data.id;
 		}
@@ -28,23 +33,35 @@ function save_shader(){
 		$shader = display_shader(params)
 		$("#shader-gallery").prepend($shader)
 		
-		var form = new FormData();
+		save_thumbnail(data.id, thumb, $shader)
+	})
+}
 
-		form.append("id", data.id);
-		form.append("qqfile", blob);
-		$.ajax({
-			url: "http://asdf.us/cgi-bin/im/shader/thumbnail_upload",
-			type: "POST",
-			data: form,
-			processData: false,
-			contentType: false,
-		}).done(function(resp){
-			console.log(resp);
-			var data = JSON.parse(resp)
-			if (data.success) {
-				$shader.find("img").attr("src", data.url)
-			}
-		});
+function make_thumbnail(){
+	return dataUriToBlob(cc.clone().resize(200,200).canvas.toDataURL("image/png"))
+}
 
-	})
+function save_thumbnail(id, thumb, $shader){
+	if (! id || id == "") return
+	
+	thumb = thumb || make_thumbnail()
+	
+	var form = new FormData();
+
+	form.append("id", id);
+	form.append("qqfile", thumb);
+	$.ajax({
+		url: "/cgi-bin/im/shader/thumbnail_upload",
+		type: "POST",
+		data: form,
+		processData: false,
+		contentType: false,
+	}).done(function(resp){
+		console.log(resp);
+		status('')
+		var data = JSON.parse(resp)
+		if (data.success) {
+			$shader.find("img").attr("src", data.url)
+		}
+	});
 }
diff --git a/js/asdf.js b/js/asdf.js
index 53222e8..6006eea 100644
--- a/js/asdf.js
+++ b/js/asdf.js
@@ -1,7 +1,7 @@
 //
 // asdf .. asdf.us/im search api
 
-var asdf = { fetching: false }
+var asdf = { fetching: false, fetched: false }
 asdf.random = function (e){
   status("fetching random photoblasts")
   e && e.preventDefault();
@@ -13,7 +13,7 @@ asdf.random = function (e){
 
 asdf.fetch = function (opt){
   if (asdf.fetching) return;
-  asdf.fetching = true;
+  asdf.fetching = true
   var params = {random:1};
   $.ajax({
     'url': "http://asdf.us/cgi-bin/im/list",
@@ -21,6 +21,7 @@ asdf.fetch = function (opt){
     'dataType': "jsonp",
     'success': function(urls){
       asdf.fetching = false;
+			asdf.fetched = true
       opt.success && opt.success(urls)
     },
     'error': opt.error || function(err){
diff --git a/js/camera.js b/js/camera.js
new file mode 100644
index 0000000..ef4898a
--- /dev/null
+++ b/js/camera.js
@@ -0,0 +1,67 @@
+var camera = (function(){
+  var loaded = false, video
+
+  navigator.getMedia = ( navigator.getUserMedia ||
+                         navigator.webkitGetUserMedia ||
+                         navigator.mozGetUserMedia ||
+                         navigator.msGetUserMedia);
+
+  if (! navigator.getMedia) {
+    $("#camera").hide()
+    return
+  }
+
+  $("#camera").click(load)
+  
+  function load(){
+    if (! loaded) {
+      build()
+    }
+    else {
+      ready()
+    }
+    window.gif = window.img = null
+  }
+
+  function ready(){
+    // defer here if necessary.. firefox fires "canplay" before videoWidth is available
+    if (! video.videoWidth) {
+      setTimeout(ready, 50)
+      return
+    }
+    cc.canvas.width = actual_w = w = min(video.videoWidth, 400)
+    cc.canvas.height = actual_h = h = video.videoHeight / (video.videoWidth/w)
+    video.setAttribute('width', video.videoWidth)
+    video.setAttribute('height', video.videoHeight)
+    window.gif = window.img = null
+    window.cam = video
+  }
+  
+  function build(){
+    video = document.createElement("video")
+    navigator.getMedia({
+        video: true,
+        audio: false
+      },
+      function(stream) {
+        if (navigator.mozGetUserMedia) {
+          video.mozSrcObject = stream;
+        } else {
+          var vendorURL = window.URL || window.webkitURL;
+          video.src = vendorURL.createObjectURL(stream);
+        }
+        video.play();
+      },
+      function(err) {
+        console.log("An error occured! " + err);
+      }
+    )
+
+    video.addEventListener('canplay', function(e){
+      if (! loaded) {
+        loaded = true
+        ready()
+      }
+    }, false);
+  }
+})()
diff --git a/js/color.js b/js/color.js
index ba60db7..215c3e6 100644
--- a/js/color.js
+++ b/js/color.js
@@ -16,11 +16,11 @@ function rgb2xyz(rgb){
   var var_G = ( rgb[1] / 255 )        //G from 0 to 255
   var var_B = ( rgb[2] / 255 )        //B from 0 to 255
 
-  if ( var_R > 0.04045 ) var_R = ( ( var_R + 0.055 ) / 1.055 ) ^ 2.4
+  if ( var_R > 0.04045 ) var_R = Math.pow( ( var_R + 0.055 ) / 1.055, 2.4)
   else                   var_R = var_R / 12.92
-  if ( var_G > 0.04045 ) var_G = ( ( var_G + 0.055 ) / 1.055 ) ^ 2.4
+  if ( var_G > 0.04045 ) var_G = Math.pow( ( var_G + 0.055 ) / 1.055, 2.4)
   else                   var_G = var_G / 12.92
-  if ( var_B > 0.04045 ) var_B = ( ( var_B + 0.055 ) / 1.055 ) ^ 2.4
+  if ( var_B > 0.04045 ) var_B = Math.pow( ( var_B + 0.055 ) / 1.055, 2.4)
   else                   var_B = var_B / 12.92
 
   var_R = var_R * 100
@@ -57,7 +57,7 @@ function xyz2rgb(xyz){
 
 function xyz2hunterlab (XYZ) {
   var X = XYZ[0]
-  var Y = XYZ[1]
+  var Y = XYZ[1] || 1e-6  // otherwise divide-by-zero error when converting rgb(0,0,0)
   var Z = XYZ[2]
   var L = 10 * sqrt( Y )
   var a = 17.5 * ( ( ( 1.02 * X ) - Y ) / sqrt( Y ) )
@@ -107,16 +107,16 @@ function cielab2xyz (lab){
   var var_X = lab[1] / 500 + var_Y
   var var_Z = var_Y - lab[2] / 200
 
-  if ( var_Y^3 > 0.008856 ) var_Y = Math.pow(var_Y, 3)
+  if ( Math.pow(var_Y, 3) > 0.008856 ) var_Y = Math.pow(var_Y, 3)
   else                      var_Y = ( var_Y - 16 / 116 ) / 7.787
-  if ( var_X^3 > 0.008856 ) var_X = Math.pow(var_X, 3)
+  if ( Math.pow(var_X, 3) > 0.008856 ) var_X = Math.pow(var_X, 3)
   else                      var_X = ( var_X - 16 / 116 ) / 7.787
-  if ( var_Z^3 > 0.008856 ) var_Z = Math.pow(var_Z, 3)
+  if ( Math.pow(var_Z, 3) > 0.008856 ) var_Z = Math.pow(var_Z, 3)
   else                      var_Z = ( var_Z - 16 / 116 ) / 7.787
 
-  var X = REF_X * var_X     //ref_X =  95.047     Observer= 2°, Illuminant= D65
-  var Y = REF_Y * var_Y     //ref_Y = 100.000
-  var Z = REF_Z * var_Z     //ref_Z = 108.883
+  var x = REF_X * var_X     //ref_X =  95.047     Observer= 2°, Illuminant= D65
+  var y = REF_Y * var_Y     //ref_Y = 100.000
+  var z = REF_Z * var_Z     //ref_Z = 108.883
 
   return [x,y,z]
 }
diff --git a/js/error.highlight.js b/js/error.highlight.js
index 0b478e2..c2d3947 100644
--- a/js/error.highlight.js
+++ b/js/error.highlight.js
@@ -47,7 +47,7 @@ var reposition_highlight = function(){
   dom.highlight.style.left = pos.left + "px"
 
   var y_pos = pos.top + height_until_error - dom.textarea.scrollTop
-  dom.highlight.style.top = y_pos + dom.html.scrollTop + "px"
+  dom.highlight.style.top = y_pos + dom.html.scrollTop + dom.body.scrollTop + "px"
 
   var height_of_highlight = height_with_error;
 
@@ -132,11 +132,12 @@ var create_el_highlight = function(){
 
 var init = function(){
   dom.html = document.querySelector('html')
+  dom.body = document.querySelector('body')
   calc_textarea_style()
   create_el_highlight()
   create_el_textmeasure()
   scrollbar_width = calc_scrollbar_width()
-  textarea.addEventListener('scroll', reposition_highlight)
+  dom.textarea.addEventListener('scroll', reposition_highlight)
 }
 
 // exports
diff --git a/js/frames.js b/js/frames.js
index c9c844d..163e899 100644
--- a/js/frames.js
+++ b/js/frames.js
@@ -1,3 +1,4 @@
+var frame_thumb_size = 93
 
 var frame_editor = {}
 
@@ -29,9 +30,14 @@ frame_editor.bind = function(){
   $("#render").click(render)
   $("#save").click(save)
   $("#upload").click(upload)
+
+	$("#background").change(function(){
+		document.body.style.backgroundColor = $("#background").string()
+	})
 }
 
 function add_frame(){
+	$("#render").enable()
   var frame_count = $("#framecount").int()
   if (frame_count < 2) {
     add_single_frame()
@@ -47,14 +53,13 @@ function add_single_frame(){
   var frame = cc.clone().appendTo($el.find(".frame")[0])
   frame.canvas.className = "fullsize"
   frame.canvas.style.display = "none"
-  var thumb = cc.clone().resize(100,100).appendTo($el.find(".frame")[0])
+  var thumb = cc.clone().resize(frame_thumb_size,frame_thumb_size).appendTo($el.find(".frame")[0])
   $("#frames").append($el)
-  $("#render").enable()
 }
 function add_frames(frame_count){
   rendering = true
   var t = old_t - start_t - pause_t
-  var frame_delay = $("#frameinterval").float() * 1000
+  var frame_delay = ($("#frameinterval").float() || $("#framedelay").float()) * 1000
   var frame
   for (var i = 0; i < frame_count; i++) {
     frame = giveFrame(t)
@@ -66,9 +71,6 @@ function add_frames(frame_count){
 }
 function remove_frame(){
   $(this).closest("div").remove()
-  if ($("#frames div").length == 0) {
-    $("#render").disable()
-  }
 }
 function remove_all_frames(){
   $("#frames").empty()
@@ -96,6 +98,10 @@ function sort_frames(){
 
 function render (){
   if (rendering) return
+  if ($("#frames canvas.fullsize").length == 0) {
+  	add_frame()
+  }
+  
   rendering = true
   encoder.reset()
   var delay = $("#framedelay").float() * 1000 || 100
@@ -104,7 +110,7 @@ function render (){
     encoder.addFrame(frame.canvas, delay)
   })
   $("#pause,#render,#add-frame").disable()
-  $("#rendered").find("img").remove()
+  $("#workspace").find("img").remove()
   $("#rendered").show()
   // really bad results with neuquant?
   // status("quantizing")
@@ -121,8 +127,6 @@ function render (){
   $("#render").html("rendering")
 }
 
-function status(s){ $(".status").html(s) }
-
 var encoder = new GifEncoder()
 
 encoder.on("quantized", function(url){
@@ -141,62 +145,14 @@ encoder.on("rendered", function(bytes){
 encoder.on("rendered-url", function(url){
   var image = new Image ()
   lastGif = image.src = url
-  $("#rendered").append(image)
+	$("#workspace canvas").hide()
+  $("#workspace").append(image)
   $("#uploaded-url").hide().val("")
+	$("#uploaded-url + br").hide()
   $("#save,#upload,#rendered").show()
   $("#pause,#render,#add-frame,#save,#upload").enable()
-  $("#render").html("render")
+  $("#render").html("render gif")
   rendering = false
   pause(true)
 })
 
-function get_filename(){
-  var basename = $("#url").val().replace(/^.*\//,"").replace(/\..*$/,"").replace(/[^-_ a-zA-Z0-9]/g,"")
-  var username = user.username
-  var filename = basename + "-" + username + "-" + (+new Date()) + ".gif"
-  return filename.replace(/ /g,"_").replace(/-+/g,"-")
-}
-function save (){
-  if (! lastGif) return;
-  var filename = get_filename()
-  var blob = dataUriToBlob(lastGif)
-  saveAs(blob, filename);
-}
-function saveJSON (data, filename) {
-  var bytes = JSON.stringify(data)
-  var buf = new ArrayBuffer(bytes.length);
-  var arr = new Uint8Array(buf);
-  for (var i = 0; i < bytes.length; i++) {
-    arr[i] = bytes.charCodeAt(i);
-  }
-
-  var blob = new Blob([arr], { type: "text/json" });
-  blob.slice = blob.slice || blob.webkitSlice;
-  
-  saveAs(blob, filename);
-}
-
-function upload(){
-  var filename = get_filename()
-  var username = user.username
-  var blob = dataUriToBlob(lastGif)
-  uploadImage({
-    blob: blob,
-    filename: filename,
-    username: username,
-    success: function(data){
-    
-      // data.url
-      // data.filesize
-      // data.success
-
-      console.log(data);
-      status("uploaded");
-      $("#uploaded-url").show().focus().val(data.url)
-    },
-    error: function(data){
-      console.log(data)
-      status("error uploading: " + data.error)
-    }
-  });
-}
diff --git a/js/gallery.js b/js/gallery.js
index 16ecdd8..839316c 100644
--- a/js/gallery.js
+++ b/js/gallery.js
@@ -3,7 +3,10 @@
 
 var gallery = {}
 
-gallery.init = function(){
+gallery.init = function(choose){
+	if (choose) {
+		gallery.choose = choose;
+	}
   gallery.bind()
 }
 
@@ -11,7 +14,6 @@ gallery.bind = function(){
   $("#gallery-random").click(asdf.random)
   $("#gallery-search").submit(dumpfm.search)
   $(document).on("click", "#gallery-images canvas", gallery.click)
-  status("ready")
 }
 
 gallery.load = function(ims){
@@ -43,6 +45,7 @@ gallery.image = function(im){
       $(thumb.canvas).show()
     })
     $(img).click(gallery.choose);
+    $("#persist-image").attr("checked", false)
   }
   try { img.src = im.url; }
   catch(e){ return; }
@@ -52,3 +55,10 @@ gallery.image = function(im){
 gallery.click = function(){
   gallery.choose()
 }
+
+// template for choose function.. bound to an image object
+gallery.choose = function(){
+	var img = this
+  var imageURL = this.src
+}
+
diff --git a/js/help.js b/js/help.js
new file mode 100644
index 0000000..db0ac6d
--- /dev/null
+++ b/js/help.js
@@ -0,0 +1,47 @@
+
+var help = {}
+
+help.init = function(){
+	help.bind()
+}
+
+help.bind = function(){
+	$(window).on("scroll DOMMouseScroll mousewheel", function(){ scrolling = true })
+	$("#show-commands").click(function(){ $("#tutorial").hide(); $("#commands").toggle() })
+	$("#show-tutorial").click(function(){ $("#commands").hide(); $("#tutorial").toggle() })
+	$("#commands .close").click(function(){ $("#commands").toggle() })
+	$("#tutorial .close").click(function(){ $("#tutorial").toggle() })
+	$("#commands,#tutorial").draggable({
+		start: drag_start,
+		stop: drag_stop
+	})
+	$("#commands,#tutorial").disableSelection();
+	
+	$("#examples").change(function(){ 
+		help.load_example($(this).val())
+		$("#toggle-images").trigger("click")
+	})
+
+  if ('EXAMPLE_SHADERS' in window) {
+  	help.examples = {}
+    window.EXAMPLE_SHADERS.forEach(function(s){
+    	help.examples[ s.name ] = s.shader
+			var $option = $("<option value='" + s.name +"'>" + s.name + "</option>")
+			$("#examples").append($option)
+    })
+  }
+}
+
+help.examples = {}
+
+help.load_example = function(name){
+	var s = help.examples[name]
+	$("#shader").html(s)
+	new_shader({ name: name, shader: s })
+}
+
+function drag_start(){ dragging = true; $(this).addClass("dragging") }
+function drag_stop(){ dragging = false; $(".dragging").removeClass("dragging") }
+
+function status(s){ $(".status").html(s); console.log(s) }
+function quiet_status(s){ $(".status").html(s) }
diff --git a/js/image.js b/js/image.js
index 7a5240f..9296300 100644
--- a/js/image.js
+++ b/js/image.js
@@ -1,20 +1,30 @@
+var gif, img
+var imageURL = null
+
 function loadImage(imageURL, callback) {
   var imageURL = proxify( imageURL );
+  window.imageURL = imageURL
 
-  window.gif = window.img = null
+  window.gif = window.img = window.cam = null
 
-  if (imageURL.substr(-3) === "gif") {
+	if (! imageURL) {
+		window.gif = null
+		window.img = null
+		callback()
+	}
+  else if (imageURL.substr(-3).toLowerCase() === "gif") {
     window.gif = GIF(imageURL);
     // gif.on("error", tryToLoadNextImage);
     // gif.on("rendered", trackLoadTime);
     gif.on("rendered", callback);
-    return gif.render();
-  } else {
+		gif.render();
+  }
+  else {
     window.img = new Image();
     // img.addEventListener("error", tryToLoadNextImage);
     img.addEventListener("load", callback);
     img.crossOrigin = "anonymous";
-    return img.src = imageURL;
+    img.src = imageURL;
   }
 }
 
@@ -28,7 +38,7 @@ function giveImage(t) {
 
 function proxify (url) {
   if (url.indexOf("http") == 0)
-    return "/cgi-bin/proxy?" + url // .replace(/^https?:\/\//, "");
+    return "/cgi-bin/proxy?" + url.replace(/^https/, "http");
   else
     return url
 }
@@ -57,9 +67,10 @@ function uploadImage(opt){
   form.append("username", opt.username);
   form.append("filename", opt.filename);
   form.append("qqfile", opt.blob);
+  form.append("tag", opt.tag);
 
   var req = new XMLHttpRequest();
-  req.open("POST", "/cgi-bin/im/upload");
+  req.open("POST", "/cgi-bin/im/shader/upload");
   req.onload = function(event) {
     if (req.status == 200) {
       var res = JSON.parse(req.responseText);
diff --git a/js/render.js b/js/render.js
index fdb0125..a589efc 100644
--- a/js/render.js
+++ b/js/render.js
@@ -1,106 +1,160 @@
 var frame, img_frame;
 var timeout, raf_id, start_t = 0, old_t = 0, pause_t = 0
-var paused = false, dragging = false, rendering = false, scrolling = false, deferring = false, scrollTimeout = null;
-var fps = 30;
+var paused = false, dragging = false, rendering = false, scrolling = false, deferring = false, scrollTimeout = null
+var fps = 30
+var preserve_dimensions = false;
 
 function choose (){
-  imageURL = this.src
-  loading = true
-  $("#url").val(imageURL)
-  loadImage(imageURL, ready)
+	loading = true
+	preserve_dimensions = false
+	$("#url").val(this.src)
+	loadImage(this.src, ready)
+	reset()
 }
+
 function load(){
-  loading = true
-  var imageURL = $("#url").val()
-  loadImage(imageURL, ready)
+	var newImageURL = $("#url").val()
+	loading = true
+	if (newImageURL != imageURL) {
+		loadImage(newImageURL, ready)
+		status("loading")
+	}
 }
 
 function ready(){
-  loading = false
-  if (window.gif) {
-    frame = gif.frames[0]
-    w = cc.canvas.width = frame.ctx.canvas.width
-    h = cc.canvas.height = frame.ctx.canvas.height
-    for (var i=0, f; f=gif.frames[i]; i++){
-      f.cloneData = f.ctx.getImageData(0,0,w,h)
-    }
-  }
-  else {
-    fc = cq(img.width, img.height)
-    fc.drawImage(img, 0, 0)
-    frame = img_frame = { ctx: fc.context }
-    w = cc.canvas.width = frame.ctx.canvas.width
-    h = cc.canvas.height = frame.ctx.canvas.height
-    frame.cloneData = frame.ctx.getImageData(0,0,w,h)
-  }
+	loading = false
+	status("")
+	if (window.gif) {
+		frame = gif.frames[0]
+		actual_w = cc.canvas.width = frame.ctx.canvas.width
+		actual_h = cc.canvas.height = frame.ctx.canvas.height
+		if (! preserve_dimensions) {
+			w = actual_w
+			h = actual_h
+		}
+		for (var i=0, f; f=gif.frames[i]; i++){
+			f.cloneData = f.ctx.getImageData(0,0,actual_w,actual_h)
+		}
+	}
+	else if (window.img) {
+		fc = cq(img.width, img.height)
+		fc.drawImage(img, 0, 0)
+		frame = img_frame = { ctx: fc.context }
+		actual_w = cc.canvas.width = frame.ctx.canvas.width
+		actual_h = cc.canvas.height = frame.ctx.canvas.height
+		if (! preserve_dimensions) {
+			w = actual_w
+			h = actual_h
+		}
+		frame.cloneData = frame.ctx.getImageData(0,0,actual_w,actual_h)
+	}
+	else {
+		cc.canvas.width = actual_w = w
+		cc.canvas.height = actual_h = h
+		shader_build()
+	}
+	displayWidthHeight(w, h)
+	preserve_dimensions = false;
+}
+
+function displayWidthHeight(width, height){
+	$("#width").val(width)
+	$("#height").val(height)
 }
 
 function giveFrame(t){
-  if (window.gif) {
-    if (gif.currentFrame) {
-      return gif.frames[gif.currentFrame(t)]
-    }
-    else {
-      return gif.frames[0]
-    }
-  }
-  else if (window.img) {
-    return img_frame
-  }
-  else {
-    return cq(w, h)
-  }
+	if (window.gif) {
+		if (gif.currentFrame) {
+			return gif.frames[gif.currentFrame(t)]
+		}
+		else if (gif.frames) {
+			return gif.frames[0]
+		}
+	}
+	if (window.img) {
+		return img_frame
+	}
+	else if (window.cam) {
+		return camera_frame()
+	}
+	else {
+		return empty_frame()
+	}
+}
+
+function empty_frame(){
+	actual_w = w = w || 400
+	actual_h = h = h || 266
+	var cx = cq(w, h).fillStyle("rgba(255,255,255,255)").fillRect(0,0,w,h)
+	return { ctx: cx.context, cloneData: cx.getImageData(0,0,w,h) }
+}
+
+function feedback_frame(){
+	return { ctx: cc.context, cloneData: cc.getImageData(0,0,w,h) }
+}
+
+function camera_frame(){
+	var cx = cq(w, h).drawImage(cam, 0, 0, w, h)
+	return { ctx: cx.context, cloneData: cx.getImageData(0,0,w,h) }
 }
 
 function reset(){
-  start_t = old_t
-  pause_t = 0
-  pause(false)
-  $("#rendered img").remove()
-  draw(0)
+	start_t = old_t
+	pause_t = 0
+	pause(false)
+	$("#workspace img").remove()
+	$("#workspace canvas").show()
+  $("#uploaded-url").hide()
+	$("#uploaded-url + br").show()
+	remove_all_frames()
+	draw(0)
 }
 
 function pause(state){
-  $("#pause").toggleClass("paused", paused = typeof state == "boolean" ? state : ! paused).html(paused ? "paused" : "pause")
+	paused = typeof state == "boolean" ? state : ! paused
+	$("#pause").toggleClass("paused", paused).html(paused ? "paused" : "pause")
+	if (!paused) {
+		$("#workspace canvas").show()
+		$("#workspace img").hide()
+		$("#save,#upload").disable()
+	}
 }
 
 function step_forward(){
-  var step = $("#framedelay").float() * 1000 || 100
-  old_t += step
-  draw(old_t)
-  pause(true)
+	var step = $("#framedelay").float() * 1000 || 100
+	old_t += step
+	draw(old_t)
+	pause(true)
 }
 
 function animate(t){
-  raf_id = requestAnimationFrame(animate);
+	raf_id = requestAnimationFrame(animate);
 
-  var step_t = t - old_t
-  old_t = t
-  
-  if (paused || dragging || rendering || scrolling || deferring) {
-    pause_t += step_t
-    if (scrolling) {
-      scrolling = false
-      deferring = true
-    }
-    else {
-      deferring = false
-    }
-    return
-  }
+	var step_t = t - old_t
+	old_t = t
 
-  // var timing = +(new Date())
-  draw(t)
-  // timing = +(new Date()) - timing
-  fps = avg(fps, 1000/step_t, 4)
-  // status(~~(fps) + " fps")
+	if (paused || dragging || rendering || scrolling || deferring) {
+		pause_t += step_t
+		if (scrolling) {
+			scrolling = false
+			deferring = true
+		}
+		else {
+			deferring = false
+		}
+		return
+	}
+
+	// var timing = +(new Date())
+	draw(t)
+	// timing = +(new Date()) - timing
+	fps = avg(fps, 1000/step_t, 4)
+	quiet_status(~~(fps) + " fps")
 }
 
 function draw(t) {
-  t -= start_t
-  t -= pause_t
-  frame = giveFrame(t)
-  shade(frame, t)
+	t -= start_t
+	t -= pause_t
+	frame = giveFrame(t)
+	shade(frame, t)
 }
-
-function status(s){ $("#status").html(s); console.log(s) }
diff --git a/js/save.js b/js/save.js
new file mode 100644
index 0000000..ec2fc6b
--- /dev/null
+++ b/js/save.js
@@ -0,0 +1,54 @@
+function get_filename(){
+  var basename = $("#url").val().replace(/^.*\//,"").replace(/\..*$/,"").replace(/[^-_ a-zA-Z0-9]/g,"")
+  var username = user.username
+  var filename = basename + "-" + username + "-" + (+new Date()) + ".gif"
+  return filename.replace(/ /g,"_").replace(/-+/g,"-")
+}
+function save (){
+  if (! lastGif) return;
+  var filename = get_filename()
+  var blob = dataUriToBlob(lastGif)
+  saveAs(blob, filename);
+}
+function saveJSON (data, filename) {
+  var bytes = JSON.stringify(data)
+  var buf = new ArrayBuffer(bytes.length);
+  var arr = new Uint8Array(buf);
+  for (var i = 0; i < bytes.length; i++) {
+    arr[i] = bytes.charCodeAt(i);
+  }
+
+  var blob = new Blob([arr], { type: "text/json" });
+  blob.slice = blob.slice || blob.webkitSlice;
+  
+  saveAs(blob, filename);
+}
+
+function upload(uri, filename, tag){
+  filename = filename || get_filename()
+  uri = (uri && ! uri.target) ? uri : lastGif
+  tag = tag || "shader"
+  
+  var blob = dataUriToBlob(uri)
+  uploadImage({
+    blob: blob,
+    filename: filename,
+    username: user.username,
+    tag: tag,
+    success: function(data){
+
+      // data.url
+      // data.filesize
+      // data.success
+
+      console.log(data);
+      $("#uploaded-url").show().focus().val(data.url)
+      $("#uploaded-url + br").show()
+      status && status("uploaded");
+    },
+    error: function(data){
+      console.log(data)
+      status("error uploading: " + data.error)
+    }
+  });
+}
diff --git a/js/shader.js b/js/shader.js
index 4a6e950..a8559ba 100644
--- a/js/shader.js
+++ b/js/shader.js
@@ -1,3 +1,5 @@
+function shader (x,y,t,d) {}
+
 var shader_build = function(){
   var fn_str = document.getElementById('shader').value
   if (!fn_str.length) fn_str = ""
@@ -16,7 +18,7 @@ var shader_build = function(){
 }
 
 var r,g,b,a;
-
+var w, h, actual_w, actual_h;
 function shade_no_error_handling(frame, t){
   if (! t || isNaN(t)) throw Error ("No time specified")
   if (! frame) throw Error ("No frame specified")
@@ -46,7 +48,7 @@ var firefox_stack_regexp = /:([0-9]+)$/;
 
 function shade_error_handling(frame, t){
   if (! t || isNaN(t)) throw Error ("No time specified")
-  if (! frame) throw Error ("No frame specified")
+  if (! frame || ! frame.ctx || ! frame.cloneData) throw Error ("No frame specified")
 
   var imgData = frame.ctx.getImageData(0,0,w,h)
   var data = imgData.data
@@ -77,7 +79,7 @@ function shade_error_handling(frame, t){
 
     } else if (lines.length > 1) { // attempt chrome match
       var matches = lines[1].match(chrome_stack_regexp)
-      if (matches.length > 1)
+      if (matches && matches.length > 1)
         error_highlight.on(parseInt(matches[1]) - 3)
     }
     
diff --git a/js/user.js b/js/user.js
index a1ac53e..16bf163 100644
--- a/js/user.js
+++ b/js/user.js
@@ -10,6 +10,13 @@ user.load = function(){
   user.username = user.getCookie()
   $("#username").val(user.username)
 }
+user.prefs = new function(){}
+user.prefs.get = function (key){
+	return localStorage.getItem("im.prefs." + key)
+}
+user.prefs.set = function (key,value){
+	return localStorage.setItem("im.prefs." + key, value)
+}
 user.sanitize = function(){
   return $("#username").val().replace(/[^-_ a-zA-Z0-9]/g,"")
 }
diff --git a/js/util.js b/js/util.js
index 1a1a0fe..911e44b 100644
--- a/js/util.js
+++ b/js/util.js
@@ -6,24 +6,30 @@ if (window.$) {
   $.fn.disable = function() { return $(this).attr("disabled","disabled") }
 }
 
+function noop(){}
 function trim(s){ return s.replace(/^\s+/,"").replace(/\s+$/,"") }
 
 var E = Math.E
 var PI = Math.PI
 var PHI = (1+Math.sqrt(5))/2
+var TWO_PI = PI*2
+var LN10 = Math.LN10
 function clamp(n,a,b){ return n<a?a:n<b?n:b }
+function norm(n,a,b){ return (n-a) / (b-a) }
 function lerp(n,a,b){ return (b-a)*n+a }
 function mix(n,a,b){ return a*(1-n)+b*n }
 function ceil(n){ return Math.ceil(n) }
 function floor(n){ return Math.floor(n) }
 function round(n){ return Math.round(n) }
-function max(n){ return Math.max(n) }
-function min(n){ return Math.min(n) }
+function max(a,b){ return Math.max(a,b) }
+function min(a,b){ return Math.min(a,b) }
 function abs(n){ return Math.abs(n) }
 function sign(n){ return Math.abs(n)/n }
 function pow(n,b) { return Math.pow(n,b) }
 function exp(n) { return Math.exp(n) }
-function sqrt(n) { return Math.sqrt(n,b) }
+function log(n){ return Math.log(n) }
+function ln(n){ return Math.log(n)/LN10 }
+function sqrt(n) { return Math.sqrt(n) }
 function cos(n){ return Math.cos(n) }
 function sin(n){ return Math.sin(n) }
 function tan(n){ return Math.tan(n) }
@@ -39,11 +45,19 @@ function sinp(n){ return (1+Math.sin(n))/2 }
 function random(){ return Math.random() }
 function rand(n){ return (Math.random()*n) }
 function randint(n){ return rand(n)|0 }
+function randrange(a,b){ return a + rand(b-a) }
+function randsign(){ return random() >= 0.5 ? -1 : 1 }
 function choice(a){ return a[randint(a.length)] }
 function deg(n){ return n*180/PI }
 function rad(n){ return n*PI/180 }
 function xor(a,b){ a=!!a; b=!!b; return (a||b) && !(a&&b) }
-function pixel(x,y){ return 4*(mod(y,h)*w+mod(x,w)) }
+function mod(n,m){ return n-(m * floor(n/m)) }
+function dist(x0,y0,x1,y1){ return sqrt(pow(x1-x0,2)+pow(y1-y0,2)) }
+function angle(x0,y0,x1,y1){ return atan2(y1-y0,x1-x0) }
+function avg(m,n,a){ return (m*(a-1)+n)/a }
+function quantize(a,b){ return ~~(a/b)*b }
+
+function pixel(x,y){ return 4*(mod(y,actual_h)*actual_w+mod(x,actual_w)) }
 function rgbpixel(d,x,y){
   var p = pixel(~~x,~~y)
   r = d[p]
@@ -51,18 +65,16 @@ function rgbpixel(d,x,y){
   b = d[p+2]
   a = d[p+3]
 }
-function mod(n,m){ return n-(m * floor(n/m)) }
-function dist(x0,y0,x1,y1){ return sqrt(pow(x1-x0,2)+pow(y1-y0,2)) }
-function angle(x0,y0,x1,y1){ return atan2(y1-y0,x1-x0) }
-function avg(m,n,a){ return (m*(a-1)+n)/a }
+function fit(d,x,y){ rgbpixel(d,x*actual_w/w,y*actual_h/h) }
 
 function step(a, b){
   return (b >= a) + 0 
                // ^^ bool -> int
 }
 
+
 function julestep (a,b,n) {
-  return clamp((n - a) / (b - a), 0.0, 1.0);
+  return clamp(norm(n,a,b), 0.0, 1.0);
 }
 
 // hermite curve apparently
diff --git a/js/vendor/gif-encode.min.js b/js/vendor/gif-encode.min.js
new file mode 100644
index 0000000..be5e2cd
--- /dev/null
+++ b/js/vendor/gif-encode.min.js
@@ -0,0 +1,2 @@
+/* asdf.us/gif-recorder */
+function shuffle(a){var b=new Array(a.length);b[0]=a[0];for(var c=1;c<a.length;c++){var d=Math.floor(Math.random()*c);b[c]=b[d],b[d]=a[c]}return b}function sample(a,b){var c=shuffle(a);return c.slice(0,b)}function GifEncoder(){function a(){var a=this,b=0,c=[];a.init=function(){for(var b=0;WORKERS>b;b++){var d=new Worker(workerURL);d.onmessage=a.receiveWork,c.push(d)}};var d={};a.hire=function(a,b){d[a]=b},a.work=function(a){c[++b%c.length].postMessage(a)},a.receiveWork=function(a){a.data.task in d&&d[a.data.task](a)},a.fire=function(){for(var b in c)c[b].postMessage("close");c=[],a.init()},a.init()}function b(a){console.log("[WORKER]",a.data.message)}function c(a){console.log(Date.now()-q,"quantization done"),i=a.data.neuquant,j=a.data.colortab,f.quantized=!0,f.tube("quantized")}function d(a){var b=a.data.frame_index,c=a.data.frame_data;m[b]=c,f.tube("encoded-frame",m.length,k.length);for(var d=0;d<k.length;d++)if(null==m[d])return;console.log("FINISHED "+k.length);var e=m.join(""),g=window.btoa(e),h="data:image/gif;base64,"+g;f.working=!1,f.tube("rendered",e),f.tube("rendered-url",h),console.log(Date.now()-q,"processed frames"),console.log(Date.now()-p,"done"),r.fire()}function e(a){var b=Date.now();a=Math.min(l.length,a);var c=document.createElement("canvas"),d=c.getContext("2d");c.width=g,c.height=h*a;for(var e=d.getImageData(0,0,c.width,c.height),f=e.data,i=0,j=sample(l,4);a--;)for(var k=j[a],m=k.getImageData(0,0,g,h).data,n=0;n<m.length;i++,n++)f[i]=m[n];return console.log(Date.now()-b,"built spritesheet"),e}var f=this;this.working=!1;var g,h,i,j,k=[],l=[],m=[],n=[],g=0,h=0,o=0,p=Date.now(),q=Date.now(),r=(f.tube=new Tube,new a);r.hire("message",b),r.hire("quantize",c),r.hire("encode",d);var s=(this.reset=function(){s(),i=null,j=null,f.quantized=!1},this.resetFrames=function(){k=[],l=[],m=[],n=[],g=0,h=0,o=0});this.on=function(){f.tube.on.apply(f.tube,arguments)},this.off=function(){f.tube.off.apply(f.tube,arguments)};{var i,j;this.addFrame=function(a,b){var c=a.getContext("2d");k.push(a),l.push(c),n.push(b),1==k.length&&(g=a.width,h=a.height)},this.addFrames=function(a,b){for(var c=0;c<a.length;c++){var d=a[c],e=d.getContext("2d");k.push(d),l.push(e),n.push(b)}k.length==a.length&&(g=a[0].width,h=a[0].height)},this.copyFrame=function(a,b){var c=document.createElement("canvas"),d=c.getContext("2d");d.drawImage(a,0,0,a.width,a.height),k.push(c),l.push(d),n.push(b),1==k.length&&(g=a.width,h=a.height)},this.quantize=function(){p=Date.now(),q=Date.now();var a=e(FRAMES_TO_QUANTIZE);r.work({task:"quantize",imageData:a})},this.encode=function(a,b){function c(){if(e==k.length)return d();var a=l[e],b=a.getImageData(0,0,g,h).data,f=n[e];r.work({task:"encode",frame_index:e,frame_length:l.length-1,height:h,width:g,delay:f,imageData:b,neuquant:i,colortab:j}),e++,setTimeout(c,16)}function d(){f.tube("done_sending")}if(!k.length)throw Error("No frames to encode");a=a||i,b=b||j,q=Date.now(),o=0,console.log("working .... ");var e=0;c()}}}var nextTick=function(){if(window.ActiveXObject||!window.postMessage)var a=function(a){setTimeout(a,0)};else{var b=[],c="next-tick-zero-timeout";window.addEventListener("message",function(a){a.source==window&&a.data==c&&(a.stopPropagation&&a.stopPropagation(),b.length&&b.shift()())},!0);var a=function(a){b.push(a),window.postMessage(c,"*")}}return a}(),Uid=function(){var a=0;return function(){return a++ +""}}(),tokenize=function(){var a=function(b,c){return b.trim().split(c||a.default)};return a.default=/\s+/g,a}(),globber=function(a,b){var c,d=a[0],e=a.slice(1),f=b.length;if("*"===d){for(var g=0;f>=g;++g)if(globber(e,b.slice(g)))return!0;return!1}return c=d===b[0],c&&(!e.length&&!f||globber(e,b.slice(1)))},setproto=function(a,b){if(a.__proto__)a.__proto__=b;else for(var c in b)a[c]=b[c]},Tube=function(){var a={},b=function(a){if(a=a||{},a.queue)var c=function(){var a=arguments;return nextTick(function(){c.send.apply(c,a)}),c};else var c=function(){return c.send.apply(c,arguments),c};return setproto(c,b.proto),c.listeners={},c.globListeners={},c};return b.total={},b.proto={},b.proto.on=function(){var a=this;if("string"==typeof arguments[0]){var b={};b[arguments[0]]=arguments[1];{arguments[2]||{}}}else{var b=arguments[0];arguments[1]||{}}for(var c in b){var d=c.split(" "),e=b[c];Array.isArray(e)||(e=[e]);for(var f,g=0;f=e[g];g++)f.uid||(f.uid=Uid());for(var h,g=0;h=d[g];g++){var i=-1===h.indexOf("*")?a.listeners:a.globListeners;i[h]=h in i?i[h].concat(e):e.concat()}}return a},b.proto.off=function(){var a,b,c,d,e=this;if(0===arguments.length)return e.listeners={},e.globListeners={},e;if(1===arguments.length&&"string"==typeof arguments[0]){for(c=arguments[0].split(" "),b=0;d=c[b];b++)delete e.listeners[d],delete e.globListeners[d];return e}if("function"==typeof arguments[0]||Array.isArray(arguments[0])){var f="function"==typeof arguments[0]?[arguments[0]]:arguments[0];return e}if(arguments.length>1){var g={};g[arguments[0]]=arguments[1]}else var g=arguments[0];for(var h in g){c=h.split(" ");var f=g[h];"function"==typeof f&&(f=[f]);for(var b=0;d=c[b];b++){if(d in e.listeners)a=e.listeners;else{if(!(d in e.globListeners))continue;a=e.globListeners}a[d]=a[d].filter(function(a){return-1===f.indexOf(a)})}}return e},b.proto.send=function(c){b.total[c]||(b.total[c]=0),b.total[c]+=1;var d,e,f,g=this.listeners,h=this.globListeners,i=tokenize(c);if(arguments.length){var j=Array.prototype.splice.call(arguments,1);j.push(c)}else var j=[];for(var k=0;e=i[k];k++){var l={},m={};if(d=g[e])for(var n=0;f=d[n];n++)l[f.uid]=f,m[f.uid]=e;var o=e.split(":");for(var p in h){if("*"!==p){var q=a[p]||(a[p]=p.split(":"));if(!globber(q,o))continue}d=h[p];for(var n=0;f=d[n];n++)l[f.uid]=f,m[f.uid]=e}var r=[];for(var f in l)r.push(l[f]);for(var f,n=0;f=r[n];n++)f.apply(f,j)}return this},b}(),FRAMES_PER_GIF=36,FPS=12,DELAY=Math.floor(1e3/FPS),WORKERS=6,FRAMES_TO_QUANTIZE=4,DO_UPLOAD=!0,workerURL=URL.createObjectURL(new Blob(["(",function(){function a(a){var c=a.imageData,d=b(c.data),e=new NeuQuant(d,d.length,1),f=e.process();self.postMessage({task:"quantize",neuquant:e.save(),colortab:f})}function b(a){for(var b=[],c=0,d=0,e=a.length;e>c;d+=4)b[c++]=a[d],b[c++]=a[d+1],b[c++]=a[d+2];return b}function c(a){var b=a.frame_index,c=a.frame_length,d=a.height,e=a.width,f=a.imageData,g=a.delay,h=a.neuquant,i=a.colortab,j=new GIFEncoder;j.setRepeat(0),j.setQuality(1),j.setSize(e,d),j.setDelay(g),0==b?j.start():(j.cont(),j.setProperties(!0,!1)),j.setNeuquant(h,i),j.addFrame(f,!0),c==b&&j.finish(),self.postMessage({task:"encode",frame_index:b,frame_data:j.stream().getData()}),delete j,delete a}GIFEncoder=function(){function a(){this.bin=[]}for(var b=0,c={};256>b;b++)c[b]=String.fromCharCode(b);a.prototype.getData=function(){for(var a="",b=this.bin.length,d=0;b>d;d++)a+=c[this.bin[d]];return a},a.prototype.writeByte=function(a){this.bin.push(a)},a.prototype.writeUTFBytes=function(a){for(var b=a.length,c=0;b>c;c++)this.writeByte(a.charCodeAt(c))},a.prototype.writeBytes=function(a,b,c){for(var d=c||a.length,e=b||0;d>e;e++)this.writeByte(a[e])};var d,e,f,g,h,i,j,k,l,m={},n=null,o=-1,p=0,q=!1,r=new Array,s=7,t=-1,u=!1,v=!0,w=!1,x=1,y=null,z=(m.setDelay=function(a){p=Math.round(a/10)},m.setDispose=function(a){a>=0&&(t=a)},m.setRepeat=function(a){a>=0&&(o=a)},m.setTransparent=function(a){n=a},m.addFrame=function(a,b){if(null==a||!q||null==g)throw new Error("Please call start method before calling addFrame");var c=!0;try{b?h=a:(h=a.getImageData(0,0,a.canvas.width,a.canvas.height).data,w||A(a.canvas.width,a.canvas.height)),D(),B(),v&&(G(),I(),o>=0&&H()),E(),F(),v||I(),K(),v=!1}catch(d){c=!1}return c},m.finish=function(){if(!q)return!1;var a=!0;q=!1;try{g.writeByte(59)}catch(b){a=!1}return a},function(){f=0,h=null,i=null,j=null,l=null,u=!1,v=!0}),A=(m.setFrameRate=function(a){15!=a&&(p=Math.round(100/a))},m.setQuality=function(a){x=Math.max(1,a)},m.setSize=function(a,b){(!q||v)&&(d=a,e=b,1>d&&(d=320),1>e&&(e=240),w=!0)}),B=(m.setNeuquant=function(a,b){y=a,l=b},m.start=function(){z();var b=!0;u=!1,g=new a;try{g.writeUTFBytes("GIF89a")}catch(c){b=!1}return q=b},m.cont=function(){z();var b=!0;return u=!1,g=new a,q=b},function(){var a=i.length,b=a/3;j=[];var c;y&&l?(c=new NeuQuant,c.load(y)):(c=new NeuQuant(i,a,x),l=c.process());for(var d=0,e=0;b>e;e++){var g=c.map(255&i[d++],255&i[d++],255&i[d++]);r[g]=!0,j[e]=g}i=null,k=8,s=7,null!=n&&(f=C(n))}),C=function(a){if(null==l)return-1;for(var b=(16711680&a)>>16,c=(65280&a)>>8,d=255&a,e=0,f=16777216,g=l.length,h=0;g>h;){var i=b-(255&l[h++]),j=c-(255&l[h++]),k=d-(255&l[h]),m=i*i+j*j+k*k,n=h/3;r[n]&&f>m&&(f=m,e=n),h++}return e},D=function(){var a=d,b=e;i=[];for(var c=h,f=0,g=0;b>g;g++)for(var j=0;a>j;j++){var k=g*a*4+4*j;i[f++]=c[k],i[f++]=c[k+1],i[f++]=c[k+2]}},E=function(){g.writeByte(33),g.writeByte(249),g.writeByte(4);var a,b;null==n?(a=0,b=0):(a=1,b=2),t>=0&&(b=7&t),b<<=2,g.writeByte(0|b|0|a),J(p),g.writeByte(f),g.writeByte(0)},F=function(){g.writeByte(44),J(0),J(0),J(d),J(e),g.writeByte(v?0:128|s)},G=function(){J(d),J(e),g.writeByte(240|s),g.writeByte(0),g.writeByte(0)},H=function(){g.writeByte(33),g.writeByte(255),g.writeByte(11),g.writeUTFBytes("NETSCAPE2.0"),g.writeByte(3),g.writeByte(1),J(o),g.writeByte(0)},I=function(){g.writeBytes(l);for(var a=768-l.length,b=0;a>b;b++)g.writeByte(0)},J=function(a){g.writeByte(255&a),g.writeByte(a>>8&255)},K=function(){var a=new LZWEncoder(d,e,j,k);a.encode(g)};return m.stream=function(){return g},m.setProperties=function(a,b){q=a,v=b},m},LZWEncoder=function(){var a,b,c,d,e,f,g,h,i,j,k,l,m={},n=-1,o=12,p=5003,q=o,r=1<<o,s=new Array,t=new Array,u=p,v=0,w=!1,x=0,y=0,z=[0,1,3,7,15,31,63,127,255,511,1023,2047,4095,8191,16383,32767,65535],A=[],B=m.LZWEncoder=function(e,f,g,h){a=e,b=f,c=g,d=Math.max(2,h)},C=function(a,b){A[l++]=a,l>=254&&G(b)},D=function(a){E(u),v=j+2,w=!0,J(j,a)},E=function(a){for(var b=0;a>b;++b)s[b]=-1},F=m.compress=function(a,b){var c,d,e,f,m,o,p;for(i=a,w=!1,g=i,h=H(g),j=1<<a-1,k=j+1,v=j+2,l=0,f=I(),p=0,c=u;65536>c;c*=2)++p;p=8-p,o=u,E(o),J(j,b);a:for(;(e=I())!=n;)if(c=(e<<q)+f,d=e<<p^f,s[d]!=c){if(s[d]>=0){m=o-d,0==d&&(m=1);do if((d-=m)<0&&(d+=o),s[d]==c){f=t[d];continue a}while(s[d]>=0)}J(f,b),f=e,r>v?(t[d]=v++,s[d]=c):D(b)}else f=t[d];J(f,b),J(k,b)},G=(m.encode=function(c){c.writeByte(d),e=a*b,f=0,F(d+1,c),c.writeByte(0)},function(a){l>0&&(a.writeByte(l),a.writeBytes(A,0,l),l=0)}),H=function(a){return(1<<a)-1},I=function(){if(0==e)return n;--e;var a=c[f++];return 255&a},J=function(a,b){for(x&=z[y],y>0?x|=a<<y:x=a,y+=g;y>=8;)C(255&x,b),x>>=8,y-=8;if((v>h||w)&&(w?(h=H(g=i),w=!1):(++g,h=g==q?r:H(g))),a==k){for(;y>0;)C(255&x,b),x>>=8,y-=8;G(b)}};return B.apply(this,arguments),m},NeuQuant=function(){var a,b,c,d,e,f={},g=128,h=499,i=491,j=487,k=503,l=3*k,m=g-1,n=4,o=100,p=16,q=1<<p,r=10,s=10,t=q>>s,u=q<<r-s,v=g>>3,w=6,x=1<<w,y=v*x,z=30,A=10,B=1<<A,C=8,D=1<<C,E=A+C,F=1<<E,G=new Array,H=new Array,I=new Array,J=new Array,K=f.NeuQuant=function(a,f,h){if(a&&f&&h){var i,j;for(b=a,c=f,d=h,e=new Array(g),i=0;g>i;i++)e[i]=new Array(4),j=e[i],j[0]=j[1]=j[2]=(i<<n+8)/g,I[i]=q/g,H[i]=0}},L=function(){for(var a=[],b=new Array(g),c=0;g>c;c++)b[e[c][3]]=c;for(var d=0,f=0;g>f;f++){var h=b[f];a[d++]=e[h][0],a[d++]=e[h][1],a[d++]=e[h][2]}return a},M=function(){var a,b,c,d,f,h,i,j;for(i=0,j=0,a=0;g>a;a++){for(f=e[a],c=a,d=f[1],b=a+1;g>b;b++)h=e[b],h[1]<d&&(c=b,d=h[1]);if(h=e[c],a!=c&&(b=h[0],h[0]=f[0],f[0]=b,b=h[1],h[1]=f[1],f[1]=b,b=h[2],h[2]=f[2],f[2]=b,b=h[3],h[3]=f[3],f[3]=b),d!=i){for(G[i]=j+a>>1,b=i+1;d>b;b++)G[b]=a;i=d,j=a}}for(G[i]=j+m>>1,b=i+1;256>b;b++)G[b]=m},N=function(){var e,f,g,m,p,q,r,s,t,u,v,x,A,C;for(l>c&&(d=1),a=30+(d-1)/3,x=b,A=0,C=c,v=c/(3*d),u=v/o,s=B,q=y,r=q>>w,1>=r&&(r=0),e=0;r>e;e++)J[e]=s*((r*r-e*e)*D/(r*r));for(t=l>c?3:c%h!=0?3*h:c%i!=0?3*i:c%j!=0?3*j:3*k,e=0;v>e;)if(g=(255&x[A+0])<<n,m=(255&x[A+1])<<n,p=(255&x[A+2])<<n,f=R(g,m,p),Q(s,f,g,m,p),0!=r&&P(r,f,g,m,p),A+=t,A>=C&&(A-=c),e++,0==u&&(u=1),e%u==0)for(s-=s/a,q-=q/z,r=q>>w,1>=r&&(r=0),f=0;r>f;f++)J[f]=s*((r*r-f*f)*D/(r*r))},O=(f.save=function(){var a={netindex:G,netsize:g,network:e};return a},f.load=function(a){G=a.netindex,g=a.netsize,e=a.network},f.map=function(a,b,c){var d,f,h,i,j,k,l;for(j=1e3,l=-1,d=G[b],f=d-1;g>d||f>=0;)g>d&&(k=e[d],h=k[1]-b,h>=j?d=g:(d++,0>h&&(h=-h),i=k[0]-a,0>i&&(i=-i),h+=i,j>h&&(i=k[2]-c,0>i&&(i=-i),h+=i,j>h&&(j=h,l=k[3])))),f>=0&&(k=e[f],h=b-k[1],h>=j?f=-1:(f--,0>h&&(h=-h),i=k[0]-a,0>i&&(i=-i),h+=i,j>h&&(i=k[2]-c,0>i&&(i=-i),h+=i,j>h&&(j=h,l=k[3]))));return l},f.process=function(){return N(),O(),M(),L()},function(){var a;for(a=0;g>a;a++)e[a][0]>>=n,e[a][1]>>=n,e[a][2]>>=n,e[a][3]=a}),P=function(a,b,c,d,f){var h,i,j,k,l,m,n;for(j=b-a,-1>j&&(j=-1),k=b+a,k>g&&(k=g),h=b+1,i=b-1,m=1;k>h||i>j;){if(l=J[m++],k>h){n=e[h++];try{n[0]-=l*(n[0]-c)/F,n[1]-=l*(n[1]-d)/F,n[2]-=l*(n[2]-f)/F}catch(o){}}if(i>j){n=e[i--];try{n[0]-=l*(n[0]-c)/F,n[1]-=l*(n[1]-d)/F,n[2]-=l*(n[2]-f)/F}catch(o){}}}},Q=function(a,b,c,d,f){var g=e[b];g[0]-=a*(g[0]-c)/B,g[1]-=a*(g[1]-d)/B,g[2]-=a*(g[2]-f)/B},R=function(a,b,c){var d,f,h,i,j,k,l,m,o,q;for(m=~(1<<31),o=m,k=-1,l=k,d=0;g>d;d++)q=e[d],f=q[0]-a,0>f&&(f=-f),h=q[1]-b,0>h&&(h=-h),f+=h,h=q[2]-c,0>h&&(h=-h),f+=h,m>f&&(m=f,k=d),i=f-(H[d]>>p-n),o>i&&(o=i,l=d),j=I[d]>>s,I[d]-=j,H[d]+=j<<r;return I[k]+=t,H[k]-=u,l};return K.apply(this,arguments),f},self.onmessage=function(b){var d=b.data,e=d.task;switch(e){case"encode":c(d);break;case"quantize":a(d);break;case"close":self.close()}}}.toString(),")()"],{type:"application/javascript"}));
\ No newline at end of file