add tim's optimizations

2 files changed, 46 insertions, 23 deletions

diff --git a/js/asdf.js b/js/asdf.js
index 2b929ac..53222e8 100644
--- a/js/asdf.js
+++ b/js/asdf.js
@@ -51,7 +51,7 @@ dumpfm.search = function (e){
     })
   }
 };
-  
+
 dumpfm.fetch = function(opt){
   if (dumpfm.fetching) return;
   dumpfm.fetching = true;
diff --git a/shader-picker.html b/shader-picker.html
index 65a7f5f..42d2ca8 100644
--- a/shader-picker.html
+++ b/shader-picker.html
@@ -165,6 +165,9 @@ function init(){
   gallery.init()
   console.log("gallery init")
 
+  document.getElementById('shader').addEventListener('input', shader_build);
+  shader_build()
+
   requestAnimationFrame(animate)
 }
 function choose (){
@@ -246,57 +249,77 @@ function giveFrame(t){
     return cq(w, h)
   }
 }
+
 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)
   }
-  w = cc.canvas.width = frame.ctx.canvas.width
-  h = cc.canvas.height = frame.ctx.canvas.height
 }
 
-function shade(frame, t){
-  if (! t || isNaN(t)) throw Error ("No time specified")
-  if (! frame) throw Error ("No frame specified")
+var shader = function(){}
+
+var shader_build = function(){
+  var fn_str = document.getElementById('shader').value
+  if (!fn_str.length) return
   try {
-    var f = $("#shader").val()
-    if (!f.length) return;
-    var shader = new Function('x','y','t','d', f)
-  }
-  catch (e) {
+    var fn = new Function('x','y','t','d', fn_str)
+    shader = fn
+  } catch (e) {
     throw Error ("Shader compilation error")
   }
+}
+
+var r,g,b,a;
+
+function shade(frame, t){
+  if (! t || isNaN(t)) throw Error ("No time specified")
+  if (! frame) throw Error ("No frame specified")
 
-  var imageData = frame.ctx.getImageData(0,0,w,h)
-  var data = imageData.data
+  var imgData = frame.ctx.getImageData(0,0,w,h)
+  var data = imgData.data
+  var clone = frame.cloneData.data
 
-  var cloneData = frame.ctx.getImageData(0,0,w,h)
-  var clone = cloneData.data
+  var u32 = new Uint32Array(imgData.data.buffer);
 
   try {
-    var realw = w, realh = h
+    var realw = w, realh = h, v, index
+
     for (var x = 0; x < w; x++) {
       for (var y = 0; y < h; y++) {
-        q = 4*(y*w+x)
-        r = data[q], g = data[q+1], b = data[q+2], a = data[q+3]
+        index = (y*w+x)
+        a = u32[index] >> 24 & 0xff
+        b = u32[index] >> 16 & 0xff
+        g = u32[index] >> 8  & 0xff;
+        r = u32[index] & 0xff  
         result = shader(x,y,t,clone)
-        data[q] = r
-        data[q+1] = g
-        data[q+2] = b
-        data[q+3] = a
+        u32[index] =
+            (a << 24) |
+            (b << 16) |
+            (g <<  8) |
+             r;
         w = realw, h = realh
       }
     }
   }
   catch(e){
+    // console.log(e.stack)
     throw Error ("Shader execution error")
   }
-  cc.putImageData(imageData,0,0)
+  cc.putImageData(imgData,0,0)
 }
 
 function add_frame(){