2016-10-07 15:48:53 +00:00
|
|
|
var DOM={body:$("body"),canvas:$("canvas"),imageLoader:$("#image-loader")},Controller=new dat.GUI,_CAN=DOM.canvas;_CAN.width=_CAN.height=1E3;
|
|
|
|
|
var _CON=_CAN.getContext("2d"),iL,filterManager,process,exec=!1,last,trackerTask,init=function(){this.src="front:male:1.jpg";Controller.addFolder("image source");Controller.add(this,"src",this._images).listen();last=this.src},zones,track=new function(){this._update=!1;this.__defineGetter__("update",function(){return this._update});this.__defineSetter__("update",function(a){this._update=a;process.bind(DOM.imageLoader)()})},tracker=new tracking.ObjectTracker(["face","eye","mouth"]);tracker.setStepSize(1.5);
|
|
|
|
|
Controller.addFolder("Tracking.js");Controller.add(track,"update");
|
|
|
|
|
process=function(){if(this instanceof HTMLImageElement){console.time("PROCESS");this.src!=last&&(zones=[],exec=!1,last=this.src);exec||(this.defaultWidth=this.width,this.defaultHeight=this.height,log("Image copied","[Canvas]"),exec=!0);0===zones.length&&track.update&&(zones=[],trakerTask=tracking.track(DOM.imageLoader,tracker),tracker.on("track",function(a){a.data.forEach(function(a){zones.push({x:a.x/DOM.imageLoader.width,y:a.y/DOM.imageLoader.height,w:a.width/DOM.imageLoader.width,h:a.height/DOM.imageLoader.height})});
|
|
|
|
|
log("Recognition done","[Tracking.js]");process.bind(DOM.imageLoader)()}));!track.update&&(zones=[]);_CON.clearRect(0,0,_CAN.width,_CAN.height);filterManager.get("ratio").apply();filterManager.get("contrast").apply();filterManager.get("sobel").apply();for(var a in zones){var b=zones[a].x*this.width,c=zones[a].y*this.height,d=zones[a].w*this.width,e=zones[a].h*this.height;_CON.beginPath();_CON.moveTo(b,c);_CON.lineTo(b,c+e);_CON.lineTo(b+d,c+e);_CON.lineTo(b+d,c);_CON.lineTo(b,c);_CON.lineWidth=5;
|
|
|
|
|
_CON.stroke()}console.timeEnd("PROCESS")}};filterManager=new ReactiveFilterManager(DOM.imageLoader,_CAN,process);filterManager.add("ratio",reactiveRatio);filterManager.add("contrast",reactiveContrast);filterManager.add("sobel",reactiveSobel);Controller.addFolder("Image Ratio");Controller.add(filterManager.get("ratio"),"width",0,2).listen();Controller.add(filterManager.get("ratio"),"height",0,2).listen();Controller.addFolder("Image Processing");
|
|
|
|
|
Controller.add(filterManager.get("contrast"),"contrast",0,100).listen();Controller.add(filterManager.get("sobel"),"sobelActive").listen();iL=new ImageLoader(DOM.imageLoader,init,process);
|
