From a703503ee09092a98fbab31e763bc64081d0e7d5 Mon Sep 17 00:00:00 2001
From: jules <jules@okfoc.us>
Date: Mon, 20 Jan 2014 19:03:18 -0500
Subject: move js api into js

---
 js/api/get.js | 92 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 js/api/set.js | 39 +++++++++++++++++++++++++
 2 files changed, 131 insertions(+)
 create mode 100644 js/api/get.js
 create mode 100644 js/api/set.js

(limited to 'js/api')

diff --git a/js/api/get.js b/js/api/get.js
new file mode 100644
index 0000000..dd43130
--- /dev/null
+++ b/js/api/get.js
@@ -0,0 +1,92 @@
+;var ShaderAPI = {}
+ShaderAPI.limit = 24
+
+// info - fetch a single shader
+//   id: shader id
+ShaderAPI.info = function(id, cb){
+  ShaderAPI.fetch({
+    f: "info",
+    id: id
+  }, cb)
+}
+
+// all - fetch all shaders
+ShaderAPI.all = function(cb){
+  ShaderAPI.fetch({
+    f: "all"
+  }, cb)
+}
+
+// range - fetch a pageful of results
+//   limit: number of shaders to fetch
+//   offset: number of results to skip
+ShaderAPI.range = function(limit, offset, cb){
+  ShaderAPI.fetch({
+    f: "range",
+    limit: limit || ShaderAPI.limit,
+    last: offset
+  }, cb)
+}
+
+// latest - get the latest N shaders
+//   limit: number of shaders to fetch
+ShaderAPI.latest = function(limit, cb){
+  ShaderAPI.fetch({
+    f: "range",
+    limit: limit || ShaderAPI.limit
+  }, cb)
+}
+
+// page - get a page of N results
+//   page: page number, start counting at 1
+//   limit: number of shaders to fetch
+ShaderAPI.page = function(page, limit, cb){
+  ShaderAPI.fetch({
+    f: "range",
+    last: (page-1) * limit,
+    limit: limit || ShaderAPI.limit
+  }, cb)
+}
+
+// history - get all previous versions of a shader
+//   id: shader id
+ShaderAPI.history = function(id, cb){
+  ShaderAPI.fetch({
+    f: "history",
+    id: id
+  }, cb)
+}
+
+// username - get all ids by a user
+ShaderAPI.username = function(username, cb){
+  ShaderAPI.fetch({
+    f: "username",
+    username: username
+  }, cb)
+}
+
+// list_users - list all users
+ShaderAPI.list_users = function(list_users, cb){
+  ShaderAPI.fetch({
+    f: "list_users"
+  }, cb)
+}
+
+// originals - get the earliest version of all named shaders
+ShaderAPI.originals = function(cb){
+  ShaderAPI.fetch({
+    f: "originals"
+  }, cb)
+}
+
+// fetch - AJAX wrapper
+ShaderAPI.fetch = function(params, cb){
+  $.getJSON("/cgi-bin/im/shader/view", params, function(data){
+    if (data.SUCCESS) {
+      cb(null, data.data)
+    }
+    else if (data.ERROR) {
+      cb(data.ERROR, data.data)
+    }
+  })
+}
diff --git a/js/api/set.js b/js/api/set.js
new file mode 100644
index 0000000..1e7e31f
--- /dev/null
+++ b/js/api/set.js
@@ -0,0 +1,39 @@
+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;
+      }
+
+      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);
+      });
+
+    })
+    //maintain the shader_id_root...
+    return shader_id_root; 
+}
-- 
cgit v1.2.3-70-g09d2


From d947152a7c8553462091f25f8cff249c0cb43004 Mon Sep 17 00:00:00 2001
From: jules <jules@okfoc.us>
Date: Tue, 21 Jan 2014 00:40:33 -0500
Subject: shader api test

---
 js/api/get.js | 19 ++++++++++++-------
 1 file changed, 12 insertions(+), 7 deletions(-)

(limited to 'js/api')

