Merge branch 'master' into pepper

4 files changed, 265 insertions, 36 deletions

diff --git a/js/api/gallery.js b/js/api/gallery.js
new file mode 100644
index 0000000..0e6614b
--- /dev/null
+++ b/js/api/gallery.js
@@ -0,0 +1,95 @@
+var shader_gallery = {}
+
+shader_gallery.init = function(){
+	shader_gallery.bind()
+}
+
+shader_gallery.bind = function(){
+	$("#new-shader").click(new_shader)
+	
+// 	$("#shader-id")
+//	$("#fetch-info")
+	$("#fetch-all").click(function(){
+		ShaderAPI.all(load_shaders)
+	})
+	$("#fetch-latest").click(function(){
+		ShaderAPI.latest(load_shaders)
+	}).trigger("click")
+// 	$("#fetch-next-page")
+// 	$("#fetch-history")
+
+	$("#save-shader").click(save_shader)
+
+	ShaderAPI.list_users(function(err, users){
+		var $el = $("#pick-user").empty()
+		for (var i in users) {
+			var $option = $("<option>")
+			var username = users[i].username
+			$option.val(username).html(username)
+			$el.append( $option )
+		}
+	})
+	
+	$(document).on("change", "#pick-user", function(){
+		var name = $(this).val()
+		ShaderAPI.username(name, load_shaders)
+	})
+	$(document).on("click", ".shader", function(){
+		run_shader( $(this).data("shader") )
+	})
+}
+
+function new_shader(opt){
+	opt = opt || {}
+	shader_id_root = null
+	run_shader({
+		id: "",
+		shader_id: "",
+		image_url: $("#url").val(),
+		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)
+	$("#shader-id").val(shader_object.id)
+	$("#shader-name").val( shader_object.name || "")
+	shader_build()
+}
+function load_shaders(err, shaders){
+	var $el = $("#shader-gallery").empty()
+
+	for (var i in shaders) {
+		var $shader = display_shader(shaders[i])
+		$el.append( $shader )
+	}
+	if (firsttime) {
+		firsttime = false
+		run_shader(shaders[0])
+	}
+}
+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
new file mode 100644
index 0000000..309d49d
--- /dev/null
+++ b/js/api/localstorage.js
@@ -0,0 +1,106 @@
+
+local_shaders = new function(){}
+local_shaders.init = function(){
+  local_shaders.bind()
+}
+local_shaders.bind = function(){
+  local_shaders.buttons = {}
+  if ('EXAMPLE_SHADERS' in window) {
+    local_shaders.bindButtons( window.SHADERS )
+  }
+  local_shaders.bindButtons( local_shaders.getShaders() )
+  document.getElementById("add-shader").addEventListener("click", local_shaders.save, false)
+  document.getElementById("remove-shader").addEventListener("click", local_shaders.remove, false)
+}
+local_shaders.bindButtons = function(shaders){
+  for (var i = 0; i < shaders.length; i++){
+    local_shaders.bindButton(shaders[i])
+  }
+}
+local_shaders.bindButton = function(data){
+//   console.log("button >> " + data.name)
+  var button = document.createElement("button")
+  button.innerHTML = data.name
+  button.addEventListener("click", local_shaders.load.bind(this, data), false)
+  document.getElementById("shaders").appendChild(button)
+  local_shaders.buttons[data.name] = button
+}
+local_shaders.load = function(data){
+  var shader = data.shader
+  if (shader && shader.length > 0) {
+    local_shaders.name = data.name
+    $("#shader").val(shader)
+    // pause here?
+    shader_build()
+    $(".active").removeClass("active")
+    $(local_shaders.buttons[data.name]).addClass("active")
+    local_shaders.setLastAccessed(data.name)
+  }
+}
+local_shaders.loadLastAccessed = function(){
+  var name = localStorage.getItem("im.lastShader") || "colorcycle"
+  if (name in local_shaders.buttons) {
+    $(local_shaders.buttons[name]).trigger("click")
+  }
+}
+local_shaders.setLastAccessed = function(name){
+  localStorage.setItem("im.lastShader", name)
+}
+
+local_shaders.getShaderByName = function(name){
+  return { name: name, shader: local_shaders.getShaderBody(name) }
+}
+local_shaders.getShaderIndex = function(){
+  return JSON.parse( localStorage.getItem("im.shaders") ) || []
+}
+local_shaders.getShaderBody = function(name){
+  return localStorage.getItem("im.shaders."+name) || null
+}
+local_shaders.getShaders = function(){
+  var shaders = local_shaders.getShaderIndex()
+  return shaders.map(function(name){ return { name: name, shader: local_shaders.getShaderBody(name) } })
+}
+local_shaders.setShaderIndex = function(shaders){
+  localStorage.setItem("im.shaders", JSON.stringify(shaders))
+}
+local_shaders.setShader = function(name, shader){
+  if (! name.length || ! shader.length || !name.length || !shader.length) return
+  localStorage.setItem("im.shaders." + name, shader)
+}
+local_shaders.removeShader = function(name){
+  localStorage.removeItem("im.shaders." + name)
+}
+
+local_shaders.save = function(){
+  var name = prompt("enter shader name")
+  var shader = $("#shader").val()
+
+  if (! name) return;
+  if (shade !== shade_no_error_handling) return;
+
+  local_shaders.setShader(name, shader)
+
+  var shaders = local_shaders.getShaderIndex()
+  shaders.push(name)
+  local_shaders.setShaderIndex(shaders)
+
+  local_shaders.name = name
+  local_shaders.bindButton({ name: name, shader: shader })
+
+  $(".active").removeClass("active")
+  $(local_shaders.buttons[name]).addClass("active")
+  local_shaders.setLastAccessed(name)
+}
+
+local_shaders.remove = function(){
+  var name = local_shaders.name
+  if (! name || ! name.length) return
+
+  var shaders = local_shaders.getShaderIndex()
+  if (shaders.splice( shaders.indexOf(name), 1 )) {
+    local_shaders.setShaderIndex(shaders)
+    local_shaders.removeShader(name)
+    $(local_shaders.buttons[name]).remove()
+    local_shaders.name = ""
+  }
+}
diff --git a/js/api/set.js b/js/api/set.js
index 1e7e31f..3446134 100644
--- a/js/api/set.js
+++ b/js/api/set.js
@@ -1,39 +1,67 @@
+var shader_id_root = null;
 function save_shader(){
-    typeof shader_id_root == 'undefined' ? shader_id_root = "" : shader_id_root
-    var params = {
-      script : $("#shader").val(),
-      image_url : $("#url").val(),
-      username : user.username,
-      shader_id : shader_id_root 
-    }
-    console.log(params)
-    $.post("/cgi-bin/im/shader/save", params, function(resp){
-      console.log(resp);
-      data = JSON.parse(resp)
-      if (data.ERROR ){
-        alert(data.ERROR)
-        return false
-      }
-      if (! shader_id_root) {
-        shader_id_root = data.id;
-      }
+	shader_id_root = shader_id_root || ""
+	var params = {
+		script: $("#shader").val(),
+		image_url: $("#url").val(),
+		username: user.username,
+		name: $("#shader-name").val() || "",
+		shader_id: shader_id_root,
+		width: $("#width").int() || "",
+		height: $("#height").int() || ""
+	}
+	var thumb = make_thumbnail()
 
-      var blob = dataUriToBlob(cc.clone().resize(200,200).canvas.toDataURL("image/png"))
-      var form = new FormData();
-  
-      form.append("id", data.id);
-      form.append("qqfile", blob);
-      $.ajax({
-        url: "/cgi-bin/im/shader/thumbnail_upload",
-        type: "POST",
-        data: form,
-        processData: false,
-        contentType: false,
-      }).done(function(resp){
-        console.log(resp);
-      });
+	status('saving..')
+	console.log(params)
+	$.post("http://asdf.us/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;
+		}
+		
+		params.id = data.id;
+		params.thumbnail_url = "http://i.asdf.us/im/9a/chtiny3_1334529294_1334529329.gif";
+		
+		$shader = display_shader(params)
+		$("#shader-gallery").prepend($shader)
+		
+		save_thumbnail(data.id, thumb, $shader)
+	})
+}
+
+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();
 
-    })
-    //maintain the shader_id_root...
-    return shader_id_root; 
+	form.append("id", id);
+	form.append("qqfile", thumb);
+	$.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);
+		status('')
+		var data = JSON.parse(resp)
+		if (data.success) {
+			$shader.find("img").attr("src", data.url)
+		}
+	});
 }