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 (