Ajout de [HaarFace] + fixme à terminer

This commit is contained in:
xdrm-brackets 2016-11-04 11:25:07 +01:00
parent 910678f8b1
commit dd430d4686
6 changed files with 153 additions and 38 deletions

View File

@ -1,2 +1,2 @@
RewriteEngine on #RewriteEngine on
RewriteRule ^(.*)$ public_html/$1 [QSA,L] #RewriteRule ^(.*)$ public_html/$1 [QSA,L]

View File

@ -23,20 +23,20 @@
<meta name='desctiption' content="Face recognition and face components tracking system"> <meta name='desctiption' content="Face recognition and face components tracking system">
<!-- Dépendences CSS --> <!-- Dépendences CSS -->
<link type='text/css' rel='stylesheet' href='/css/min/reset.css' /> <!-- Reset du css natif des browsers --> <link type='text/css' rel='stylesheet' href='./css/min/reset.css' /> <!-- Reset du css natif des browsers -->
<link type='text/css' rel='stylesheet' href='/css/min/layout.css' /> <!-- Positionnement global des pages --> <link type='text/css' rel='stylesheet' href='./css/min/layout.css' /> <!-- Positionnement global des pages -->
<!-- Dépendences Javascript --> <!-- Dépendences Javascript -->
<script type='text/javascript' src='/js/lib/reset.js' ></script> <!-- Corrections Javascript natif (ajouts) --> <script type='text/javascript' src='./js/lib/reset.js' ></script> <!-- Corrections Javascript natif (ajouts) -->
<script type='text/javascript' src='/js/lib/ajax.js' ></script> <!-- Gestion des requetes ajax --> <script type='text/javascript' src='./js/lib/ajax.js' ></script> <!-- Gestion des requetes ajax -->
<script type='text/javascript' src='/js/lib/local.js' ></script> <!-- Lib locale --> <script type='text/javascript' src='./js/lib/local.js' ></script> <!-- Lib locale -->
<script type='text/javascript' src='/js/lib/image-loader.js' ></script> <!-- Gestion du chargement d'image --> <script type='text/javascript' src='./js/lib/image-loader.js' ></script> <!-- Gestion du chargement d'image -->
<script type='text/javascript' src='/js/lib/reactive-filter.js' ></script> <!-- Gestion du des filtres dynamiques --> <script type='text/javascript' src='./js/lib/reactive-filter.js' ></script> <!-- Gestion du des filtres dynamiques -->
<script type='text/javascript' src='/js/lib/permanent-storage.js' ></script> <!-- Gestion du storage permanent (php) --> <script type='text/javascript' src='./js/lib/permanent-storage.js' ></script> <!-- Gestion du storage permanent (php) -->
<!-- dat.GUI --> <!-- dat.GUI -->
<script type='text/javascript' src='/js/lib/min/dat.gui.js' ></script> <!-- Lib externe --> <script type='text/javascript' src='./js/lib/min/dat.gui.js' ></script> <!-- Lib externe -->
<!-- JsFeat --> <!-- JsFeat -->
<script src="./js/lib/jsfeat/build/jsfeat-min.js" ></script> <script src="./js/lib/jsfeat/build/jsfeat-min.js" ></script>
@ -46,10 +46,10 @@
<script src="./js/lib/jsfeat/cascades/mouth.js" ></script> <script src="./js/lib/jsfeat/cascades/mouth.js" ></script>
<!-- Tracking.js --> <!-- Tracking.js -->
<script type='text/javascript' src='/js/tracking.js/build/tracking-min.js' ></script> <!-- Global Lib --> <script type='text/javascript' src='./js/tracking.js/build/tracking-min.js' ></script> <!-- Global Lib -->
<script type='text/javascript' src='/js/tracking.js/build/data/face-min.js' ></script> <!-- Face lib --> <script type='text/javascript' src='./js/tracking.js/build/data/face-min.js' ></script> <!-- Face lib -->
<script type='text/javascript' src='/js/tracking.js/build/data/eye-min.js' ></script> <!-- Eye Lib --> <script type='text/javascript' src='./js/tracking.js/build/data/eye-min.js' ></script> <!-- Eye Lib -->
<script type='text/javascript' src='/js/tracking.js/build/data/mouth-min.js' ></script> <!-- Mouth Lib --> <script type='text/javascript' src='./js/tracking.js/build/data/mouth-min.js' ></script> <!-- Mouth Lib -->
</head> </head>
<body> <body>
@ -61,7 +61,7 @@
<div id='log'></div> <div id='log'></div>
<!-- Dépendences Javascript après chargement des éléments --> <!-- Dépendences Javascript après chargement des éléments -->
<script type='text/javascript' src='/js/action-script.js'></script> <script type='text/javascript' src='./js/action-script.js'></script>
</body> </body>
</html> </html>

View File

