From 39af6440266e562b10f44564e998570b3c72f6c0 Mon Sep 17 00:00:00 2001 From: xdrm-brackets Date: Fri, 4 Nov 2016 18:44:29 +0100 Subject: [PATCH] Gestion des folders et sub-folders de dat.GUI + face_trackingjs est un reactiveFilter. --- public_html/css/expanded/layout.css | 17 ++- public_html/css/expanded/layout.css.map | 4 +- public_html/css/layout.scss | 13 ++ public_html/css/min/layout.css | 4 +- public_html/css/min/layout.css.map | 4 +- public_html/index.php | 5 +- public_html/js/action-script.js | 134 +++++++++++---------- public_html/js/lib/min/reactive-filter.js | 40 +++--- public_html/js/lib/min/reset.js | 5 +- public_html/js/lib/reactive-filter.js | 114 +++++++++++++++--- public_html/js/lib/reset.js | 22 +++- public_html/js/min/action-script.js | 24 ++-- public_html/permanent-storage/storage.json | 2 +- public_html/src/loader.svg | 47 ++++++++ 14 files changed, 304 insertions(+), 131 deletions(-) create mode 100644 public_html/src/loader.svg diff --git a/public_html/css/expanded/layout.css b/public_html/css/expanded/layout.css index 3e9ede8..95e1911 100644 --- a/public_html/css/expanded/layout.css +++ b/public_html/css/expanded/layout.css @@ -4,6 +4,21 @@ body { font-size: 12px; } +#loader { + display: block; + position: absolute; + width: 500px; + height: 500px; + margin-left: 20px; + background: url("../../src/loader.svg") center center no-repeat; + background-size: 0 0; + z-index: 1; +} + +#loader.active { + background-size: 4em 4em; +} + #image-loader { display: none; } @@ -46,4 +61,4 @@ body { text-shadow: none !important; } -/*# sourceMappingURL=data:application/json;base64,ewoJInZlcnNpb24iOiAzLAoJImZpbGUiOiAibGF5b3V0LmNzcyIsCgkic291cmNlcyI6IFsKCQkiLi4vbGF5b3V0LnNjc3MiCgldLAoJInNvdXJjZXNDb250ZW50IjogWwoJCSIkaW1hZ2Utc2l6ZTogNTAwcHg7XG5cblxuYm9keXtcblx0YmFja2dyb3VuZC1jb2xvcjogI2NjYztcblxuXHRmb250LWZhbWlseTogJ0NvdXJpZXInO1xuXHRmb250LXNpemU6IDEycHg7XG59XG5cblxuXG4jaW1hZ2UtbG9hZGVye1xuXHRkaXNwbGF5OiBub25lO1xufVxuXG4jY2FudmFze1xuXHRkaXNwbGF5OiBibG9jaztcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRcdHdpZHRoOiBjYWxjKCAjeyRpbWFnZS1zaXplfSAtIDIqMnB4ICk7XG5cdFx0aGVpZ2h0OiBjYWxjKCAjeyRpbWFnZS1zaXplfSAtIDIqMnB4ICk7XG5cblx0bWFyZ2luOiAyMHB4O1xuXG5cdGJvcmRlcjogMnB4IHNvbGlkICMwMDA7XG59XG5cblxuI2xvZ3tcblx0ZGlzcGxheTogYmxvY2s7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0XHR3aWR0aDogY2FsYyggI3skaW1hZ2Utc2l6ZX0gLSAyKjJweCAtIDIqMTBweCApO1xuXG5cdG1hcmdpbjogMTBweCAyMHB4O1xuXHRwYWRkaW5nOiAxMHB4O1xuXG5cdGJvcmRlcjogMnB4IHNvbGlkICM1NTU7XG5cblx0c3Bhbntcblx0XHRkaXNwbGF5OiBibG9jaztcblx0fVxuXG59XG5cblxuLy8gQURERUQgVE8gREFULkdVSVxuLmRnLmEgLnNhdmUtcm93eyBiYWNrZ3JvdW5kLWNvbG9yOiAjMWExYTFhICFpbXBvcnRhbnQ7IH1cblxuLmRnIGxpLnNhdmUtcm93ID4gc2VsZWN0e1xuXHRiYWNrZ3JvdW5kLWNvbG9yOiAjN2Q3ZDdkICFpbXBvcnRhbnQ7XG5cdGNvbG9yOiAjZmZmICFpbXBvcnRhbnQ7XG5cdGJvcmRlcjogMCAhaW1wb3J0YW50O1xufVxuXG4uZGcgbGkuc2F2ZS1yb3cgPiBzcGFue1xuXHRiYWNrZ3JvdW5kLWNvbG9yOiAjMzAzMDMwICFpbXBvcnRhbnQ7XG5cdGJveC1zaGFkb3c6IG5vbmUgIWltcG9ydGFudDtcblx0dGV4dC1zaGFkb3c6IG5vbmUgIWltcG9ydGFudDtcbn1cbiIKCV0sCgkibWFwcGluZ3MiOiAiQUFHQSxBQUFBLElBQUksQ0FBQTtFQUNILGdCQUFnQixFQUFFLElBQUs7RUFFdkIsV0FBVyxFQUFFLFNBQVU7RUFDdkIsU0FBUyxFQUFFLElBQUs7Q0FDaEI7O0FBSUQsQUFBQSxhQUFhLENBQUE7RUFDWixPQUFPLEVBQUUsSUFBSztDQUNkOztBQUVELEFBQUEsT0FBTyxDQUFBO0VBQ04sT0FBTyxFQUFFLEtBQU07RUFDZixRQUFRLEVBQUUsUUFBUztFQUNsQixLQUFLLEVBQUUsb0JBQUk7RUFDWCxNQUFNLEVBQUUsb0JBQUk7RUFFYixNQUFNLEVBQUUsSUFBSztFQUViLE1BQU0sRUFBRSxjQUFlO0NBQ3ZCOztBQUdELEFBQUEsSUFBSSxDQUFBO0VBQ0gsT0FBTyxFQUFFLEtBQU07RUFDZixRQUFRLEVBQUUsUUFBUztFQUNsQixLQUFLLEVBQUUsNkJBQUk7RUFFWixNQUFNLEVBQUUsU0FBVTtFQUNsQixPQUFPLEVBQUUsSUFBSztFQUVkLE1BQU0sRUFBRSxjQUFlO0NBTXZCOztBQWRELEFBVUMsSUFWRyxDQVVILElBQUksQ0FBQTtFQUNILE9BQU8sRUFBRSxLQUFNO0NBQ2Y7O0FBTUYsQUFBTSxHQUFILEFBQUEsRUFBRSxDQUFDLFNBQVMsQ0FBQTtFQUFFLGdCQUFnQixFQUFFLGtCQUFtQjtDQUFJOztBQUUxRCxBQUFrQixHQUFmLENBQUMsRUFBRSxBQUFBLFNBQVMsR0FBRyxNQUFNLENBQUE7RUFDdkIsZ0JBQWdCLEVBQUUsa0JBQW1CO0VBQ3JDLEtBQUssRUFBRSxlQUFnQjtFQUN2QixNQUFNLEVBQUUsWUFBYTtDQUNyQjs7QUFFRCxBQUFrQixHQUFmLENBQUMsRUFBRSxBQUFBLFNBQVMsR0FBRyxJQUFJLENBQUE7RUFDckIsZ0JBQWdCLEVBQUUsa0JBQW1CO0VBQ3JDLFVBQVUsRUFBRSxlQUFnQjtFQUM1QixXQUFXLEVBQUUsZUFBZ0I7Q0FDN0IiLAoJIm5hbWVzIjogW10KfQ== */ \ No newline at end of file +/*# sourceMappingURL=data:application/json;base64,ewoJInZlcnNpb24iOiAzLAoJImZpbGUiOiAibGF5b3V0LmNzcyIsCgkic291cmNlcyI6IFsKCQkiLi4vbGF5b3V0LnNjc3MiCgldLAoJInNvdXJjZXNDb250ZW50IjogWwoJCSIkaW1hZ2Utc2l6ZTogNTAwcHg7XG5cblxuYm9keXtcblx0YmFja2dyb3VuZC1jb2xvcjogI2NjYztcblxuXHRmb250LWZhbWlseTogJ0NvdXJpZXInO1xuXHRmb250LXNpemU6IDEycHg7XG59XG5cbiNsb2FkZXJ7XG5cdGRpc3BsYXk6IGJsb2NrO1xuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHdpZHRoOiA1MDBweDtcblx0aGVpZ2h0OiA1MDBweDtcblx0bWFyZ2luLWxlZnQ6IDIwcHg7XG5cdGJhY2tncm91bmQ6IHVybCgnLi4vLi4vc3JjL2xvYWRlci5zdmcnKSBjZW50ZXIgY2VudGVyIG5vLXJlcGVhdDtcblx0YmFja2dyb3VuZC1zaXplOiAwIDA7XG5cdHotaW5kZXg6IDE7XG59XG5cbiNsb2FkZXIuYWN0aXZle1xuXHRiYWNrZ3JvdW5kLXNpemU6IDRlbSA0ZW07XG59XG5cbiNpbWFnZS1sb2FkZXJ7XG5cdGRpc3BsYXk6IG5vbmU7XG59XG5cbiNjYW52YXN7XG5cdGRpc3BsYXk6IGJsb2NrO1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdFx0d2lkdGg6IGNhbGMoICN7JGltYWdlLXNpemV9IC0gMioycHggKTtcblx0XHRoZWlnaHQ6IGNhbGMoICN7JGltYWdlLXNpemV9IC0gMioycHggKTtcblxuXHRtYXJnaW46IDIwcHg7XG5cblx0Ym9yZGVyOiAycHggc29saWQgIzAwMDtcbn1cblxuXG4jbG9ne1xuXHRkaXNwbGF5OiBibG9jaztcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRcdHdpZHRoOiBjYWxjKCAjeyRpbWFnZS1zaXplfSAtIDIqMnB4IC0gMioxMHB4ICk7XG5cblx0bWFyZ2luOiAxMHB4IDIwcHg7XG5cdHBhZGRpbmc6IDEwcHg7XG5cblx0Ym9yZGVyOiAycHggc29saWQgIzU1NTtcblxuXHRzcGFue1xuXHRcdGRpc3BsYXk6IGJsb2NrO1xuXHR9XG5cbn1cblxuXG4vLyBBRERFRCBUTyBEQVQuR1VJXG4uZGcuYSAuc2F2ZS1yb3d7IGJhY2tncm91bmQtY29sb3I6ICMxYTFhMWEgIWltcG9ydGFudDsgfVxuXG4uZGcgbGkuc2F2ZS1yb3cgPiBzZWxlY3R7XG5cdGJhY2tncm91bmQtY29sb3I6ICM3ZDdkN2QgIWltcG9ydGFudDtcblx0Y29sb3I6ICNmZmYgIWltcG9ydGFudDtcblx0Ym9yZGVyOiAwICFpbXBvcnRhbnQ7XG59XG5cbi5kZyBsaS5zYXZlLXJvdyA+IHNwYW57XG5cdGJhY2tncm91bmQtY29sb3I6ICMzMDMwMzAgIWltcG9ydGFudDtcblx0Ym94LXNoYWRvdzogbm9uZSAhaW1wb3J0YW50O1xuXHR0ZXh0LXNoYWRvdzogbm9uZSAhaW1wb3J0YW50O1xufVxuIgoJXSwKCSJtYXBwaW5ncyI6ICJBQUdBLEFBQUEsSUFBSSxDQUFBO0VBQ0gsZ0JBQWdCLEVBQUUsSUFBSztFQUV2QixXQUFXLEVBQUUsU0FBVTtFQUN2QixTQUFTLEVBQUUsSUFBSztDQUNoQjs7QUFFRCxBQUFBLE9BQU8sQ0FBQTtFQUNOLE9BQU8sRUFBRSxLQUFNO0VBQ2YsUUFBUSxFQUFFLFFBQVM7RUFDbkIsS0FBSyxFQUFFLEtBQU07RUFDYixNQUFNLEVBQUUsS0FBTTtFQUNkLFdBQVcsRUFBRSxJQUFLO0VBQ2xCLFVBQVUsRUFBRSwyQkFBRyxDQUF5QixNQUFNLENBQUMsTUFBTSxDQUFDLFNBQVM7RUFDL0QsZUFBZSxFQUFFLEdBQUk7RUFDckIsT0FBTyxFQUFFLENBQUU7Q0FDWDs7QUFFRCxBQUFPLE9BQUEsQUFBQSxPQUFPLENBQUE7RUFDYixlQUFlLEVBQUUsT0FBUTtDQUN6Qjs7QUFFRCxBQUFBLGFBQWEsQ0FBQTtFQUNaLE9BQU8sRUFBRSxJQUFLO0NBQ2Q7O0FBRUQsQUFBQSxPQUFPLENBQUE7RUFDTixPQUFPLEVBQUUsS0FBTTtFQUNmLFFBQVEsRUFBRSxRQUFTO0VBQ2xCLEtBQUssRUFBRSxvQkFBSTtFQUNYLE1BQU0sRUFBRSxvQkFBSTtFQUViLE1BQU0sRUFBRSxJQUFLO0VBRWIsTUFBTSxFQUFFLGNBQWU7Q0FDdkI7O0FBR0QsQUFBQSxJQUFJLENBQUE7RUFDSCxPQUFPLEVBQUUsS0FBTTtFQUNmLFFBQVEsRUFBRSxRQUFTO0VBQ2xCLEtBQUssRUFBRSw2QkFBSTtFQUVaLE1BQU0sRUFBRSxTQUFVO0VBQ2xCLE9BQU8sRUFBRSxJQUFLO0VBRWQsTUFBTSxFQUFFLGNBQWU7Q0FNdkI7O0FBZEQsQUFVQyxJQVZHLENBVUgsSUFBSSxDQUFBO0VBQ0gsT0FBTyxFQUFFLEtBQU07Q0FDZjs7QUFNRixBQUFNLEdBQUgsQUFBQSxFQUFFLENBQUMsU0FBUyxDQUFBO0VBQUUsZ0JBQWdCLEVBQUUsa0JBQW1CO0NBQUk7O0FBRTFELEFBQWtCLEdBQWYsQ0FBQyxFQUFFLEFBQUEsU0FBUyxHQUFHLE1BQU0sQ0FBQTtFQUN2QixnQkFBZ0IsRUFBRSxrQkFBbUI7RUFDckMsS0FBSyxFQUFFLGVBQWdCO0VBQ3ZCLE1BQU0sRUFBRSxZQUFhO0NBQ3JCOztBQUVELEFBQWtCLEdBQWYsQ0FBQyxFQUFFLEFBQUEsU0FBUyxHQUFHLElBQUksQ0FBQTtFQUNyQixnQkFBZ0IsRUFBRSxrQkFBbUI7RUFDckMsVUFBVSxFQUFFLGVBQWdCO0VBQzVCLFdBQVcsRUFBRSxlQUFnQjtDQUM3QiIsCgkibmFtZXMiOiBbXQp9 */ \ No newline at end of file diff --git a/public_html/css/expanded/layout.css.map b/public_html/css/expanded/layout.css.map index ddadf34..162fccc 100644 --- a/public_html/css/expanded/layout.css.map +++ b/public_html/css/expanded/layout.css.map @@ -5,8 +5,8 @@ "../layout.scss" ], "sourcesContent": [ - "$image-size: 500px;\n\n\nbody{\n\tbackground-color: #ccc;\n\n\tfont-family: 'Courier';\n\tfont-size: 12px;\n}\n\n\n\n#image-loader{\n\tdisplay: none;\n}\n\n#canvas{\n\tdisplay: block;\n\tposition: relative;\n\t\twidth: calc( #{$image-size} - 2*2px );\n\t\theight: calc( #{$image-size} - 2*2px );\n\n\tmargin: 20px;\n\n\tborder: 2px solid #000;\n}\n\n\n#log{\n\tdisplay: block;\n\tposition: relative;\n\t\twidth: calc( #{$image-size} - 2*2px - 2*10px );\n\n\tmargin: 10px 20px;\n\tpadding: 10px;\n\n\tborder: 2px solid #555;\n\n\tspan{\n\t\tdisplay: block;\n\t}\n\n}\n\n\n// ADDED TO DAT.GUI\n.dg.a .save-row{ background-color: #1a1a1a !important; }\n\n.dg li.save-row > select{\n\tbackground-color: #7d7d7d !important;\n\tcolor: #fff !important;\n\tborder: 0 !important;\n}\n\n.dg li.save-row > span{\n\tbackground-color: #303030 !important;\n\tbox-shadow: none !important;\n\ttext-shadow: none !important;\n}\n" + "$image-size: 500px;\n\n\nbody{\n\tbackground-color: #ccc;\n\n\tfont-family: 'Courier';\n\tfont-size: 12px;\n}\n\n#loader{\n\tdisplay: block;\n\tposition: absolute;\n\twidth: 500px;\n\theight: 500px;\n\tmargin-left: 20px;\n\tbackground: url('../../src/loader.svg') center center no-repeat;\n\tbackground-size: 0 0;\n\tz-index: 1;\n}\n\n#loader.active{\n\tbackground-size: 4em 4em;\n}\n\n#image-loader{\n\tdisplay: none;\n}\n\n#canvas{\n\tdisplay: block;\n\tposition: relative;\n\t\twidth: calc( #{$image-size} - 2*2px );\n\t\theight: calc( #{$image-size} - 2*2px );\n\n\tmargin: 20px;\n\n\tborder: 2px solid #000;\n}\n\n\n#log{\n\tdisplay: block;\n\tposition: relative;\n\t\twidth: calc( #{$image-size} - 2*2px - 2*10px );\n\n\tmargin: 10px 20px;\n\tpadding: 10px;\n\n\tborder: 2px solid #555;\n\n\tspan{\n\t\tdisplay: block;\n\t}\n\n}\n\n\n// ADDED TO DAT.GUI\n.dg.a .save-row{ background-color: #1a1a1a !important; }\n\n.dg li.save-row > select{\n\tbackground-color: #7d7d7d !important;\n\tcolor: #fff !important;\n\tborder: 0 !important;\n}\n\n.dg li.save-row > span{\n\tbackground-color: #303030 !important;\n\tbox-shadow: none !important;\n\ttext-shadow: none !important;\n}\n" ], - "mappings": "AAGA,AAAA,IAAI,CAAA;EACH,gBAAgB,EAAE,IAAK;EAEvB,WAAW,EAAE,SAAU;EACvB,SAAS,EAAE,IAAK;CAChB;;AAID,AAAA,aAAa,CAAA;EACZ,OAAO,EAAE,IAAK;CACd;;AAED,AAAA,OAAO,CAAA;EACN,OAAO,EAAE,KAAM;EACf,QAAQ,EAAE,QAAS;EAClB,KAAK,EAAE,oBAAI;EACX,MAAM,EAAE,oBAAI;EAEb,MAAM,EAAE,IAAK;EAEb,MAAM,EAAE,cAAe;CACvB;;AAGD,AAAA,IAAI,CAAA;EACH,OAAO,EAAE,KAAM;EACf,QAAQ,EAAE,QAAS;EAClB,KAAK,EAAE,6BAAI;EAEZ,MAAM,EAAE,SAAU;EAClB,OAAO,EAAE,IAAK;EAEd,MAAM,EAAE,cAAe;CAMvB;;AAdD,AAUC,IAVG,CAUH,IAAI,CAAA;EACH,OAAO,EAAE,KAAM;CACf;;AAMF,AAAM,GAAH,AAAA,EAAE,CAAC,SAAS,CAAA;EAAE,gBAAgB,EAAE,kBAAmB;CAAI;;AAE1D,AAAkB,GAAf,CAAC,EAAE,AAAA,SAAS,GAAG,MAAM,CAAA;EACvB,gBAAgB,EAAE,kBAAmB;EACrC,KAAK,EAAE,eAAgB;EACvB,MAAM,EAAE,YAAa;CACrB;;AAED,AAAkB,GAAf,CAAC,EAAE,AAAA,SAAS,GAAG,IAAI,CAAA;EACrB,gBAAgB,EAAE,kBAAmB;EACrC,UAAU,EAAE,eAAgB;EAC5B,WAAW,EAAE,eAAgB;CAC7B", + "mappings": "AAGA,AAAA,IAAI,CAAA;EACH,gBAAgB,EAAE,IAAK;EAEvB,WAAW,EAAE,SAAU;EACvB,SAAS,EAAE,IAAK;CAChB;;AAED,AAAA,OAAO,CAAA;EACN,OAAO,EAAE,KAAM;EACf,QAAQ,EAAE,QAAS;EACnB,KAAK,EAAE,KAAM;EACb,MAAM,EAAE,KAAM;EACd,WAAW,EAAE,IAAK;EAClB,UAAU,EAAE,2BAAG,CAAyB,MAAM,CAAC,MAAM,CAAC,SAAS;EAC/D,eAAe,EAAE,GAAI;EACrB,OAAO,EAAE,CAAE;CACX;;AAED,AAAO,OAAA,AAAA,OAAO,CAAA;EACb,eAAe,EAAE,OAAQ;CACzB;;AAED,AAAA,aAAa,CAAA;EACZ,OAAO,EAAE,IAAK;CACd;;AAED,AAAA,OAAO,CAAA;EACN,OAAO,EAAE,KAAM;EACf,QAAQ,EAAE,QAAS;EAClB,KAAK,EAAE,oBAAI;EACX,MAAM,EAAE,oBAAI;EAEb,MAAM,EAAE,IAAK;EAEb,MAAM,EAAE,cAAe;CACvB;;AAGD,AAAA,IAAI,CAAA;EACH,OAAO,EAAE,KAAM;EACf,QAAQ,EAAE,QAAS;EAClB,KAAK,EAAE,6BAAI;EAEZ,MAAM,EAAE,SAAU;EAClB,OAAO,EAAE,IAAK;EAEd,MAAM,EAAE,cAAe;CAMvB;;AAdD,AAUC,IAVG,CAUH,IAAI,CAAA;EACH,OAAO,EAAE,KAAM;CACf;;AAMF,AAAM,GAAH,AAAA,EAAE,CAAC,SAAS,CAAA;EAAE,gBAAgB,EAAE,kBAAmB;CAAI;;AAE1D,AAAkB,GAAf,CAAC,EAAE,AAAA,SAAS,GAAG,MAAM,CAAA;EACvB,gBAAgB,EAAE,kBAAmB;EACrC,KAAK,EAAE,eAAgB;EACvB,MAAM,EAAE,YAAa;CACrB;;AAED,AAAkB,GAAf,CAAC,EAAE,AAAA,SAAS,GAAG,IAAI,CAAA;EACrB,gBAAgB,EAAE,kBAAmB;EACrC,UAAU,EAAE,eAAgB;EAC5B,WAAW,EAAE,eAAgB;CAC7B", "names": [] } \ No newline at end of file diff --git a/public_html/css/layout.scss b/public_html/css/layout.scss index fe58797..d39af75 100644 --- a/public_html/css/layout.scss +++ b/public_html/css/layout.scss @@ -8,7 +8,20 @@ body{ font-size: 12px; } +#loader{ + display: block; + position: absolute; + width: 500px; + height: 500px; + margin-left: 20px; + background: url('../../src/loader.svg') center center no-repeat; + background-size: 0 0; + z-index: 1; +} +#loader.active{ + background-size: 4em 4em; +} #image-loader{ display: none; diff --git a/public_html/css/min/layout.css b/public_html/css/min/layout.css index a63080b..e0d8dd6 100644 --- a/public_html/css/min/layout.css +++ b/public_html/css/min/layout.css @@ -1,3 +1,3 @@ -body{background-color:#ccc;font-family:'Courier';font-size:12px}#image-loader{display:none}#canvas{display:block;position:relative;width:calc( 500px - 2*2px);height:calc( 500px - 2*2px);margin:20px;border:2px solid #000}#log{display:block;position:relative;width:calc( 500px - 2*2px - 2*10px);margin:10px 20px;padding:10px;border:2px solid #555}#log span{display:block}.dg.a .save-row{background-color:#1a1a1a !important}.dg li.save-row>select{background-color:#7d7d7d !important;color:#fff !important;border:0 !important}.dg li.save-row>span{background-color:#303030 !important;box-shadow:none !important;text-shadow:none !important} +body{background-color:#ccc;font-family:'Courier';font-size:12px}#loader{display:block;position:absolute;width:500px;height:500px;margin-left:20px;background:url("../../src/loader.svg") center center no-repeat;background-size:0 0;z-index:1}#loader.active{background-size:4em 4em}#image-loader{display:none}#canvas{display:block;position:relative;width:calc( 500px - 2*2px);height:calc( 500px - 2*2px);margin:20px;border:2px solid #000}#log{display:block;position:relative;width:calc( 500px - 2*2px - 2*10px);margin:10px 20px;padding:10px;border:2px solid #555}#log span{display:block}.dg.a .save-row{background-color:#1a1a1a !important}.dg li.save-row>select{background-color:#7d7d7d !important;color:#fff !important;border:0 !important}.dg li.save-row>span{background-color:#303030 !important;box-shadow:none !important;text-shadow:none !important} -/*# sourceMappingURL=data:application/json;base64,ewoJInZlcnNpb24iOiAzLAoJImZpbGUiOiAibGF5b3V0LmNzcyIsCgkic291cmNlcyI6IFsKCQkiLi4vbGF5b3V0LnNjc3MiCgldLAoJInNvdXJjZXNDb250ZW50IjogWwoJCSIkaW1hZ2Utc2l6ZTogNTAwcHg7XG5cblxuYm9keXtcblx0YmFja2dyb3VuZC1jb2xvcjogI2NjYztcblxuXHRmb250LWZhbWlseTogJ0NvdXJpZXInO1xuXHRmb250LXNpemU6IDEycHg7XG59XG5cblxuXG4jaW1hZ2UtbG9hZGVye1xuXHRkaXNwbGF5OiBub25lO1xufVxuXG4jY2FudmFze1xuXHRkaXNwbGF5OiBibG9jaztcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRcdHdpZHRoOiBjYWxjKCAjeyRpbWFnZS1zaXplfSAtIDIqMnB4ICk7XG5cdFx0aGVpZ2h0OiBjYWxjKCAjeyRpbWFnZS1zaXplfSAtIDIqMnB4ICk7XG5cblx0bWFyZ2luOiAyMHB4O1xuXG5cdGJvcmRlcjogMnB4IHNvbGlkICMwMDA7XG59XG5cblxuI2xvZ3tcblx0ZGlzcGxheTogYmxvY2s7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0XHR3aWR0aDogY2FsYyggI3skaW1hZ2Utc2l6ZX0gLSAyKjJweCAtIDIqMTBweCApO1xuXG5cdG1hcmdpbjogMTBweCAyMHB4O1xuXHRwYWRkaW5nOiAxMHB4O1xuXG5cdGJvcmRlcjogMnB4IHNvbGlkICM1NTU7XG5cblx0c3Bhbntcblx0XHRkaXNwbGF5OiBibG9jaztcblx0fVxuXG59XG5cblxuLy8gQURERUQgVE8gREFULkdVSVxuLmRnLmEgLnNhdmUtcm93eyBiYWNrZ3JvdW5kLWNvbG9yOiAjMWExYTFhICFpbXBvcnRhbnQ7IH1cblxuLmRnIGxpLnNhdmUtcm93ID4gc2VsZWN0e1xuXHRiYWNrZ3JvdW5kLWNvbG9yOiAjN2Q3ZDdkICFpbXBvcnRhbnQ7XG5cdGNvbG9yOiAjZmZmICFpbXBvcnRhbnQ7XG5cdGJvcmRlcjogMCAhaW1wb3J0YW50O1xufVxuXG4uZGcgbGkuc2F2ZS1yb3cgPiBzcGFue1xuXHRiYWNrZ3JvdW5kLWNvbG9yOiAjMzAzMDMwICFpbXBvcnRhbnQ7XG5cdGJveC1zaGFkb3c6IG5vbmUgIWltcG9ydGFudDtcblx0dGV4dC1zaGFkb3c6IG5vbmUgIWltcG9ydGFudDtcbn1cbiIKCV0sCgkibWFwcGluZ3MiOiAiQUFHQSxBQUFBLElBQUksQUFBQSxDQUNILGdCQUFnQixDQUFFLElBQUssQ0FFdkIsV0FBVyxDQUFFLFNBQVUsQ0FDdkIsU0FBUyxDQUFFLElBQUssQ0FDaEIsQUFJRCxBQUFBLGFBQWEsQUFBQSxDQUNaLE9BQU8sQ0FBRSxJQUFLLENBQ2QsQUFFRCxBQUFBLE9BQU8sQUFBQSxDQUNOLE9BQU8sQ0FBRSxLQUFNLENBQ2YsUUFBUSxDQUFFLFFBQVMsQ0FDbEIsS0FBSyxDQUFFLG9CQUFJLENBQ1gsTUFBTSxDQUFFLG9CQUFJLENBRWIsTUFBTSxDQUFFLElBQUssQ0FFYixNQUFNLENBQUUsY0FBZSxDQUN2QixBQUdELEFBQUEsSUFBSSxBQUFBLENBQ0gsT0FBTyxDQUFFLEtBQU0sQ0FDZixRQUFRLENBQUUsUUFBUyxDQUNsQixLQUFLLENBQUUsNkJBQUksQ0FFWixNQUFNLENBQUUsU0FBVSxDQUNsQixPQUFPLENBQUUsSUFBSyxDQUVkLE1BQU0sQ0FBRSxjQUFlLENBTXZCLEFBZEQsQUFVQyxJQVZHLENBVUgsSUFBSSxBQUFBLENBQ0gsT0FBTyxDQUFFLEtBQU0sQ0FDZixBQU1GLEFBQU0sR0FBSCxBQUFBLEVBQUUsQ0FBQyxTQUFTLEFBQUEsQ0FBRSxnQkFBZ0IsQ0FBRSxrQkFBbUIsQ0FBSSxBQUUxRCxBQUFrQixHQUFmLENBQUMsRUFBRSxBQUFBLFNBQVMsQ0FBRyxNQUFNLEFBQUEsQ0FDdkIsZ0JBQWdCLENBQUUsa0JBQW1CLENBQ3JDLEtBQUssQ0FBRSxlQUFnQixDQUN2QixNQUFNLENBQUUsWUFBYSxDQUNyQixBQUVELEFBQWtCLEdBQWYsQ0FBQyxFQUFFLEFBQUEsU0FBUyxDQUFHLElBQUksQUFBQSxDQUNyQixnQkFBZ0IsQ0FBRSxrQkFBbUIsQ0FDckMsVUFBVSxDQUFFLGVBQWdCLENBQzVCLFdBQVcsQ0FBRSxlQUFnQixDQUM3QiIsCgkibmFtZXMiOiBbXQp9 */ \ No newline at end of file +/*# sourceMappingURL=data:application/json;base64,ewoJInZlcnNpb24iOiAzLAoJImZpbGUiOiAibGF5b3V0LmNzcyIsCgkic291cmNlcyI6IFsKCQkiLi4vbGF5b3V0LnNjc3MiCgldLAoJInNvdXJjZXNDb250ZW50IjogWwoJCSIkaW1hZ2Utc2l6ZTogNTAwcHg7XG5cblxuYm9keXtcblx0YmFja2dyb3VuZC1jb2xvcjogI2NjYztcblxuXHRmb250LWZhbWlseTogJ0NvdXJpZXInO1xuXHRmb250LXNpemU6IDEycHg7XG59XG5cbiNsb2FkZXJ7XG5cdGRpc3BsYXk6IGJsb2NrO1xuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHdpZHRoOiA1MDBweDtcblx0aGVpZ2h0OiA1MDBweDtcblx0bWFyZ2luLWxlZnQ6IDIwcHg7XG5cdGJhY2tncm91bmQ6IHVybCgnLi4vLi4vc3JjL2xvYWRlci5zdmcnKSBjZW50ZXIgY2VudGVyIG5vLXJlcGVhdDtcblx0YmFja2dyb3VuZC1zaXplOiAwIDA7XG5cdHotaW5kZXg6IDE7XG59XG5cbiNsb2FkZXIuYWN0aXZle1xuXHRiYWNrZ3JvdW5kLXNpemU6IDRlbSA0ZW07XG59XG5cbiNpbWFnZS1sb2FkZXJ7XG5cdGRpc3BsYXk6IG5vbmU7XG59XG5cbiNjYW52YXN7XG5cdGRpc3BsYXk6IGJsb2NrO1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdFx0d2lkdGg6IGNhbGMoICN7JGltYWdlLXNpemV9IC0gMioycHggKTtcblx0XHRoZWlnaHQ6IGNhbGMoICN7JGltYWdlLXNpemV9IC0gMioycHggKTtcblxuXHRtYXJnaW46IDIwcHg7XG5cblx0Ym9yZGVyOiAycHggc29saWQgIzAwMDtcbn1cblxuXG4jbG9ne1xuXHRkaXNwbGF5OiBibG9jaztcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRcdHdpZHRoOiBjYWxjKCAjeyRpbWFnZS1zaXplfSAtIDIqMnB4IC0gMioxMHB4ICk7XG5cblx0bWFyZ2luOiAxMHB4IDIwcHg7XG5cdHBhZGRpbmc6IDEwcHg7XG5cblx0Ym9yZGVyOiAycHggc29saWQgIzU1NTtcblxuXHRzcGFue1xuXHRcdGRpc3BsYXk6IGJsb2NrO1xuXHR9XG5cbn1cblxuXG4vLyBBRERFRCBUTyBEQVQuR1VJXG4uZGcuYSAuc2F2ZS1yb3d7IGJhY2tncm91bmQtY29sb3I6ICMxYTFhMWEgIWltcG9ydGFudDsgfVxuXG4uZGcgbGkuc2F2ZS1yb3cgPiBzZWxlY3R7XG5cdGJhY2tncm91bmQtY29sb3I6ICM3ZDdkN2QgIWltcG9ydGFudDtcblx0Y29sb3I6ICNmZmYgIWltcG9ydGFudDtcblx0Ym9yZGVyOiAwICFpbXBvcnRhbnQ7XG59XG5cbi5kZyBsaS5zYXZlLXJvdyA+IHNwYW57XG5cdGJhY2tncm91bmQtY29sb3I6ICMzMDMwMzAgIWltcG9ydGFudDtcblx0Ym94LXNoYWRvdzogbm9uZSAhaW1wb3J0YW50O1xuXHR0ZXh0LXNoYWRvdzogbm9uZSAhaW1wb3J0YW50O1xufVxuIgoJXSwKCSJtYXBwaW5ncyI6ICJBQUdBLEFBQUEsSUFBSSxBQUFBLENBQ0gsZ0JBQWdCLENBQUUsSUFBSyxDQUV2QixXQUFXLENBQUUsU0FBVSxDQUN2QixTQUFTLENBQUUsSUFBSyxDQUNoQixBQUVELEFBQUEsT0FBTyxBQUFBLENBQ04sT0FBTyxDQUFFLEtBQU0sQ0FDZixRQUFRLENBQUUsUUFBUyxDQUNuQixLQUFLLENBQUUsS0FBTSxDQUNiLE1BQU0sQ0FBRSxLQUFNLENBQ2QsV0FBVyxDQUFFLElBQUssQ0FDbEIsVUFBVSxDQUFFLDJCQUFHLENBQXlCLE1BQU0sQ0FBQyxNQUFNLENBQUMsU0FBUyxDQUMvRCxlQUFlLENBQUUsR0FBSSxDQUNyQixPQUFPLENBQUUsQ0FBRSxDQUNYLEFBRUQsQUFBTyxPQUFBLEFBQUEsT0FBTyxBQUFBLENBQ2IsZUFBZSxDQUFFLE9BQVEsQ0FDekIsQUFFRCxBQUFBLGFBQWEsQUFBQSxDQUNaLE9BQU8sQ0FBRSxJQUFLLENBQ2QsQUFFRCxBQUFBLE9BQU8sQUFBQSxDQUNOLE9BQU8sQ0FBRSxLQUFNLENBQ2YsUUFBUSxDQUFFLFFBQVMsQ0FDbEIsS0FBSyxDQUFFLG9CQUFJLENBQ1gsTUFBTSxDQUFFLG9CQUFJLENBRWIsTUFBTSxDQUFFLElBQUssQ0FFYixNQUFNLENBQUUsY0FBZSxDQUN2QixBQUdELEFBQUEsSUFBSSxBQUFBLENBQ0gsT0FBTyxDQUFFLEtBQU0sQ0FDZixRQUFRLENBQUUsUUFBUyxDQUNsQixLQUFLLENBQUUsNkJBQUksQ0FFWixNQUFNLENBQUUsU0FBVSxDQUNsQixPQUFPLENBQUUsSUFBSyxDQUVkLE1BQU0sQ0FBRSxjQUFlLENBTXZCLEFBZEQsQUFVQyxJQVZHLENBVUgsSUFBSSxBQUFBLENBQ0gsT0FBTyxDQUFFLEtBQU0sQ0FDZixBQU1GLEFBQU0sR0FBSCxBQUFBLEVBQUUsQ0FBQyxTQUFTLEFBQUEsQ0FBRSxnQkFBZ0IsQ0FBRSxrQkFBbUIsQ0FBSSxBQUUxRCxBQUFrQixHQUFmLENBQUMsRUFBRSxBQUFBLFNBQVMsQ0FBRyxNQUFNLEFBQUEsQ0FDdkIsZ0JBQWdCLENBQUUsa0JBQW1CLENBQ3JDLEtBQUssQ0FBRSxlQUFnQixDQUN2QixNQUFNLENBQUUsWUFBYSxDQUNyQixBQUVELEFBQWtCLEdBQWYsQ0FBQyxFQUFFLEFBQUEsU0FBUyxDQUFHLElBQUksQUFBQSxDQUNyQixnQkFBZ0IsQ0FBRSxrQkFBbUIsQ0FDckMsVUFBVSxDQUFFLGVBQWdCLENBQzVCLFdBQVcsQ0FBRSxlQUFnQixDQUM3QiIsCgkibmFtZXMiOiBbXQp9 */ \ No newline at end of file diff --git a/public_html/css/min/layout.css.map b/public_html/css/min/layout.css.map index 6805be3..4bfd3b4 100644 --- a/public_html/css/min/layout.css.map +++ b/public_html/css/min/layout.css.map @@ -5,8 +5,8 @@ "../layout.scss" ], "sourcesContent": [ - "$image-size: 500px;\n\n\nbody{\n\tbackground-color: #ccc;\n\n\tfont-family: 'Courier';\n\tfont-size: 12px;\n}\n\n\n\n#image-loader{\n\tdisplay: none;\n}\n\n#canvas{\n\tdisplay: block;\n\tposition: relative;\n\t\twidth: calc( #{$image-size} - 2*2px );\n\t\theight: calc( #{$image-size} - 2*2px );\n\n\tmargin: 20px;\n\n\tborder: 2px solid #000;\n}\n\n\n#log{\n\tdisplay: block;\n\tposition: relative;\n\t\twidth: calc( #{$image-size} - 2*2px - 2*10px );\n\n\tmargin: 10px 20px;\n\tpadding: 10px;\n\n\tborder: 2px solid #555;\n\n\tspan{\n\t\tdisplay: block;\n\t}\n\n}\n\n\n// ADDED TO DAT.GUI\n.dg.a .save-row{ background-color: #1a1a1a !important; }\n\n.dg li.save-row > select{\n\tbackground-color: #7d7d7d !important;\n\tcolor: #fff !important;\n\tborder: 0 !important;\n}\n\n.dg li.save-row > span{\n\tbackground-color: #303030 !important;\n\tbox-shadow: none !important;\n\ttext-shadow: none !important;\n}\n" + "$image-size: 500px;\n\n\nbody{\n\tbackground-color: #ccc;\n\n\tfont-family: 'Courier';\n\tfont-size: 12px;\n}\n\n#loader{\n\tdisplay: block;\n\tposition: absolute;\n\twidth: 500px;\n\theight: 500px;\n\tmargin-left: 20px;\n\tbackground: url('../../src/loader.svg') center center no-repeat;\n\tbackground-size: 0 0;\n\tz-index: 1;\n}\n\n#loader.active{\n\tbackground-size: 4em 4em;\n}\n\n#image-loader{\n\tdisplay: none;\n}\n\n#canvas{\n\tdisplay: block;\n\tposition: relative;\n\t\twidth: calc( #{$image-size} - 2*2px );\n\t\theight: calc( #{$image-size} - 2*2px );\n\n\tmargin: 20px;\n\n\tborder: 2px solid #000;\n}\n\n\n#log{\n\tdisplay: block;\n\tposition: relative;\n\t\twidth: calc( #{$image-size} - 2*2px - 2*10px );\n\n\tmargin: 10px 20px;\n\tpadding: 10px;\n\n\tborder: 2px solid #555;\n\n\tspan{\n\t\tdisplay: block;\n\t}\n\n}\n\n\n// ADDED TO DAT.GUI\n.dg.a .save-row{ background-color: #1a1a1a !important; }\n\n.dg li.save-row > select{\n\tbackground-color: #7d7d7d !important;\n\tcolor: #fff !important;\n\tborder: 0 !important;\n}\n\n.dg li.save-row > span{\n\tbackground-color: #303030 !important;\n\tbox-shadow: none !important;\n\ttext-shadow: none !important;\n}\n" ], - "mappings": "AAGA,AAAA,IAAI,AAAA,CACH,gBAAgB,CAAE,IAAK,CAEvB,WAAW,CAAE,SAAU,CACvB,SAAS,CAAE,IAAK,CAChB,AAID,AAAA,aAAa,AAAA,CACZ,OAAO,CAAE,IAAK,CACd,AAED,AAAA,OAAO,AAAA,CACN,OAAO,CAAE,KAAM,CACf,QAAQ,CAAE,QAAS,CAClB,KAAK,CAAE,oBAAI,CACX,MAAM,CAAE,oBAAI,CAEb,MAAM,CAAE,IAAK,CAEb,MAAM,CAAE,cAAe,CACvB,AAGD,AAAA,IAAI,AAAA,CACH,OAAO,CAAE,KAAM,CACf,QAAQ,CAAE,QAAS,CAClB,KAAK,CAAE,6BAAI,CAEZ,MAAM,CAAE,SAAU,CAClB,OAAO,CAAE,IAAK,CAEd,MAAM,CAAE,cAAe,CAMvB,AAdD,AAUC,IAVG,CAUH,IAAI,AAAA,CACH,OAAO,CAAE,KAAM,CACf,AAMF,AAAM,GAAH,AAAA,EAAE,CAAC,SAAS,AAAA,CAAE,gBAAgB,CAAE,kBAAmB,CAAI,AAE1D,AAAkB,GAAf,CAAC,EAAE,AAAA,SAAS,CAAG,MAAM,AAAA,CACvB,gBAAgB,CAAE,kBAAmB,CACrC,KAAK,CAAE,eAAgB,CACvB,MAAM,CAAE,YAAa,CACrB,AAED,AAAkB,GAAf,CAAC,EAAE,AAAA,SAAS,CAAG,IAAI,AAAA,CACrB,gBAAgB,CAAE,kBAAmB,CACrC,UAAU,CAAE,eAAgB,CAC5B,WAAW,CAAE,eAAgB,CAC7B", + "mappings": "AAGA,AAAA,IAAI,AAAA,CACH,gBAAgB,CAAE,IAAK,CAEvB,WAAW,CAAE,SAAU,CACvB,SAAS,CAAE,IAAK,CAChB,AAED,AAAA,OAAO,AAAA,CACN,OAAO,CAAE,KAAM,CACf,QAAQ,CAAE,QAAS,CACnB,KAAK,CAAE,KAAM,CACb,MAAM,CAAE,KAAM,CACd,WAAW,CAAE,IAAK,CAClB,UAAU,CAAE,2BAAG,CAAyB,MAAM,CAAC,MAAM,CAAC,SAAS,CAC/D,eAAe,CAAE,GAAI,CACrB,OAAO,CAAE,CAAE,CACX,AAED,AAAO,OAAA,AAAA,OAAO,AAAA,CACb,eAAe,CAAE,OAAQ,CACzB,AAED,AAAA,aAAa,AAAA,CACZ,OAAO,CAAE,IAAK,CACd,AAED,AAAA,OAAO,AAAA,CACN,OAAO,CAAE,KAAM,CACf,QAAQ,CAAE,QAAS,CAClB,KAAK,CAAE,oBAAI,CACX,MAAM,CAAE,oBAAI,CAEb,MAAM,CAAE,IAAK,CAEb,MAAM,CAAE,cAAe,CACvB,AAGD,AAAA,IAAI,AAAA,CACH,OAAO,CAAE,KAAM,CACf,QAAQ,CAAE,QAAS,CAClB,KAAK,CAAE,6BAAI,CAEZ,MAAM,CAAE,SAAU,CAClB,OAAO,CAAE,IAAK,CAEd,MAAM,CAAE,cAAe,CAMvB,AAdD,AAUC,IAVG,CAUH,IAAI,AAAA,CACH,OAAO,CAAE,KAAM,CACf,AAMF,AAAM,GAAH,AAAA,EAAE,CAAC,SAAS,AAAA,CAAE,gBAAgB,CAAE,kBAAmB,CAAI,AAE1D,AAAkB,GAAf,CAAC,EAAE,AAAA,SAAS,CAAG,MAAM,AAAA,CACvB,gBAAgB,CAAE,kBAAmB,CACrC,KAAK,CAAE,eAAgB,CACvB,MAAM,CAAE,YAAa,CACrB,AAED,AAAkB,GAAf,CAAC,EAAE,AAAA,SAAS,CAAG,IAAI,AAAA,CACrB,gBAAgB,CAAE,kBAAmB,CACrC,UAAU,CAAE,eAAgB,CAC5B,WAAW,CAAE,eAAgB,CAC7B", "names": [] } \ No newline at end of file diff --git a/public_html/index.php b/public_html/index.php index 207bb01..915cdcf 100644 --- a/public_html/index.php +++ b/public_html/index.php @@ -32,7 +32,6 @@ - @@ -51,9 +50,13 @@ + + +
+ diff --git a/public_html/js/action-script.js b/public_html/js/action-script.js index 0ed8bb3..f44108b 100644 --- a/public_html/js/action-script.js +++ b/public_html/js/action-script.js @@ -17,9 +17,9 @@ /* (1) Elements du DOM */ var DOM = { - body: $('body'), - canvas: $('canvas'), - imageLoader: $('#image-loader') + body: $('body'), + canvas: $('canvas'), + imageLoader: $('#image-loader') }; /* (3) Canvas initialisation */ @@ -35,15 +35,13 @@ var exec = false; var last; var featureTrackerTask; - var faceTrackerTask; var trackerCallback; - var Controller, + var Controller, CFolder = {}, init, - zones = {feature: [], face: []}, + zones = {feature: []}, track, featureTracker, - faceTracker, initialized = false; } @@ -68,37 +66,30 @@ ControllerRememberer.fetch(function(loaded_data){ initialized = true; /* (3) Attachment to dat.GUI */ - Controller.addFolder('Source Picture'); + CFolder.src = Controller.addFolder('Source Picture'); Controller.remember(this); - Controller.add(this, 'src', this._images).listen(); + CFolder.src.add(this, 'src', this._images).listen(); }; /* (2) Gestion de tracking.js */ zones.feature = []; - zones.face = []; /* (3) Gestion du track de l'image */ track = { trackFeatures: function(){ + LOADER.start(); zones.feature = []; featureTrackerTask = tracking.track(_CAN, featureTracker); - }, - - trackFace: function(){ - zones.face = []; - faceTrackerTask = tracking.track(_CAN, faceTracker); + LOADER.stop(); } + }; /* (4) Initializing `Tracking.js` */ - faceTracker = new tracking.ObjectTracker(['face']); featureTracker = new tracking.ObjectTracker(['eye', 'mouth']); - faceTracker.setInitialScale(1.0); featureTracker.setInitialScale(1.0); - faceTracker.setStepSize(1.2); featureTracker.setStepSize(1.2); - faceTracker.setEdgesDensity(0.1); featureTracker.setEdgesDensity(0.1); trackerCallback = function(z, e){ @@ -124,7 +115,6 @@ ControllerRememberer.fetch(function(loaded_data){ process.apply(DOM.imageLoader); } - faceTracker.on('track', function(e){ return trackerCallback.apply(this, ['face', e]); }); featureTracker.on('track', function(e){ return trackerCallback.apply(this, ['feature', e]); }); } @@ -132,18 +122,22 @@ ControllerRememberer.fetch(function(loaded_data){ /* [2] Routine principale =========================================================*/ + LOADER.init(); process = function(){ + // Si erreur de `bind()`, on quitte if( !initialized || !(this instanceof HTMLImageElement) ) return; console.time('PROCESS'); + LOADER.start(); + /* [0.0] Gestion du changement d'image =========================================================*/ if( this.src != last ){ - zones.face = []; - zones.feature = []; + reactiveFaceTracking.zones = []; + zones.feature = []; exec = false; last = this.src; } @@ -193,9 +187,6 @@ ControllerRememberer.fetch(function(loaded_data){ /* (5) Canny Filter */ filterManager.get('canny').apply(); - - /* (6) Haar Face Detection */ - filterManager.get('haar_face').apply(); } @@ -216,11 +207,11 @@ ControllerRememberer.fetch(function(loaded_data){ _CON.strokeRect(x, y, w, h); } - for( i in zones.face ){ - x = zones.face[i].x * _CAN.width; - y = zones.face[i].y * _CAN.height; - w = zones.face[i].w * _CAN.width; - h = zones.face[i].h * _CAN.height; + for( i in reactiveFaceTracking.zones ){ + 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'; @@ -236,6 +227,7 @@ ControllerRememberer.fetch(function(loaded_data){ } console.timeEnd('PROCESS'); + LOADER.stop(); }; @@ -246,15 +238,17 @@ ControllerRememberer.fetch(function(loaded_data){ filterManager = new ReactiveFilterManager(DOM.imageLoader, _CAN, process); /* (2) Ajout des filtres */ - 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); + 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); /* (3) Gestion des backups */ + Controller.remember(filterManager.get('face_tracking')); Controller.remember(filterManager.get('resolution')); Controller.remember(filterManager.get('contrast')); Controller.remember(filterManager.get('grayscale')); @@ -264,35 +258,43 @@ ControllerRememberer.fetch(function(loaded_data){ Controller.remember(filterManager.get('haar_face')); /* (4) On attache tout à dat.GUI */ - 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(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.add(filterManager.get('resolution'), 'width', 0, 2).step(0.1); - Controller.add(filterManager.get('resolution'), 'height', 0, 2).step(0.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'), 'sigma', 0, 10).step(0.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'); + CFolder.custom = Controller.addFolder('custom'); + CFolder.resolution = CFolder.custom.addFolder('Image Resolution'); + CFolder.resolution.add(filterManager.get('resolution'), 'width', 0, 2).step(0.1); + CFolder.resolution.add(filterManager.get('resolution'), 'height', 0, 2).step(0.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(0.5); + CFolder.face_tracking.add(filterManager.get('face_tracking'), 'step_size', 1, 5).step(0.5); + CFolder.face_tracking.add(filterManager.get('face_tracking'), 'edges_density', 0.1, 0.5).step(0.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(0.1); + CFolder.haar_face.add(filterManager.get('haar_face'), 'scale_factor', 1.1, 2).step(0.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', 0.01, 1.0).step(0.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(0.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'); /* (5) Gestion du @PermanentStorage */ diff --git a/public_html/js/lib/min/reactive-filter.js b/public_html/js/lib/min/reactive-filter.js index ad19d8a..7b5ce5a 100644 --- a/public_html/js/lib/min/reactive-filter.js +++ b/public_html/js/lib/min/reactive-filter.js @@ -1,20 +1,22 @@ -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 (), but "+ -a.constructor.name+" received");this._canvas=d instanceof HTMLCanvasElement?d:null;if(!this._canvas)throw Error("Param 2 expected to be an HTMLCanvasElement (), 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,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}; +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,c){return function(b){a._attr[c]=b;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 (), but "+ +a.constructor.name+" received");this._canvas=e instanceof HTMLCanvasElement?e:null;if(!this._canvas)throw Error("Param 2 expected to be an HTMLCanvasElement (), 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={}}; +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.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,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=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,d=this._manager._context,a=d.getImageData(0,0,a.width,a.height),e=a.data,b=this.contrast;1>31)-(g>>31)|0,agy=(k^k>>31)-(k>>31)|0,0agy?(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= -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,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;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,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;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=127+c&&(d[b]=255),d[b]<=127-c&&(d[b]=0));e.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,c=this.contrast;1>31)-(g>>31)|0,agy=(k^k>>31)-(k>>31)|0,0agy?(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= +l[a]*agy,p[a]=k>=n&&k>g?agy&255:0);data_u32=new Uint32Array(d.data.buffer);for(a=c.cols*c.rows;0<=--a;)data_u32[a]=-16777216|p[a]<<16|p[a]<<8|p[a];e.putImageData(d,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 c=new jsfeat.matrix_t(a.width,a.height,jsfeat.U8C1_t),b,f;jsfeat.imgproc.grayscale(d.data,a.width,a.height,c);jsfeat.imgproc.gaussian_blur(c,c,(this.radius|0)+1<<1,this.sigma);a=new Uint32Array(d.data.buffer);b=c.cols*c.rows;for(pix=0;0<=--b;)f=c.data[b],a[b]=-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}); +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),c=new jsfeat.matrix_t(a.width,a.height,jsfeat.U8C1_t),b,f;jsfeat.imgproc.grayscale(d.data,a.width,a.height,c);jsfeat.imgproc.gaussian_blur(c,c,(this.radius|0)+1<<1,0);jsfeat.imgproc.canny(c,c,this.low_threshold|0,this.high_threshold|0);a=new Uint32Array(d.data.buffer);b=c.cols*c.rows;for(pix=0;0<=--b;)f=c.data[b], +a[b]=-16777216|f<<16|f<<8|f;e.putImageData(d,0,0)}};var reactiveHaarFace=new ReactiveFilter({equalize_histogram:!0,use_canny:!1,edges_density:.13,scale_factor:1.15,min_scale:1.1}); +reactiveHaarFace.apply=function(){void 0===this.classifier&&(this.classifier=jsfeat.haar.frontalface);if(this._manager instanceof ReactiveFilterManager){LOADER.start();console.log($("#loader").className);var a=this._manager._canvas,e=this._manager._context,d=e.getImageData(0,0,a.width,a.height),c=new jsfeat.matrix_t(a.width,a.height,jsfeat.U8C1_t),b=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))},f;jsfeat.imgproc.grayscale(d.data,a.width,a.height,c);this.equalize_histogram&&jsfeat.imgproc.equalize_histogram(c,c);jsfeat.imgproc.compute_integral_image(c,b.sum,b.sqsum, +this.classifier.tilted?b.tilted:null);this.use_canny&&(jsfeat.imgproc.canny(c,b.edg,10,50),jsfeat.imgproc.compute_integral_image(b.edg,b.canny,null,null));jsfeat.haar.edges_density=this.edges_density;console.time("[Haar] detect_single_scale");b=jsfeat.haar.detect_multi_scale(b.sum,b.sqsum,b.tilted,this.use_canny?b.canny:null,c.cols,c.rows,this.classifier,this.scale_factor,this.min_scale);b=jsfeat.haar.group_rectangles(b,1);console.timeEnd("[Haar] detect_single_scale");f=b.length;c=a.width/c.cols; +console.warn("zones",b.length);f&&(e.lineWidth=5,e.strokeStyle="rgb(0,255,0)",e.strokeRect(b[0].x*c|0,b[0].y*c|0,b[0].width*c|0,b[0].height*c|0));e.putImageData(d,0,0);LOADER.stop();console.log($("#loader").className)}}; diff --git a/public_html/js/lib/min/reset.js b/public_html/js/lib/min/reset.js index 2ef9360..ad55307 100644 --- a/public_html/js/lib/min/reset.js +++ b/public_html/js/lib/min/reset.js @@ -1,2 +1,3 @@ -var $=function(a){return document.querySelector(a)},$$=function(a){return document.querySelectorAll(a)};Element.prototype.getData=function(a){return"undefined"==typeof this.dataset?!1:this.dataset.hasOwnProperty(a)?this.dataset[a]:!1};Element.prototype.addClass=function(a){var b=this.className.split(" ");-1 draw it */ - if( zones.length > 0 ) + console.warn('zones', zones.length); + if( on ){ + + o.context.lineWidth = 5; + o.context.strokeStyle = "rgb(0,255,0)"; + o.context.strokeRect( - (zones[0].x*sc) | 0, - (zones[0].y*sc) | 0, - (zones[0].width*sc) | 0, - (zones[0].height*sc) | 0 + (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 `` */ o.context.putImageData(imageData, 0, 0); + LOADER.stop(); + console.log($('#loader').className); + }; diff --git a/public_html/js/lib/reset.js b/public_html/js/lib/reset.js index d50e165..99279eb 100644 --- a/public_html/js/lib/reset.js +++ b/public_html/js/lib/reset.js @@ -1,6 +1,6 @@ /* SELECTEUR CSS UNIQUE/MULTIPLE */ -var $ = function(selector){ return document.querySelector(selector ); }; +var $ = function(selector){ return document.querySelector(selector ); }; var $$ = function(selector){ return document.querySelectorAll(selector); }; @@ -22,7 +22,6 @@ Element.prototype.getData = function(attribute){ }; - /* Ajout de classe pour un element (surcharge de l'ELEMENT natif) * * @className Classe a ajouter a l'element @@ -35,13 +34,15 @@ Element.prototype.addClass = function(className){ /* [2] On ajoute la classe si elle n'y est pas deja ====================================================*/ - if( classArray.indexOf(className) > -1 ) return; // La classe y est deja + if( classArray.indexOf(className) > -1 ) return false; // La classe y est deja classArray.push(className); /* [3] On reformatte tout ====================================================*/ this.className = classArray.join(' ').trim(); + + return true; }; @@ -59,13 +60,15 @@ Element.prototype.remClass = function(className){ ====================================================*/ var index = classArray.indexOf(className); - if( index == -1 ) return; // La classe n'y est pas + if( index == -1 ) return false; // La classe n'y est pas classArray = classArray.slice(0,index).concat( classArray.slice(index+1) ); /* [3] On reformatte tout ====================================================*/ this.className = classArray.join(' ').trim(); + + return true; }; @@ -80,7 +83,6 @@ NodeList.prototype.indexOf = HTMLCollection.prototype.indexOf = function(searche }; - // GESTION DES ANIMATIONS (CLASSE PENDANT TEMPS IMPARTI) Element.prototype.anim = function(className, timeout){ @@ -92,3 +94,13 @@ Element.prototype.anim = function(className, timeout){ setTimeout(function(){ pointer.remClass(className); }, timeout); }; + + +var LOADER = new (function(){ + var loader = null; + + this.init = function(){ loader = $('#loader'); }; + this.start = function(){ loader && (loader.className = 'active'); }; + this.stop = function(){ loader && (loader.className = ''); }; + +})(); diff --git a/public_html/js/min/action-script.js b/public_html/js/min/action-script.js index 8fd1299..648895c 100644 --- a/public_html/js/min/action-script.js +++ b/public_html/js/min/action-script.js @@ -1,11 +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,featureTrackerTask,faceTrackerTask,trackerCallback,Controller,init,zones={feature:[],face:[]},track,featureTracker,faceTracker,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;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})}); -0 + + + + + + + + + + + + + + + + + + +