starting compare worker

modules/image/motion detect

@@ -36,11 +36,14 @@ var inputs = {
    image:{type:'RGBA',
       event:function(evt){
          var ctx = mod.img.getContext("2d")
+         var lastctx = mod.lastimg.getContext("2d")
+         lastctx.canvas.width = ctx.canvas.width
+         lastctx.canvas.height = ctx.canvas.height
+         lastctx.drawImage(mod.img,0,0)
          ctx.canvas.width = evt.detail.width
          ctx.canvas.height = evt.detail.height 
          ctx.putImageData(evt.detail,0,0)
-         mod.pxtext.nodeValue = evt.detail.width+' x '+evt.detail.height+' px'
-         convert_image()
+         compare_images()
          }}}
 //
 // outputs
@@ -81,6 +84,11 @@ var interface = function(div){
    var canvas = document.createElement('canvas')
       mod.img = canvas
    //
+   // off-screen last image canvas
+   //
+   var canvas = document.createElement('canvas')
+      mod.lastimg = canvas
+   //
    // view button
    //
    var btn = document.createElement('button')
@@ -139,12 +147,21 @@ function timeout() {
    outputs.trigger.event()
    setTimeout(timeout,parseFloat(mod.time.value)*1000)
    }
-function convert_image() {
-   //
-   // preview
-   //
+function compare_images() {
+   mod.change.nodeValue = Date.now()
+   var blob = new Blob(['('+worker.toString()+'())'])
+   var url = window.URL.createObjectURL(blob)
+   var webworker = new Worker(url)
+   webworker.addEventListener('message',function(evt) {
+      window.URL.revokeObjectURL(url)
       var h = mod.img.height
       var w = mod.img.width
+      /*
+      var buf = new Uint8ClampedArray(evt.data.buffer)
+      var imgdata = new ImageData(buf,w,h)
+      var ctx = mod.img.getContext("2d")
+      ctx.putImageData(imgdata,0,0)
+      */
       if (w > h) {
          var x0 = 0
          var y0 = mod.canvas.height*.5*(1-h/w)
@@ -160,26 +177,29 @@ function convert_image() {
       var ctx = mod.canvas.getContext("2d")
       ctx.clearRect(0,0,mod.canvas.width,mod.canvas.height)
       ctx.drawImage(mod.img,x0,y0,wd,hd)
+      webworker.terminate()
+      })
+   var ctx = mod.img.getContext("2d")
+   var img = ctx.getImageData(0,0,mod.img.width,mod.img.height)
+   var ctx = mod.lastimg.getContext("2d")
+   var lastimg = ctx.getImageData(0,0,mod.img.width,mod.img.height)
+   var t = parseFloat(mod.threshold.value)
    //
-   // convert and save
-   //
-   mod.img.toBlob(function(blob){
-      var url = URL.createObjectURL(blob)
-      var link = document.createElement('a')
-      link.download = mod.nametext.value
-      link.href = url
-      document.body.appendChild(link)
-      link.click()
-      document.body.removeChild(link)
-      URL.revokeObjectURL(url)
-      },'image/png')
+   // transfer?
+   //
+   webworker.postMessage({
+      height:mod.img.height,width:mod.img.width,threshold:t,
+      buffer:img.data.buffer,lastbuffer:lastimg.data.buffer})
    }
-function update_info() {
-   mod.dpi = parseFloat(mod.dpitext.value)
-   mod.mmtext.nodeValue = (25.4*mod.img.width/mod.dpi).toFixed(3)
-      +' x '+(25.4*mod.img.height/mod.dpi).toFixed(3)+' mm'
-   mod.intext.nodeValue = (mod.img.width/mod.dpi).toFixed(3)
-      +' x '+(mod.img.height/mod.dpi).toFixed(3)+' in'
+function worker() {
+   self.addEventListener('message',function(evt) {
+      var h = evt.data.height
+      var w = evt.data.width
+      var t = evt.data.threshold
+      var buf = new Uint8ClampedArray(evt.data.buffer)
+      var lastbuf = new Uint8ClampedArray(evt.data.lastbuffer)
+      self.postMessage({buffer:buf.buffer})
+      })
    }
 // return values
 //