var DOM={body:$("body"),canvas:$("canvas"),imageLoader:$("#image-loader")},_CAN=DOM.canvas;_CAN.width=_CAN.height=1E3;var _CON=_CAN.getContext("2d"),iL,filterManager,process=function(){},exec=!1,last,trackerTask,Controller,init,zones,track,tracker,initialized=!1,ControllerRememberer=new PermanentStorage; ControllerRememberer.fetch(function(f){log("Preset loaded.","[PermanentStorage]");Controller=new dat.GUI({load:JSON.parse(f),preset:"default"});init=function(){this.src="front/male/1.jpg";Controller.addFolder("Source Picture");Controller.remember(this);Controller.add(this,"src",this._images).listen();last=this.src;initialized=!0};zones;track={track:function(){zones=[];trackerTask=tracking.track(_CAN,tracker)}};tracker=new tracking.ObjectTracker(["face","eye","mouth"]);tracker.setStepSize(1.9);Controller.addFolder("Tracking.js"); Controller.add(track,"track");tracker.on("track",function(b){b.data.forEach(function(a){zones.push({x:a.x/_CAN.width,y:a.y/_CAN.height,w:a.width/_CAN.width,h:a.height/_CAN.height})});log("Recognition done","[Tracking.js]");process.bind(DOM.imageLoader)()});process=function(){if(initialized&&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);_CON.clearRect(0,0,_CAN.width,_CAN.height);filterManager.get("resolution").apply();filterManager.get("contrast").apply();filterManager.get("sobel").apply();filterManager.get("gaussian").apply();filterManager.get("canny").apply();for(var b in zones){var a=zones[b].x*_CAN.width,c=zones[b].y*_CAN.height,d=zones[b].w*_CAN.width,e=zones[b].h*_CAN.height;_CON.beginPath();_CON.moveTo(a,c);_CON.lineTo(a,c+e);_CON.lineTo(a+d,c+e);_CON.lineTo(a+d,c);_CON.lineTo(a,c);_CON.lineWidth=5;_CON.strokeStyle="#f00"; _CON.stroke()}console.timeEnd("PROCESS")}};filterManager=new ReactiveFilterManager(DOM.imageLoader,_CAN,process);filterManager.add("resolution",reactiveResolution);filterManager.add("contrast",reactiveContrast);filterManager.add("sobel",reactiveSobel);filterManager.add("gaussian",reactiveGaussianBlur);filterManager.add("canny",reactiveCanny);Controller.remember(filterManager.get("resolution"));Controller.remember(filterManager.get("contrast"));Controller.remember(filterManager.get("sobel"));Controller.remember(filterManager.get("canny")); Controller.remember(filterManager.get("gaussian"));Controller.addFolder("Image Resolution");Controller.add(filterManager.get("resolution"),"width",0,2).step(.1);Controller.add(filterManager.get("resolution"),"height",0,2).step(.1);Controller.addFolder("Basic Image Processing");Controller.add(filterManager.get("contrast"),"contrast",0,100);Controller.addFolder("Gaussian Blur");Controller.add(filterManager.get("gaussian"),"sigma",0,10).step(.5);Controller.add(filterManager.get("gaussian"),"radius", 1,11).step(1);Controller.addFolder("Convolution Filters");Controller.add(filterManager.get("sobel"),"sobelActive");Controller.add(filterManager.get("canny"),"canny_radius");Controller.__save_row.children[2].addEventListener("click",function(){Controller.save();try{var b=JSON.stringify(Controller.getSaveObject());ControllerRememberer.store(b,function(){log("dat.GUI preset stored.","[PermanentStorage]");return!0})}catch(a){log("Corrupted data.","[PermanentStorage]")}},!1);iL=new ImageLoader(DOM.imageLoader, init,process);return!0});