From acca33cf36008d35d0b05b13523c849cda0eb775 Mon Sep 17 00:00:00 2001
From: Neil Gershenfeld <gersh@cba.mit.edu>
Date: Sat, 6 Jan 2018 17:05:02 -0500
Subject: [PATCH] starting compare worker

---
 modules/image/motion detect | 100 +++++++++++++++++++++---------------
 1 file changed, 60 insertions(+), 40 deletions(-)

diff --git a/modules/image/motion detect b/modules/image/motion detect
index ec10e1b..01baa5d 100755
--- a/modules/image/motion detect	
+++ b/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,47 +147,59 @@ function timeout() {
    outputs.trigger.event()
    setTimeout(timeout,parseFloat(mod.time.value)*1000)
    }
-function convert_image() {
-   //
-   // preview
-   //
-   var h = mod.img.height
-   var w = mod.img.width
-   if (w > h) {
-      var x0 = 0
-      var y0 = mod.canvas.height*.5*(1-h/w)
-      var wd = mod.canvas.width
-      var hd = mod.canvas.width*h/w
-      }
-   else {
-      var x0 = mod.canvas.width*.5*(1-w/h)
-      var y0 = 0
-      var wd = mod.canvas.height*w/h
-      var hd = mod.canvas.height
-      }
-   var ctx = mod.canvas.getContext("2d")
-   ctx.clearRect(0,0,mod.canvas.width,mod.canvas.height)
-   ctx.drawImage(mod.img,x0,y0,wd,hd)
+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)
+         var wd = mod.canvas.width
+         var hd = mod.canvas.width*h/w
+         }
+      else {
+         var x0 = mod.canvas.width*.5*(1-w/h)
+         var y0 = 0
+         var wd = mod.canvas.height*w/h
+         var hd = mod.canvas.height
+         }
+      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
+   // transfer?
    //
-   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')
+   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
 //
-- 
GitLab