@ -193,6 +193,9 @@ ControllerRememberer.fetch(function(loaded_data){
/* (5) Canny Filter */ /* (5) Canny Filter */
filterManager.get('canny').apply(); filterManager.get('canny').apply();
/* (6) Haar Face Detection */
filterManager.get('haar_face').apply();
} }
@ -227,7 +230,6 @@ ControllerRememberer.fetch(function(loaded_data){
} }
{ /* [5] Filtrage post-processing { /* [5] Filtrage post-processing
=========================================================*/ =========================================================*/
@ -250,6 +252,7 @@ ControllerRememberer.fetch(function(loaded_data){
filterManager.add('sobel', reactiveSobel); filterManager.add('sobel', reactiveSobel);
filterManager.add('gaussian', reactiveGaussianBlur); filterManager.add('gaussian', reactiveGaussianBlur);
filterManager.add('canny', reactiveCanny); filterManager.add('canny', reactiveCanny);
filterManager.add('haar_face', reactiveHaarFace);
/* (3) Gestion des backups */ /* (3) Gestion des backups */
Controller.remember(filterManager.get('resolution')); Controller.remember(filterManager.get('resolution'));
@ -258,11 +261,19 @@ ControllerRememberer.fetch(function(loaded_data){
Controller.remember(filterManager.get('sobel')); Controller.remember(filterManager.get('sobel'));
Controller.remember(filterManager.get('canny')); Controller.remember(filterManager.get('canny'));
Controller.remember(filterManager.get('gaussian')); Controller.remember(filterManager.get('gaussian'));
Controller.remember(filterManager.get('haar_face'));
/* (4) On attache tout à dat.GUI */ /* (4) On attache tout à dat.GUI */
Controller.addFolder('Tracking.js'); Controller.addFolder('Tracking.js');
Controller.add(track, 'trackFace'); Controller.add(track, 'trackFace');
Controller.add(track, 'trackFeatures'); Controller.add(track, 'trackFeatures');
Controller.addFolder('Haar Face Detection');
Controller.add(filterManager.get('haar_face'), 'active');
Controller.add(filterManager.get('haar_face'), 'min_scale', 1, 4).step(0.1);
Controller.add(filterManager.get('haar_face'), 'scale_factor', 1.1, 2).step(0.025);
Controller.add(filterManager.get('haar_face'), 'equalize_histogram');
Controller.add(filterManager.get('haar_face'), 'use_canny');
Controller.add(filterManager.get('haar_face'), 'edges_density', 0.01, 1.0).step(0.005);
Controller.addFolder('Image Resolution'); Controller.addFolder('Image Resolution');
Controller.add(filterManager.get('resolution'), 'width', 0, 2).step(0.1); Controller.add(filterManager.get('resolution'), 'width', 0, 2).step(0.1);
Controller.add(filterManager.get('resolution'), 'height', 0, 2).step(0.1); Controller.add(filterManager.get('resolution'), 'height', 0, 2).step(0.1);

View File

@ -1,16 +1,20 @@
var ReactiveFilter=function(a){this._manager={_process:function(){}};this._attr=a instanceof Object?a:{};for(var e in this._attr)this.__defineGetter__(e,function(a){return this._attr[a]}.bind(this,e)),this.__defineSetter__(e,function(a,b){return function(c){a._attr[b]=c;a._manager.process()}}(this,e));this.apply=function(){}},ReactiveFilterManager=function(a,e,d){this._target=a instanceof HTMLImageElement?a:null;if(!this._target)throw Error("Param 1 expected to be an HTMLImageElement (<img>), but "+ var ReactiveFilter=function(a){this._manager={_process:function(){}};this._attr=a instanceof Object?a:{};for(var d in this._attr)this.__defineGetter__(d,function(a){return this._attr[a]}.bind(this,d)),this.__defineSetter__(d,function(a,b){return function(c){a._attr[b]=c;a._manager.process()}}(this,d));this.apply=function(){}},ReactiveFilterManager=function(a,d,e){this._target=a instanceof HTMLImageElement?a:null;if(!this._target)throw Error("Param 1 expected to be an HTMLImageElement (<img>), but "+
a.constructor.name+" received");this._canvas=e instanceof HTMLCanvasElement?e:null;if(!this._canvas)throw Error("Param 2 expected to be an HTMLCanvasElement (<canvas>), but "+e.constructor.name+" received");this._context=this._canvas.getContext("2d");this._process=d instanceof Function?d:null;if(!this._process)throw Error("Param 3 expected to be a Function, but "+d.constructor.name+" received");this._filter={}}; a.constructor.name+" received");this._canvas=d instanceof HTMLCanvasElement?d:null;if(!this._canvas)throw Error("Param 2 expected to be an HTMLCanvasElement (<canvas>), but "+d.constructor.name+" received");this._context=this._canvas.getContext("2d");this._process=e instanceof Function?e:null;if(!this._process)throw Error("Param 3 expected to be a Function, but "+e.constructor.name+" received");this._filter={}};
ReactiveFilterManager.prototype.add=function(a,e){a="string"===typeof a?a:null;if(!a)throw Error("Param 1 expected to be a `string`, but "+a.constructor.name+" received");e=e instanceof ReactiveFilter?e:null;if(!e)throw Error("Param 2 expected to be a `ReactiveFilter`, but "+e.constructor.name+" received");if(null!=this._filter[a])return!0;this._filter[a]=e;e._manager=this}; ReactiveFilterManager.prototype.add=function(a,d){a="string"===typeof a?a:null;if(!a)throw Error("Param 1 expected to be a `string`, but "+a.constructor.name+" received");d=d instanceof ReactiveFilter?d:null;if(!d)throw Error("Param 2 expected to be a `ReactiveFilter`, but "+d.constructor.name+" received");if(null!=this._filter[a])return!0;this._filter[a]=d;d._manager=this};
ReactiveFilterManager.prototype.get=function(a){a="string"===typeof a?a:null;if(!a)throw Error("Param 1 expected to be a `string`, but "+a.constructor.name+" received");return null!=this._filter[a]?this._filter[a]:!1};ReactiveFilterManager.prototype.process=function(){this._process.bind(this._target)()}; ReactiveFilterManager.prototype.get=function(a){a="string"===typeof a?a:null;if(!a)throw Error("Param 1 expected to be a `string`, but "+a.constructor.name+" received");return null!=this._filter[a]?this._filter[a]:!1};ReactiveFilterManager.prototype.process=function(){this._process.bind(this._target)()};
ConvolutionFilter=function(a,e,d,b){var c,f,g,h,q=parseInt(b.length/2),p=parseInt(b[0].length/2),l=d.slice(0),k,n,m,r,t,u;for(n=q;n<e;n++)for(k=p;k<a;k++){h=g=f=c=0;for(r=-q;r<=q;r++)for(m=-p;m<=p;m++)t=b[q+r][p+m],u=4*((n+r)*a+(k+m)),c+=l[u+0]*t,f+=l[u+1]*t,g+=l[u+2]*t,h+=l[u+3]*t;m=4*(n*a+k);d[m+0]=c;d[m+1]=f;d[m+2]=g;d[m+3]=h}}; ConvolutionFilter=function(a,d,e,b){var c,f,g,k,r=parseInt(b.length/2),q=parseInt(b[0].length/2),m=e.slice(0),l,p,n,t,u,v;for(p=r;p<d;p++)for(l=q;l<a;l++){k=g=f=c=0;for(t=-r;t<=r;t++)for(n=-q;n<=q;n++)u=b[r+t][q+n],v=4*((p+t)*a+(l+n)),c+=m[v+0]*u,f+=m[v+1]*u,g+=m[v+2]*u,k+=m[v+3]*u;n=4*(p*a+l);e[n+0]=c;e[n+1]=f;e[n+2]=g;e[n+3]=k}};
SobelFilter=function(a,e,d){var b=[[-1,0,1],[-2,0,2],[-1,0,1]],c=[[1,2,1],[0,0,0],[-1,-2,-1]],f=parseInt(b.length/2),g=parseInt(b[0].length/2),h=d.slice(0),q,p,l,k,n,m;for(p=f;p<e;p++)for(q=g;q<a;q++){n=0;for(k=-f;k<=f;k++)for(l=-g;l<=g;l++)m=4*((p+k)*a+(q+l)),n+=h[m+0]*(b[f+k][g+l]+c[f+k][g+l])/2;l=p*a+q;n=Math.abs(n);d[l]=(n<<32)+(n<<16)+(n<<8)|4278190080}};var reactiveResolution=new ReactiveFilter({width:1,height:1}); SobelFilter=function(a,d,e){var b=[[-1,0,1],[-2,0,2],[-1,0,1]],c=[[1,2,1],[0,0,0],[-1,-2,-1]],f=parseInt(b.length/2),g=parseInt(b[0].length/2),k=e.slice(0),r,q,m,l,p,n;for(q=f;q<d;q++)for(r=g;r<a;r++){p=0;for(l=-f;l<=f;l++)for(m=-g;m<=g;m++)n=4*((q+l)*a+(r+m)),p+=k[n+0]*(b[f+l][g+m]+c[f+l][g+m])/2;m=q*a+r;p=Math.abs(p);e[m]=(p<<32)+(p<<16)+(p<<8)|4278190080}};var reactiveResolution=new ReactiveFilter({width:1,height:1});
reactiveResolution.apply=function(){if(this._manager instanceof ReactiveFilterManager){var a=this._manager._target,e=this._manager._canvas,d=this._manager._context;e.width=a.width*this.width;e.height=a.height*this.height;d.drawImage(a,0,0,e.width,e.height)}};var reactiveContrast=new ReactiveFilter({contrast:0}); reactiveResolution.apply=function(){if(this._manager instanceof ReactiveFilterManager){var a=this._manager._target,d=this._manager._canvas,e=this._manager._context;d.width=a.width*this.width;d.height=a.height*this.height;e.drawImage(a,0,0,d.width,d.height)}};var reactiveContrast=new ReactiveFilter({contrast:0});
reactiveContrast.apply=function(){if(this._manager instanceof ReactiveFilterManager){for(var a=this._manager._canvas,e=this._manager._context,a=e.getImageData(0,0,a.width,a.height),d=a.data,b=this.contrast;1<b;)b/=100;for(var b=127*(1-b),c=0,f=d.length;c<f;c++)0!=c%3&&(d[c]>=127+b&&(d[c]=255),d[c]<=127-b&&(d[c]=0));e.putImageData(a,0,0)}};var reactiveGrayscale=new ReactiveFilter({grayscale:!1}); reactiveContrast.apply=function(){if(this._manager instanceof ReactiveFilterManager){for(var a=this._manager._canvas,d=this._manager._context,a=d.getImageData(0,0,a.width,a.height),e=a.data,b=this.contrast;1<b;)b/=100;for(var b=127*(1-b),c=0,f=e.length;c<f;c++)0!=c%3&&(e[c]>=127+b&&(e[c]=255),e[c]<=127-b&&(e[c]=0));d.putImageData(a,0,0)}};var reactiveGrayscale=new ReactiveFilter({grayscale:!1});
reactiveGrayscale.apply=function(){if(this._manager instanceof ReactiveFilterManager&&this.grayscale){for(var a=this._manager._canvas,e=this._manager._context,a=e.getImageData(0,0,a.width,a.height),d=a.data,b=this.contrast;1<b;)b/=100;for(var c=0,f=d.length;c<f;c++)0<c%4||(b=Math.round(.298*d[c]+.586*d[c+1]+.114*d[c+2]),d[c]=d[c+1]=d[c+2]=b);e.putImageData(a,0,0)}};var reactiveSobel=new ReactiveFilter({sobelActive:!1}); reactiveGrayscale.apply=function(){if(this._manager instanceof ReactiveFilterManager&&this.grayscale){for(var a=this._manager._canvas,d=this._manager._context,a=d.getImageData(0,0,a.width,a.height),e=a.data,b=this.contrast;1<b;)b/=100;for(var c=0,f=e.length;c<f;c++)0<c%4||(b=Math.round(.298*e[c]+.586*e[c+1]+.114*e[c+2]),e[c]=e[c+1]=e[c+2]=b);d.putImageData(a,0,0)}};var reactiveSobel=new ReactiveFilter({sobelActive:!1});
reactiveSobel.apply=function(){if(this._manager instanceof ReactiveFilterManager&&this.sobelActive){var a=this._manager._canvas,e=this._manager._context,d=e.getImageData(0,0,a.width,a.height),b=new jsfeat.matrix_t(a.width,a.height,jsfeat.U8C1_t),c=new jsfeat.matrix_t(a.width,a.height,jsfeat.S32C2_t),f=new jsfeat.matrix_t(a.width,a.height,jsfeat.S32C1_t),g,h,q,p,l,k,n,m,r;jsfeat.imgproc.grayscale(d.data,a.width,a.height,b);jsfeat.imgproc.gaussian_blur(b,b,3);jsfeat.imgproc.sobel_derivatives(b,c);a= reactiveSobel.apply=function(){if(this._manager instanceof ReactiveFilterManager&&this.sobelActive){var a=this._manager._canvas,d=this._manager._context,e=d.getImageData(0,0,a.width,a.height),b=new jsfeat.matrix_t(a.width,a.height,jsfeat.U8C1_t),c=new jsfeat.matrix_t(a.width,a.height,jsfeat.S32C2_t),f=new jsfeat.matrix_t(a.width,a.height,jsfeat.S32C1_t),g,k,r,q,m,l,p,n,t;jsfeat.imgproc.grayscale(e.data,a.width,a.height,b);jsfeat.imgproc.gaussian_blur(b,b,3);jsfeat.imgproc.sobel_derivatives(b,c);a=
b.cols*b.rows;p=l=agx=agy=0;c=c.data;k=f.data;for(n=b.data;0<=--a;)g=c[a<<1],h=c[(a<<1)+1],k[a]=g*g+h*h;for(q=1;q<b.rows-1;++q)for(a=q*b.cols+1|0,f=1;f<b.cols-1;++f,++a)g=c[a<<1],h=c[(a<<1)+1],agx=(g^g>>31)-(g>>31)|0,agy=(h^h>>31)-(h>>31)|0,0<g&&(p=1)||(p=-1),0<h&&(l=b.cols)||(l=-b.cols),agx>agy?(m=k[a+p],r=k[a+p+-l],g=k[a-p],h=k[a-p+l],m=(agx-agy)*m+agy*r,g=(agx-agy)*g+agy*h,h=k[a]*agx,n[a]=h>=m&&h>g?agx&255:0):(m=k[a+-l],r=k[a+p+-l],g=k[a+l],h=k[a-p+l],m=(agy-agx)*m+agx*r,g=(agy-agx)*g+agx*h,h= b.cols*b.rows;q=m=agx=agy=0;c=c.data;l=f.data;for(p=b.data;0<=--a;)g=c[a<<1],k=c[(a<<1)+1],l[a]=g*g+k*k;for(r=1;r<b.rows-1;++r)for(a=r*b.cols+1|0,f=1;f<b.cols-1;++f,++a)g=c[a<<1],k=c[(a<<1)+1],agx=(g^g>>31)-(g>>31)|0,agy=(k^k>>31)-(k>>31)|0,0<g&&(q=1)||(q=-1),0<k&&(m=b.cols)||(m=-b.cols),agx>agy?(n=l[a+q],t=l[a+q+-m],g=l[a-q],k=l[a-q+m],n=(agx-agy)*n+agy*t,g=(agx-agy)*g+agy*k,k=l[a]*agx,p[a]=k>=n&&k>g?agx&255:0):(n=l[a+-m],t=l[a+q+-m],g=l[a+m],k=l[a-q+m],n=(agy-agx)*n+agx*t,g=(agy-agx)*g+agx*k,k=
k[a]*agy,n[a]=h>=m&&h>g?agy&255:0);data_u32=new Uint32Array(d.data.buffer);for(a=b.cols*b.rows;0<=--a;)data_u32[a]=-16777216|n[a]<<16|n[a]<<8|n[a];e.putImageData(d,0,0)}};var reactiveGaussianBlur=new ReactiveFilter({active:!1,sigma:0,radius:3}); l[a]*agy,p[a]=k>=n&&k>g?agy&255:0);data_u32=new Uint32Array(e.data.buffer);for(a=b.cols*b.rows;0<=--a;)data_u32[a]=-16777216|p[a]<<16|p[a]<<8|p[a];d.putImageData(e,0,0)}};var reactiveGaussianBlur=new ReactiveFilter({active:!1,sigma:0,radius:3});
reactiveGaussianBlur.apply=function(){if(this._manager instanceof ReactiveFilterManager&&this.active){var a=this._manager._canvas,e=this._manager._context,d=e.getImageData(0,0,a.width,a.height);new Uint32Array(d.buffer);var b=new jsfeat.matrix_t(a.width,a.height,jsfeat.U8C1_t),c,f;jsfeat.imgproc.grayscale(d.data,a.width,a.height,b);jsfeat.imgproc.gaussian_blur(b,b,(this.radius|0)+1<<1,this.sigma);a=new Uint32Array(d.data.buffer);c=b.cols*b.rows;for(pix=0;0<=--c;)f=b.data[c],a[c]=-16777216|f<<16|f<< reactiveGaussianBlur.apply=function(){if(this._manager instanceof ReactiveFilterManager&&this.active){var a=this._manager._canvas,d=this._manager._context,e=d.getImageData(0,0,a.width,a.height);new Uint32Array(e.buffer);var b=new jsfeat.matrix_t(a.width,a.height,jsfeat.U8C1_t),c,f;jsfeat.imgproc.grayscale(e.data,a.width,a.height,b);jsfeat.imgproc.gaussian_blur(b,b,(this.radius|0)+1<<1,this.sigma);a=new Uint32Array(e.data.buffer);c=b.cols*b.rows;for(pix=0;0<=--c;)f=b.data[c],a[c]=-16777216|f<<16|f<<
8|f;e.putImageData(d,0,0)}};var reactiveCanny=new ReactiveFilter({active:!1,low_threshold:1,high_threshold:1,radius:3}); 8|f;d.putImageData(e,0,0)}};var reactiveCanny=new ReactiveFilter({active:!1,low_threshold:1,high_threshold:1,radius:3});
reactiveCanny.apply=function(){if(this._manager instanceof ReactiveFilterManager&&this.active){var a=this._manager._canvas,e=this._manager._context,d=e.getImageData(0,0,a.width,a.height),b=new jsfeat.matrix_t(a.width,a.height,jsfeat.U8C1_t),c,f;jsfeat.imgproc.grayscale(d.data,a.width,a.height,b);jsfeat.imgproc.gaussian_blur(b,b,(this.radius|0)+1<<1,0);jsfeat.imgproc.canny(b,b,this.low_threshold|0,this.high_threshold|0);a=new Uint32Array(d.data.buffer);c=b.cols*b.rows;for(pix=0;0<=--c;)f=b.data[c], reactiveCanny.apply=function(){if(this._manager instanceof ReactiveFilterManager&&this.active){var a=this._manager._canvas,d=this._manager._context,e=d.getImageData(0,0,a.width,a.height),b=new jsfeat.matrix_t(a.width,a.height,jsfeat.U8C1_t),c,f;jsfeat.imgproc.grayscale(e.data,a.width,a.height,b);jsfeat.imgproc.gaussian_blur(b,b,(this.radius|0)+1<<1,0);jsfeat.imgproc.canny(b,b,this.low_threshold|0,this.high_threshold|0);a=new Uint32Array(e.data.buffer);c=b.cols*b.rows;for(pix=0;0<=--c;)f=b.data[c],
a[c]=-16777216|f<<16|f<<8|f;e.putImageData(d,0,0)}}; a[c]=-16777216|f<<16|f<<8|f;d.putImageData(e,0,0)}};var reactiveHaarFace=new ReactiveFilter({active:!1,equalize_histogram:!0,use_canny:!1,edges_density:.13,scale_factor:1.15,min_scale:2});
reactiveHaarFace.apply=function(){if(this._manager instanceof ReactiveFilterManager&&this.active){var a=this._manager._canvas,d=this._manager._context,e=d.getImageData(0,0,a.width,a.height),b=new jsfeat.matrix_t(a.width,a.height,jsfeat.U8C1_t),c=new function(){var c=Math.min(160/a.width,160/a.height),b=a.width*c|0;h=a.height*c|0;this.timg_u8=new jsfeat.matrix_t(b,h,jsfeat.U8_t|jsfeat.C1_t);this.edg=new jsfeat.matrix_t(b,h,jsfeat.U8_t|jsfeat.C1_t);this.canvas=document.createElement("canvas");this.canvas.width=
b;this.canvas.height=h;this.context=this.canvas.getContext("2d");this.sum=new Int32Array((b+1)*(h+1));this.sqsum=new Int32Array((b+1)*(h+1));this.tilted=new Int32Array((b+1)*(h+1));this.canny=new Int32Array((b+1)*(h+1));this.classifier=jsfeat.haar.frontalface},f;jsfeat.imgproc.grayscale(e.data,a.width,a.height,b);this.equalize_histogram&&jsfeat.imgproc.equalize_histogram(b,b);jsfeat.imgproc.compute_integral_image(b,c.sum,c.sqsum,c.classifier.tilted?c.tilted:null);this.use_canny&&(jsfeat.imgproc.canny(b,
c.edg,10,50),jsfeat.imgproc.compute_integral_image(c.edg,c.canny,null,null));jsfeat.haar.edges_density=this.edges_density;console.time("[Haar] detect_single_scale");c=jsfeat.haar.detect_single_scale(c.sum,c.sqsum,c.tilted,this.use_canny?c.canny:null,b.cols,b.rows,c.classifier,this.scale_factor,this.min_scale);console.warn(c);console.timeEnd("[Haar] detect_single_scale");c=jsfeat.haar.group_rectangles(c,1);console.log("zones",c.length);f=c.length;b=a.width/b.cols;f&&jsfeat.math.qsort(c,0,f-1,function(a,
b){return b.confidence<a.confidence});0<c.length&&d.strokeRect(c[0].x*b|0,c[0].y*b|0,c[0].width*b|0,c[0].height*b|0);d.putImageData(e,0,0)}};

View File

@ -597,3 +597,102 @@ reactiveCanny.apply = function(){
o.context.putImageData(imageData, 0, 0); o.context.putImageData(imageData, 0, 0);
}; };
/************************************************
**** Gestion du Harr Face Detection ****
************************************************/
var reactiveHaarFace = new ReactiveFilter({ active: false, equalize_histogram: true, use_canny: false, edges_density: 0.13, scale_factor: 1.15, min_scale: 2 });
reactiveHaarFace.apply = function(){
/* [1] Si pas de manager, on exit
=========================================================*/
if( !(this._manager instanceof ReactiveFilterManager) )
return;
if( !this.active )
return;
/* [2] On recupère notre back-buffer (8Uint)
=========================================================*/
var o = {
image: this._manager._target,
canvas: this._manager._canvas,
context: this._manager._context
};
/* (1) Get source */
var imageData = o.context.getImageData(0, 0, o.canvas.width, o.canvas.height);
var img_u8 = new jsfeat.matrix_t(o.canvas.width, o.canvas.height, jsfeat.U8C1_t);
/* (2) Creating working context */
var work = new (function(){
var max_size = 160,
scale = Math.min( max_size/o.canvas.width, max_size/o.canvas.height ),
w = (o.canvas.width*scale) | 0;
h = (o.canvas.height*scale) | 0;
this.timg_u8 = new jsfeat.matrix_t(w, h, jsfeat.U8_t | jsfeat.C1_t);
this.edg = new jsfeat.matrix_t(w, h, jsfeat.U8_t | jsfeat.C1_t);
this.canvas = document.createElement('canvas');
this.canvas.width = w;
this.canvas.height = h;
this.context = this.canvas.getContext('2d');
this.sum = new Int32Array( (w+1) * (h+1) );
this.sqsum = new Int32Array( (w+1) * (h+1) );
this.tilted = new Int32Array( (w+1) * (h+1) );
this.canny = new Int32Array( (w+1) * (h+1) );
this.classifier = jsfeat.haar.frontalface;
});
var zones, on, i, n, sc;
/* [3] On effectue notre modification
=========================================================*/
jsfeat.imgproc.grayscale(imageData.data, o.canvas.width, o.canvas.height, img_u8);
// possible options
this.equalize_histogram && jsfeat.imgproc.equalize_histogram(img_u8, img_u8);
//jsfeat.imgproc.gaussian_blur(img_u8, img_u8, 3);
jsfeat.imgproc.compute_integral_image(img_u8, work.sum, work.sqsum, work.classifier.tilted ? work.tilted : null);
if( this.use_canny ){
jsfeat.imgproc.canny(img_u8, work.edg, 10, 50);
jsfeat.imgproc.compute_integral_image(work.edg, work.canny, null, null);
}
jsfeat.haar.edges_density = this.edges_density;
console.time('[Haar] detect_single_scale');
// FIXME: manage `detect_single_scale` instead of `detect_multi_scale`
zones = jsfeat.haar.detect_single_scale(work.sum, work.sqsum, work.tilted, this.use_canny ? work.canny : null, img_u8.cols, img_u8.rows, work.classifier, this.scale_factor, this.min_scale);
console.warn(zones);
// zones = jsfeat.haar.detect_multi_scale(work.sum, work.sqsum, work.tilted, this.use_canny ? work.canny : null, img_u8.cols, img_u8.rows, work.classifier, this.scale_factor, this.min_scale);
console.timeEnd('[Haar] detect_single_scale');
zones = jsfeat.haar.group_rectangles(zones, 1);
console.log('zones', zones.length);
// draw only most confident one
on = zones.length;
sc = o.canvas.width/img_u8.cols;
/* (x) Sort zones by confidence to have the best at index `0` */
if( on )
jsfeat.math.qsort(zones, 0, on-1, function(a,b){ return b.confidence < a.confidence; });
/* (x) If at least 1 zone found -> draw it */
if( zones.length > 0 )
o.context.strokeRect(
(zones[0].x*sc) | 0,
(zones[0].y*sc) | 0,
(zones[0].width*sc) | 0,
(zones[0].height*sc) | 0
);
/* (2) Copie le résultat sur le `<canvas>` */
o.context.putImageData(imageData, 0, 0);
};

View File

@ -2,9 +2,10 @@ var DOM={body:$("body"),canvas:$("canvas"),imageLoader:$("#image-loader")},_CAN=
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;Controller.addFolder("Source Picture");Controller.remember(this);Controller.add(this,"src",this._images).listen()};zones.feature=[];zones.face=[];track={trackFeatures:function(){zones.feature=[];featureTrackerTask=tracking.track(_CAN,featureTracker)},trackFace:function(){zones.face=[];faceTrackerTask= 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;Controller.addFolder("Source Picture");Controller.remember(this);Controller.add(this,"src",this._images).listen()};zones.feature=[];zones.face=[];track={trackFeatures:function(){zones.feature=[];featureTrackerTask=tracking.track(_CAN,featureTracker)},trackFace:function(){zones.face=[];faceTrackerTask=
tracking.track(_CAN,faceTracker)}};faceTracker=new tracking.ObjectTracker(["face"]);featureTracker=new tracking.ObjectTracker(["eye","mouth"]);faceTracker.setInitialScale(1);featureTracker.setInitialScale(1);faceTracker.setStepSize(1.2);featureTracker.setStepSize(1.2);faceTracker.setEdgesDensity(.1);featureTracker.setEdgesDensity(.1);trackerCallback=function(a,c){zones[a].length=0;c.data.forEach(function(b){zones[a].push({x:b.x/_CAN.width,y:b.y/_CAN.height,w:b.width/_CAN.width,h:b.height/_CAN.height})}); tracking.track(_CAN,faceTracker)}};faceTracker=new tracking.ObjectTracker(["face"]);featureTracker=new tracking.ObjectTracker(["eye","mouth"]);faceTracker.setInitialScale(1);featureTracker.setInitialScale(1);faceTracker.setStepSize(1.2);featureTracker.setStepSize(1.2);faceTracker.setEdgesDensity(.1);featureTracker.setEdgesDensity(.1);trackerCallback=function(a,c){zones[a].length=0;c.data.forEach(function(b){zones[a].push({x:b.x/_CAN.width,y:b.y/_CAN.height,w:b.width/_CAN.width,h:b.height/_CAN.height})});
0<zones[a].length?log(a+" recognition done","[Tracking.js]"):log(a+" recognition failed","[Tracking.js]");process.apply(DOM.imageLoader)};faceTracker.on("track",function(a){return trackerCallback.apply(this,["face",a])});featureTracker.on("track",function(a){return trackerCallback.apply(this,["feature",a])});process=function(){if(initialized&&this instanceof HTMLImageElement){console.time("PROCESS");this.src!=last&&(zones.face=[],zones.feature=[],exec=!1,last=this.src);exec||(this.defaultWidth=this.width, 0<zones[a].length?log(a+" recognition done","[Tracking.js]"):log(a+" recognition failed","[Tracking.js]");process.apply(DOM.imageLoader)};faceTracker.on("track",function(a){return trackerCallback.apply(this,["face",a])});featureTracker.on("track",function(a){return trackerCallback.apply(this,["feature",a])});process=function(){if(initialized&&this instanceof HTMLImageElement){console.time("PROCESS");this.src!=last&&(zones.face=[],zones.feature=[],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,c,b,d,e;for(a in zones.feature)c=zones.feature[a].x*_CAN.width,b=zones.feature[a].y*_CAN.height,d=zones.feature[a].w*_CAN.width,e=zones.feature[a].h*_CAN.height, 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();filterManager.get("haar_face").apply();var a,c,b,d,e;for(a in zones.feature)c=zones.feature[a].x*_CAN.width,b=zones.feature[a].y*_CAN.height,d=zones.feature[a].w*
_CON.lineWidth=5,_CON.strokeStyle="#f00",_CON.strokeRect(c,b,d,e);for(a in zones.face)c=zones.face[a].x*_CAN.width,b=zones.face[a].y*_CAN.height,d=zones.face[a].w*_CAN.width,e=zones.face[a].h*_CAN.height,_CON.lineWidth=5,_CON.strokeStyle="#ff0",_CON.strokeRect(c,b,d,e);console.timeEnd("PROCESS")}};filterManager=new ReactiveFilterManager(DOM.imageLoader,_CAN,process);filterManager.add("resolution",reactiveResolution);filterManager.add("contrast",reactiveContrast);filterManager.add("grayscale",reactiveGrayscale); _CAN.width,e=zones.feature[a].h*_CAN.height,_CON.lineWidth=5,_CON.strokeStyle="#f00",_CON.strokeRect(c,b,d,e);for(a in zones.face)c=zones.face[a].x*_CAN.width,b=zones.face[a].y*_CAN.height,d=zones.face[a].w*_CAN.width,e=zones.face[a].h*_CAN.height,_CON.lineWidth=5,_CON.strokeStyle="#ff0",_CON.strokeRect(c,b,d,e);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("grayscale"));Controller.remember(filterManager.get("sobel"));Controller.remember(filterManager.get("canny"));Controller.remember(filterManager.get("gaussian"));Controller.addFolder("Tracking.js");Controller.add(track,"trackFace"); 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("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.add(track,"trackFeatures");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.add(filterManager.get("grayscale"),"grayscale");Controller.addFolder("Gaussian Blur");Controller.add(filterManager.get("gaussian"),"active");Controller.add(filterManager.get("gaussian"), Controller.remember(filterManager.get("haar_face"));Controller.addFolder("Tracking.js");Controller.add(track,"trackFace");Controller.add(track,"trackFeatures");Controller.addFolder("Haar Face Detection");Controller.add(filterManager.get("haar_face"),"active");Controller.add(filterManager.get("haar_face"),"min_scale",1,4).step(.1);Controller.add(filterManager.get("haar_face"),"scale_factor",1.1,2).step(.025);Controller.add(filterManager.get("haar_face"),"equalize_histogram");Controller.add(filterManager.get("haar_face"),
"sigma",0,10).step(.5);Controller.add(filterManager.get("gaussian"),"radius",1,11).step(1);Controller.addFolder("Sobel Filter");Controller.add(filterManager.get("sobel"),"sobelActive");Controller.addFolder("Canny Filter");Controller.add(filterManager.get("canny"),"active");Controller.add(filterManager.get("canny"),"radius",0,4).step(1);Controller.add(filterManager.get("canny"),"low_threshold",1,127).step(1);Controller.add(filterManager.get("canny"),"high_threshold",1,127).step(1);Controller.addFolder("Process"); "use_canny");Controller.add(filterManager.get("haar_face"),"edges_density",.01,1).step(.005);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.add(filterManager.get("grayscale"),"grayscale");Controller.addFolder("Gaussian Blur");Controller.add(filterManager.get("gaussian"),
Controller.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(c){log("Corrupted data.","[PermanentStorage]")}},!1);iL=new ImageLoader(DOM.imageLoader,init,process);return!0}); "active");Controller.add(filterManager.get("gaussian"),"sigma",0,10).step(.5);Controller.add(filterManager.get("gaussian"),"radius",1,11).step(1);Controller.addFolder("Sobel Filter");Controller.add(filterManager.get("sobel"),"sobelActive");Controller.addFolder("Canny Filter");Controller.add(filterManager.get("canny"),"active");Controller.add(filterManager.get("canny"),"radius",0,4).step(1);Controller.add(filterManager.get("canny"),"low_threshold",1,127).step(1);Controller.add(filterManager.get("canny"),
"high_threshold",1,127).step(1);Controller.addFolder("Process");Controller.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(c){log("Corrupted data.","[PermanentStorage]")}},!1);iL=new ImageLoader(DOM.imageLoader,init,process);return!0});