This commit is contained in:
xdrm-brackets 2016-11-16 04:54:48 -05:00
commit b29a91bb06
2 changed files with 78 additions and 17 deletions

View File

@ -99,7 +99,7 @@ ControllerRememberer.fetch(function(loaded_data){
---------------------------------------------------------*/
this.defaultWidth = this.width;
this.defaultHeight = this.height;
log('Image copied', '[Canvas]');
// log('Image copied', '[Canvas]');
// On change la valeur de `exec` pour qu'il n'entre plus dans ce `if`
exec = true;
@ -142,29 +142,89 @@ ControllerRememberer.fetch(function(loaded_data){
=========================================================*/
/* (1) On reporte chaque zone trackée sur le `<canvas>` */
var i, x, y, w, h;
for( i in reactiveFeatureTracking.zones ){
var i, il, x, y, w, h, a, c, cur, lst, ncollision;
c = 0;
for( i = 0, il = reactiveFeatureTracking.zones.length ; i < il ; i++ ){
// {2} Inclusion verification //
if( c <= 3 ){
ncollision = true;
for( a = 0 ; a < i ; a++ ){
lst = reactiveFeatureTracking.zones[a];
cur = reactiveFeatureTracking.zones[i];
ncollision = (lst.x >= cur.x+cur.w) // if no collision (@lst away from @cur)
|| (lst.y >= cur.y+cur.h)
|| (lst.x+lst.w <= cur.x)
|| (lst.y+lst.h <= cur.y);
if( !ncollision ) // if collision, we know
break;
// else, check other previous rects
}
}
(ncollision) && c++;
(c>3) && (ncollision=false);
// {3} Storing rects //
x = reactiveFeatureTracking.zones[i].x * _CAN.width;
y = reactiveFeatureTracking.zones[i].y * _CAN.height;
w = reactiveFeatureTracking.zones[i].w * _CAN.width;
h = reactiveFeatureTracking.zones[i].h * _CAN.height;
_CON.lineWidth = 5;
_CON.strokeStyle = '#f00';
_CON.strokeStyle = !ncollision ? 'rgba(0, 255, 0, .3)' : '#0f0';
_CON.strokeRect(x, y, w, h);
}
for( i in reactiveFaceTracking.zones ){
c = 0;
for( i = 0, il = reactiveFaceTracking.zones.length ; i < il ; i++ ){
// {2} Inclusion verification //
if( c <= 1 ){
ncollision = true;
for( a = 0 ; a < i ; a++ ){
lst = reactiveFaceTracking.zones[a];
cur = reactiveFaceTracking.zones[i];
ncollision = (lst.x >= cur.x+cur.w) // if no collision (@lst away from @cur)
|| (lst.y >= cur.y+cur.h)
|| (lst.x+lst.w <= cur.x)
|| (lst.y+lst.h <= cur.y);
if( !ncollision ) // if collision, we know
break;
// else, check other previous rects
}
}
// 3 rects maximum
(ncollision) && c++;
(c>1) && (ncollision=false);
// {3} Storing rects //
x = reactiveFaceTracking.zones[i].x * _CAN.width;
y = reactiveFaceTracking.zones[i].y * _CAN.height;
w = reactiveFaceTracking.zones[i].w * _CAN.width;
h = reactiveFaceTracking.zones[i].h * _CAN.height;
_CON.lineWidth = 5;
_CON.strokeStyle = '#ff0';
_CON.strokeStyle = !ncollision ? 'rgba(0, 0, 255, .3)' : '#00f';
_CON.strokeRect(x, y, w, h);
}
}

View File

@ -1,12 +1,13 @@
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,Controller,CFolder={},init,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(){last=this.src="front/male/1.jpg";initialized=!0;CFolder.src=Controller.addFolder("Source Picture");Controller.remember(this);CFolder.src.add(this,"src",this._images).listen()};LOADER.init();process=function(){if(initialized&&this instanceof HTMLImageElement){console.time("PROCESS");LOADER.start();this.src!=last&&(reactiveFaceTracking.zones=
[],reactiveFeatureTracking.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("grayscale").apply();filterManager.get("sobel").apply();filterManager.get("gaussian").apply();filterManager.get("canny").apply();var a,b,c,d,e;for(a in reactiveFeatureTracking.zones)b=reactiveFeatureTracking.zones[a].x*
_CAN.width,c=reactiveFeatureTracking.zones[a].y*_CAN.height,d=reactiveFeatureTracking.zones[a].w*_CAN.width,e=reactiveFeatureTracking.zones[a].h*_CAN.height,_CON.lineWidth=5,_CON.strokeStyle="#f00",_CON.strokeRect(b,c,d,e);for(a in reactiveFaceTracking.zones)b=reactiveFaceTracking.zones[a].x*_CAN.width,c=reactiveFaceTracking.zones[a].y*_CAN.height,d=reactiveFaceTracking.zones[a].w*_CAN.width,e=reactiveFaceTracking.zones[a].h*_CAN.height,_CON.lineWidth=5,_CON.strokeStyle="#ff0",_CON.strokeRect(b,c,
d,e);console.timeEnd("PROCESS");LOADER.stop()}};filterManager=new ReactiveFilterManager(DOM.imageLoader,_CAN,process);filterManager.add("feature_tracking",reactiveFeatureTracking);filterManager.add("face_tracking",reactiveFaceTracking);filterManager.add("resolution",reactiveResolution);filterManager.add("contrast",reactiveContrast);filterManager.add("grayscale",reactiveGrayscale);filterManager.add("sobel",reactiveSobel);filterManager.add("gaussian",reactiveGaussianBlur);filterManager.add("canny",
reactiveCanny);filterManager.add("haar_face",reactiveHaarFace);Controller.remember(filterManager.get("face_tracking"));Controller.remember(filterManager.get("feature_tracking"));Controller.remember(filterManager.get("resolution"));Controller.remember(filterManager.get("contrast"));Controller.remember(filterManager.get("grayscale"));Controller.remember(filterManager.get("sobel"));Controller.remember(filterManager.get("canny"));Controller.remember(filterManager.get("gaussian"));Controller.remember(filterManager.get("haar_face"));
CFolder.custom=Controller.addFolder("custom");CFolder.resolution=CFolder.custom.addFolder("Image Resolution");CFolder.resolution.add(filterManager.get("resolution"),"width",0,2).step(.1);CFolder.resolution.add(filterManager.get("resolution"),"height",0,2).step(.1);CFolder.basic=CFolder.custom.addFolder("Basic Image Processing");CFolder.basic.add(filterManager.get("contrast"),"contrast",0,100);CFolder.basic.add(filterManager.get("grayscale"),"grayscale");CFolder.tracking=Controller.addFolder("Tracking.js");
CFolder.face_tracking=CFolder.tracking.addFolder("Face tracking");CFolder.face_tracking.add(filterManager.get("face_tracking"),"apply");CFolder.face_tracking.add(filterManager.get("face_tracking"),"initial_scale",1,10).step(.5);CFolder.face_tracking.add(filterManager.get("face_tracking"),"step_size",-.1,5).step(.1);CFolder.face_tracking.add(filterManager.get("face_tracking"),"edges_density",.1,.5).step(.01);CFolder.feature_tracking=CFolder.tracking.addFolder("Feature tracking");CFolder.feature_tracking.add(filterManager.get("feature_tracking"),
"apply");CFolder.feature_tracking.add(filterManager.get("feature_tracking"),"initial_scale",1,10).step(.5);CFolder.feature_tracking.add(filterManager.get("feature_tracking"),"step_size",-.1,5).step(.1);CFolder.feature_tracking.add(filterManager.get("feature_tracking"),"edges_density",.1,.5).step(.01);CFolder.jsfeat=Controller.addFolder("jsfeat");CFolder.haar_face=CFolder.jsfeat.addFolder("Haar Face Detection");CFolder.haar_face.add(filterManager.get("haar_face"),"apply");CFolder.haar_face.add(filterManager.get("haar_face"),
"min_scale",1,4).step(.1);CFolder.haar_face.add(filterManager.get("haar_face"),"scale_factor",1.1,2).step(.025);CFolder.haar_face.add(filterManager.get("haar_face"),"equalize_histogram");CFolder.haar_face.add(filterManager.get("haar_face"),"use_canny");CFolder.haar_face.add(filterManager.get("haar_face"),"edges_density",.01,1).step(.005);CFolder.gaussian=CFolder.jsfeat.addFolder("Gaussian Blur");CFolder.gaussian.add(filterManager.get("gaussian"),"active");CFolder.gaussian.add(filterManager.get("gaussian"),
"sigma",0,10).step(.5);CFolder.gaussian.add(filterManager.get("gaussian"),"radius",1,11).step(1);CFolder.sobel=CFolder.jsfeat.addFolder("Sobel Filter");CFolder.sobel.add(filterManager.get("sobel"),"sobelActive");CFolder.canny=CFolder.jsfeat.addFolder("Canny Filter");CFolder.canny.add(filterManager.get("canny"),"active");CFolder.canny.add(filterManager.get("canny"),"radius",0,4).step(1);CFolder.canny.add(filterManager.get("canny"),"low_threshold",1,127).step(1);CFolder.canny.add(filterManager.get("canny"),
"high_threshold",1,127).step(1);CFolder.process=Controller.addFolder("Process");CFolder.process.add({render:process},"render");Controller.__save_row.children[2].addEventListener("click",function(){Controller.save();try{var a=JSON.stringify(Controller.getSaveObject());ControllerRememberer.store(a,function(){log("dat.GUI preset stored.","[PermanentStorage]");return!0})}catch(b){log("Corrupted data.","[PermanentStorage]")}},!1);iL=new ImageLoader(DOM.imageLoader,init,process);return!0});
ControllerRememberer.fetch(function(k){log("Preset loaded.","[PermanentStorage]");Controller=new dat.GUI({load:JSON.parse(k),preset:"default"});init=function(){last=this.src="front/male/1.jpg";initialized=!0;CFolder.src=Controller.addFolder("Source Picture");Controller.remember(this);CFolder.src.add(this,"src",this._images).listen()};LOADER.init();process=function(){if(initialized&&this instanceof HTMLImageElement){console.time("PROCESS");LOADER.start();this.src!=last&&(reactiveFaceTracking.zones=
[],reactiveFeatureTracking.zones=[],exec=!1,last=this.src);exec||(this.defaultWidth=this.width,this.defaultHeight=this.height,exec=!0);_CON.clearRect(0,0,_CAN.width,_CAN.height);filterManager.get("resolution").apply();filterManager.get("contrast").apply();filterManager.get("grayscale").apply();filterManager.get("sobel").apply();filterManager.get("gaussian").apply();filterManager.get("canny").apply();var b,f,d,c,g,h,e,a;b=e=0;for(f=reactiveFeatureTracking.zones.length;b<f;b++){if(3>=e)for(a=!0,d=0;d<
b&&(c=reactiveFeatureTracking.zones[d],a=reactiveFeatureTracking.zones[b],a=c.x>=a.x+a.w||c.y>=a.y+a.h||c.x+c.w<=a.x||c.y+c.h<=a.y,a);d++);a&&e++;3<e&&(a=!1);d=reactiveFeatureTracking.zones[b].x*_CAN.width;c=reactiveFeatureTracking.zones[b].y*_CAN.height;g=reactiveFeatureTracking.zones[b].w*_CAN.width;h=reactiveFeatureTracking.zones[b].h*_CAN.height;_CON.lineWidth=5;_CON.strokeStyle=a?"#0f0":"rgba(0, 255, 0, .3)";_CON.strokeRect(d,c,g,h)}b=e=0;for(f=reactiveFaceTracking.zones.length;b<f;b++){if(1>=
e)for(a=!0,d=0;d<b&&(c=reactiveFaceTracking.zones[d],a=reactiveFaceTracking.zones[b],a=c.x>=a.x+a.w||c.y>=a.y+a.h||c.x+c.w<=a.x||c.y+c.h<=a.y,a);d++);a&&e++;1<e&&(a=!1);d=reactiveFaceTracking.zones[b].x*_CAN.width;c=reactiveFaceTracking.zones[b].y*_CAN.height;g=reactiveFaceTracking.zones[b].w*_CAN.width;h=reactiveFaceTracking.zones[b].h*_CAN.height;_CON.lineWidth=5;_CON.strokeStyle=a?"#00f":"rgba(0, 0, 255, .3)";_CON.strokeRect(d,c,g,h)}console.timeEnd("PROCESS");LOADER.stop()}};filterManager=new ReactiveFilterManager(DOM.imageLoader,
_CAN,process);filterManager.add("feature_tracking",reactiveFeatureTracking);filterManager.add("face_tracking",reactiveFaceTracking);filterManager.add("resolution",reactiveResolution);filterManager.add("contrast",reactiveContrast);filterManager.add("grayscale",reactiveGrayscale);filterManager.add("sobel",reactiveSobel);filterManager.add("gaussian",reactiveGaussianBlur);filterManager.add("canny",reactiveCanny);filterManager.add("haar_face",reactiveHaarFace);Controller.remember(filterManager.get("face_tracking"));
Controller.remember(filterManager.get("feature_tracking"));Controller.remember(filterManager.get("resolution"));Controller.remember(filterManager.get("contrast"));Controller.remember(filterManager.get("grayscale"));Controller.remember(filterManager.get("sobel"));Controller.remember(filterManager.get("canny"));Controller.remember(filterManager.get("gaussian"));Controller.remember(filterManager.get("haar_face"));CFolder.custom=Controller.addFolder("custom");CFolder.resolution=CFolder.custom.addFolder("Image Resolution");
CFolder.resolution.add(filterManager.get("resolution"),"width",0,2).step(.1);CFolder.resolution.add(filterManager.get("resolution"),"height",0,2).step(.1);CFolder.basic=CFolder.custom.addFolder("Basic Image Processing");CFolder.basic.add(filterManager.get("contrast"),"contrast",0,100);CFolder.basic.add(filterManager.get("grayscale"),"grayscale");CFolder.tracking=Controller.addFolder("Tracking.js");CFolder.face_tracking=CFolder.tracking.addFolder("Face tracking");CFolder.face_tracking.add(filterManager.get("face_tracking"),
"apply");CFolder.face_tracking.add(filterManager.get("face_tracking"),"initial_scale",1,10).step(.5);CFolder.face_tracking.add(filterManager.get("face_tracking"),"step_size",-.1,5).step(.1);CFolder.face_tracking.add(filterManager.get("face_tracking"),"edges_density",.1,.5).step(.01);CFolder.feature_tracking=CFolder.tracking.addFolder("Feature tracking");CFolder.feature_tracking.add(filterManager.get("feature_tracking"),"apply");CFolder.feature_tracking.add(filterManager.get("feature_tracking"),"initial_scale",
1,10).step(.5);CFolder.feature_tracking.add(filterManager.get("feature_tracking"),"step_size",-.1,5).step(.1);CFolder.feature_tracking.add(filterManager.get("feature_tracking"),"edges_density",.1,.5).step(.01);CFolder.jsfeat=Controller.addFolder("jsfeat");CFolder.haar_face=CFolder.jsfeat.addFolder("Haar Face Detection");CFolder.haar_face.add(filterManager.get("haar_face"),"apply");CFolder.haar_face.add(filterManager.get("haar_face"),"min_scale",1,4).step(.1);CFolder.haar_face.add(filterManager.get("haar_face"),
"scale_factor",1.1,2).step(.025);CFolder.haar_face.add(filterManager.get("haar_face"),"equalize_histogram");CFolder.haar_face.add(filterManager.get("haar_face"),"use_canny");CFolder.haar_face.add(filterManager.get("haar_face"),"edges_density",.01,1).step(.005);CFolder.gaussian=CFolder.jsfeat.addFolder("Gaussian Blur");CFolder.gaussian.add(filterManager.get("gaussian"),"active");CFolder.gaussian.add(filterManager.get("gaussian"),"sigma",0,10).step(.5);CFolder.gaussian.add(filterManager.get("gaussian"),
"radius",1,11).step(1);CFolder.sobel=CFolder.jsfeat.addFolder("Sobel Filter");CFolder.sobel.add(filterManager.get("sobel"),"sobelActive");CFolder.canny=CFolder.jsfeat.addFolder("Canny Filter");CFolder.canny.add(filterManager.get("canny"),"active");CFolder.canny.add(filterManager.get("canny"),"radius",0,4).step(1);CFolder.canny.add(filterManager.get("canny"),"low_threshold",1,127).step(1);CFolder.canny.add(filterManager.get("canny"),"high_threshold",1,127).step(1);CFolder.process=Controller.addFolder("Process");
CFolder.process.add({render:process},"render");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(f){log("Corrupted data.","[PermanentStorage]")}},!1);iL=new ImageLoader(DOM.imageLoader,init,process);return!0});