diff --git a/js/api/get.js b/js/api/get.js
index dd43130..ec269b0 100644
--- a/js/api/get.js
+++ b/js/api/get.js
@@ -81,12 +81,17 @@ ShaderAPI.originals = function(cb){
 
 // fetch - AJAX wrapper
 ShaderAPI.fetch = function(params, cb){
-  $.getJSON("/cgi-bin/im/shader/view", params, function(data){
-    if (data.SUCCESS) {
-      cb(null, data.data)
-    }
-    else if (data.ERROR) {
-      cb(data.ERROR, data.data)
-    }
+  $.ajax({
+  	url: "http://asdf.us/cgi-bin/im/shader/view",
+  	data: params,
+  	dataType: "jsonp",
+  	success: function(data){
+			if (data.SUCCESS) {
+				cb(null, data.data)
+			}
+			else if (data.ERROR) {
+				cb(data.ERROR, data.data)
+			}
+		}
   })
 }
-- 
cgit v1.2.3-70-g09d2


From ced1db8df6c73f7bd0a4debd3f20b5570b99e7b4 Mon Sep 17 00:00:00 2001
From: jules <jules@okfoc.us>
Date: Tue, 21 Jan 2014 01:18:36 -0500
Subject: shader loader demo

---
 js/api/get.js   |   6 ++-
 js/render.js    |   5 +-
 shader-api.html | 155 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 3 files changed, 164 insertions(+), 2 deletions(-)
 create mode 100644 shader-api.html

(limited to 'js/api')

diff --git a/js/api/get.js b/js/api/get.js
index ec269b0..ae06dbd 100644
--- a/js/api/get.js
+++ b/js/api/get.js
@@ -31,6 +31,10 @@ ShaderAPI.range = function(limit, offset, cb){
 // latest - get the latest N shaders
 //   limit: number of shaders to fetch
 ShaderAPI.latest = function(limit, cb){
+	if (! cb) {
+		cb = limit
+		limit = ShaderAPI.limit
+	}
   ShaderAPI.fetch({
     f: "range",
     limit: limit || ShaderAPI.limit
@@ -66,7 +70,7 @@ ShaderAPI.username = function(username, cb){
 }
 
 // list_users - list all users
-ShaderAPI.list_users = function(list_users, cb){
+ShaderAPI.list_users = function(cb){
   ShaderAPI.fetch({
     f: "list_users"
   }, cb)
diff --git a/js/render.js b/js/render.js
index 9d3ab04..fdb0125 100644
--- a/js/render.js
+++ b/js/render.js
@@ -93,11 +93,14 @@ function animate(t){
   draw(t)
   // timing = +(new Date()) - timing
   fps = avg(fps, 1000/step_t, 4)
-  status(~~(fps) + " fps")
+  // status(~~(fps) + " fps")
 }
+
 function draw(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/shader-api.html b/shader-api.html
new file mode 100644
index 0000000..284d1a4
--- /dev/null
+++ b/shader-api.html
@@ -0,0 +1,155 @@
+<!doctype html>
+<html>
+<head>
+<style type="text/css">
+#url { width: 300px; }
+#width,#height,#frames,#delay {width: 30px; }
+#shader { width: 400px; height: 247px; font-family: fixed; }
+div { float: left; padding: 10px;}
+form { display: inline-block; }
+#shader-api,#gallery { clear: right; width:100%; padding: 0; }
+#shader-gallery,#gallery-images { display: block; max-height: 210px; overflow-y: auto; width: 100%; }
+#shader-gallery img,#shader-gallery canvas,#gallery-images img, #gallery-images canvas { max-width: 200px; height: 100px; margin: 5px; cursor: pointer; }
+.shader {
+	width: 100px;
+}
+#username { width: 40px; }
+a { color: #00f; }
+#shader-id { width: 40px; }
+</style>
+</head>
+<body>
+
+<!--
+<div id="gallery">
+  <div id="gallery-form">
+    <form id="gallery-search">
+      <input type="text" id="dumpfm-search-query" value="duck bill">
+      <button id="gallery-search">DUMP SEARCH</button>
+    </form>
+    <button id="gallery-random">IM RANDOM</button>
+    <span class="status"></span>
+  </div>
+  <div id="gallery-images"></div>
+</div>
+-->
+
+<div id="shader-api">
+	<input type="text" id="shader-id"><button id="fetch-info">info</button>
+	<button id="fetch-all">all</button>
+	<button id="fetch-originals">originals</button>
+	<button id="fetch-latest">latest</button>
+	<button id="fetch-next-page">next page</button>
+	<button id="fetch-history">history</button>
+	<select id="pick-user">
+		<option>fetching users..</option>
+	</select>
+	
+	<div id="shader-gallery">
+	</div>
+</div>
+
+<div id="controls">
+	<input type="text" id="url" value="img/1376516658960-dumpfm-DoritoWitch-TimeFLyTrans0001.png">
+  <br>
+  <br>
+
+  <textarea id="shader"></textarea>
+  <br>
+  <br>
+
+</div>
+
+<div id="workspace"></div>
+
+</body>
+<script type="text/javascript" src="js/vendor/jquery/jquery.min.js"></script>
+<script type="text/javascript" src="js/vendor/canvasquery.js"></script>
+<script type="text/javascript" src="js/vendor/gif.js"></script>
+<script type="text/javascript" src="js/util.js"></script>
+<script type="text/javascript" src="js/color.js"></script>
+<script type="text/javascript" src="js/image.js"></script>
+<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/get.js"></script>
+<script type="text/javascript" src="js/api/set.js"></script>
+<script type="text/html" id="shader-gallery-template">
+<img src="{thumbnail_url}">
+{username}
+</script>
+<script type="text/javascript">
+
+var cc = cq(0,0).appendTo("#workspace")
+var w, h
+
+$(init)
+
+function init(){
+  $("#url").change(load)
+//   run('#first')
+
+// 	$("#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")
+
+	function load_shaders(err, shaders){
+		var $el = $("#shader-gallery").empty()
+		var template = $("#shader-gallery-template").html()
+
+		for (var i in shaders) {
+			var $shader = $("<div>").addClass("shader")
+			$shader.data("shader", shaders[i])
+			var html = template
+			for (var field in shaders[i]) {
+				html = html.replace("{" + field + "}", shaders[i][field])
+			}
+			$shader.html(html)
+
+			$el.append( $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") )
+	})
+
+  load()
+
+  document.getElementById('shader').addEventListener('input', shader_build);
+  shader_build()
+
+  requestAnimationFrame(animate)
+}
+function run(shader_object){
+	console.log(shader_object)
+	$("#url").val( shader_object.image_url )
+	$("#shader").html(shader_object.script)
+
+	load()
+	shader_build()
+}
+
+</script>
+</html>
-- 
cgit v1.2.3-70-g09d2