collect shader gallery code

3 files changed, 89 insertions, 78 deletions

diff --git a/js/api/gallery.js b/js/api/gallery.js
new file mode 100644
index 0000000..92764c6
--- /dev/null
+++ b/js/api/gallery.js
@@ -0,0 +1,84 @@
+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(){
+	run_shader({
+		id: "",
+		shader_id: "",
+		image_url: $("#url").val(),
+		script: "",
+		name: ""
+	})
+}
+function run_shader(shader_object){
+	console.log(shader_object)
+	shader_id_root = shader_object.shader_id
+	if ($("#persist-image:checked").length) {
+		$("#url").val( shader_object.image_url )
+		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)
+	var html = shader_gallery_template
+	for (var field in shader_object) {
+		html = html.replace("{" + field + "}", shader_object[field])
+	}
+	$shader.html(html)
+	return $shader;
+}
diff --git a/js/api/set.js b/js/api/set.js
index 653c74f..92cc071 100644
--- a/js/api/set.js
+++ b/js/api/set.js
@@ -14,7 +14,7 @@ function save_shader(){
 	$.post("http://asdf.us/cgi-bin/im/shader/save", params, function(resp){
 		console.log(resp);
 		data = JSON.parse(resp)
-		if (data.ERROR ){
+		if (data.ERROR){
 			alert(data.ERROR)
 			return false
 		}
diff --git a/shader-api.html b/shader-api.html
index 89ce820..dc22d10 100644
--- a/shader-api.html
+++ b/shader-api.html
@@ -35,7 +35,7 @@ a { color: #00f; }
 -->
 
 <div id="shader-api">
-	<button id="new-shader"><b>new shader<b></button>
+	<button id="new-shader"><b>new shader</b></button>
 	<input type="text" id="shader-id" disabled><button id="fetch-info" disabled>info</button>
 	<button id="fetch-history" disabled>history</button>
 	|
@@ -84,6 +84,7 @@ a { color: #00f; }
 <script type="text/javascript" src="js/gallery.js"></script>
 <script type="text/javascript" src="js/render.js"></script>
 <script type="text/javascript" src="js/shader.js"></script>
+<script type="text/javascript" src="js/api/gallery.js"></script>
 <script type="text/javascript" src="js/api/get.js"></script>
 <script type="text/javascript" src="js/api/set.js"></script>
 <script type="text/html" id="shader-gallery-template">
@@ -104,90 +105,16 @@ function init(){
   $("#url").change(load)
   $("#reset").click(reset)
   $("#pause").click(pause)
-//   run('#first')
-
-	$("#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( $(this).data("shader") )
-	})
 
 	user.init()
+	shader_gallery.init()
 	
   document.getElementById('shader').addEventListener('input', shader_build);
 
   requestAnimationFrame(animate)
 }
-function new_shader(){
-	run({
-		id: "",
-		shader_id: "",
-		image_url: $("#url").val(),
-		script: "",
-		name: ""
-	})
-}
-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(shaders[0])
-	}
-}
-function display_shader(shader_object){
-	var $shader = $("<div>").addClass("shader")
-	$shader.data("shader", shader_object)
-	var html = shader_gallery_template
-	for (var field in shader_object) {
-		html = html.replace("{" + field + "}", shader_object[field])
-	}
-	$shader.html(html)
-	return $shader;
-}
-function run(shader_object){
-	console.log(shader_object)
-	shader_id_root = shader_object.shader_id
-	if ($("#persist-image:checked").length) {
-		$("#url").val( shader_object.image_url )
-		load()
-	}
-	$("#shader").val(shader_object.script)
-	$("#shader-id").val(shader_object.id)
-	$("#shader-name").val( shader_object.name || "")
-	shader_build()
-}
+
 
 </script>
 </html>