2016-11-04 18:14:39 +00:00
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 ;
2016-11-16 09:52:12 +00:00
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 } ) ;