l3
/
face-recognition.js
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Gestion de la ratio (width + height) [public_html/js/action-script.js]

This commit is contained in:
xdrm-brackets 2016-10-05 15:04:48 +02:00
parent 455d0253ef
commit 1bbb537bf0
10 changed files with 100 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
public_html/css/expanded/layout.css
View File

@ -4,7 +4,11 @@ body {
font-size: 12px;
}
#image {
#image-loader {
display: none;
}
#canvas {
display: block;
position: relative;
width: calc( 300px - 2*2px);
@ -26,4 +30,4 @@ body {
display: block;
}
/*# sourceMappingURL=data:application/json;base64,ewoJInZlcnNpb24iOiAzLAoJImZpbGUiOiAibGF5b3V0LmNzcyIsCgkic291cmNlcyI6IFsKCQkiLi4vbGF5b3V0LnNjc3MiCgldLAoJInNvdXJjZXNDb250ZW50IjogWwoJCSIkaW1hZ2Utc2l6ZTogMzAwcHg7XG5cblxuYm9keXtcblx0YmFja2dyb3VuZC1jb2xvcjogI2NjYztcblxuXHRmb250LWZhbWlseTogJ0NvdXJpZXInO1xuXHRmb250LXNpemU6IDEycHg7XG59XG5cblxuXG4jaW1hZ2V7XG5cdGRpc3BsYXk6IGJsb2NrO1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdFx0d2lkdGg6IGNhbGMoICN7JGltYWdlLXNpemV9IC0gMioycHggKTtcblx0XHRoZWlnaHQ6IGNhbGMoICN7JGltYWdlLXNpemV9IC0gMioycHggKTtcblxuXHRtYXJnaW46IDIwcHg7XG5cblx0Ym9yZGVyOiAycHggc29saWQgIzAwMDtcbn1cblxuXG4jbG9ne1xuXHRkaXNwbGF5OiBibG9jaztcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRcdHdpZHRoOiBjYWxjKCAjeyRpbWFnZS1zaXplfSAtIDIqMnB4IC0gMioxMHB4ICk7XG5cblx0bWFyZ2luOiAxMHB4IDIwcHg7XG5cdHBhZGRpbmc6IDEwcHg7XG5cblx0Ym9yZGVyOiAycHggc29saWQgIzU1NTtcblxuXHRzcGFue1xuXHRcdGRpc3BsYXk6IGJsb2NrO1xuXHR9XG5cbn1cbiIKCV0sCgkibWFwcGluZ3MiOiAiQUFHQSxBQUFBLElBQUksQ0FBQTtFQUNILGdCQUFnQixFQUFFLElBQUs7RUFFdkIsV0FBVyxFQUFFLFNBQVU7RUFDdkIsU0FBUyxFQUFFLElBQUs7Q0FDaEI7O0FBSUQsQUFBQSxNQUFNLENBQUE7RUFDTCxPQUFPLEVBQUUsS0FBTTtFQUNmLFFBQVEsRUFBRSxRQUFTO0VBQ2xCLEtBQUssRUFBRSxvQkFBSTtFQUNYLE1BQU0sRUFBRSxvQkFBSTtFQUViLE1BQU0sRUFBRSxJQUFLO0VBRWIsTUFBTSxFQUFFLGNBQWU7Q0FDdkI7O0FBR0QsQUFBQSxJQUFJLENBQUE7RUFDSCxPQUFPLEVBQUUsS0FBTTtFQUNmLFFBQVEsRUFBRSxRQUFTO0VBQ2xCLEtBQUssRUFBRSw2QkFBSTtFQUVaLE1BQU0sRUFBRSxTQUFVO0VBQ2xCLE9BQU8sRUFBRSxJQUFLO0VBRWQsTUFBTSxFQUFFLGNBQWU7Q0FNdkI7O0FBZEQsQUFVQyxJQVZHLENBVUgsSUFBSSxDQUFBO0VBQ0gsT0FBTyxFQUFFLEtBQU07Q0FDZiIsCgkibmFtZXMiOiBbXQp9 */
/*# sourceMappingURL=data:application/json;base64,ewoJInZlcnNpb24iOiAzLAoJImZpbGUiOiAibGF5b3V0LmNzcyIsCgkic291cmNlcyI6IFsKCQkiLi4vbGF5b3V0LnNjc3MiCgldLAoJInNvdXJjZXNDb250ZW50IjogWwoJCSIkaW1hZ2Utc2l6ZTogMzAwcHg7XG5cblxuYm9keXtcblx0YmFja2dyb3VuZC1jb2xvcjogI2NjYztcblxuXHRmb250LWZhbWlseTogJ0NvdXJpZXInO1xuXHRmb250LXNpemU6IDEycHg7XG59XG5cblxuXG4jaW1hZ2UtbG9hZGVye1xuXHRkaXNwbGF5OiBub25lO1xufVxuXG4jY2FudmFze1xuXHRkaXNwbGF5OiBibG9jaztcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRcdHdpZHRoOiBjYWxjKCAjeyRpbWFnZS1zaXplfSAtIDIqMnB4ICk7XG5cdFx0aGVpZ2h0OiBjYWxjKCAjeyRpbWFnZS1zaXplfSAtIDIqMnB4ICk7XG5cblx0bWFyZ2luOiAyMHB4O1xuXG5cdGJvcmRlcjogMnB4IHNvbGlkICMwMDA7XG59XG5cblxuI2xvZ3tcblx0ZGlzcGxheTogYmxvY2s7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0XHR3aWR0aDogY2FsYyggI3skaW1hZ2Utc2l6ZX0gLSAyKjJweCAtIDIqMTBweCApO1xuXG5cdG1hcmdpbjogMTBweCAyMHB4O1xuXHRwYWRkaW5nOiAxMHB4O1xuXG5cdGJvcmRlcjogMnB4IHNvbGlkICM1NTU7XG5cblx0c3Bhbntcblx0XHRkaXNwbGF5OiBibG9jaztcblx0fVxuXG59XG4iCgldLAoJIm1hcHBpbmdzIjogIkFBR0EsQUFBQSxJQUFJLENBQUE7RUFDSCxnQkFBZ0IsRUFBRSxJQUFLO0VBRXZCLFdBQVcsRUFBRSxTQUFVO0VBQ3ZCLFNBQVMsRUFBRSxJQUFLO0NBQ2hCOztBQUlELEFBQUEsYUFBYSxDQUFBO0VBQ1osT0FBTyxFQUFFLElBQUs7Q0FDZDs7QUFFRCxBQUFBLE9BQU8sQ0FBQTtFQUNOLE9BQU8sRUFBRSxLQUFNO0VBQ2YsUUFBUSxFQUFFLFFBQVM7RUFDbEIsS0FBSyxFQUFFLG9CQUFJO0VBQ1gsTUFBTSxFQUFFLG9CQUFJO0VBRWIsTUFBTSxFQUFFLElBQUs7RUFFYixNQUFNLEVBQUUsY0FBZTtDQUN2Qjs7QUFHRCxBQUFBLElBQUksQ0FBQTtFQUNILE9BQU8sRUFBRSxLQUFNO0VBQ2YsUUFBUSxFQUFFLFFBQVM7RUFDbEIsS0FBSyxFQUFFLDZCQUFJO0VBRVosTUFBTSxFQUFFLFNBQVU7RUFDbEIsT0FBTyxFQUFFLElBQUs7RUFFZCxNQUFNLEVBQUUsY0FBZTtDQU12Qjs7QUFkRCxBQVVDLElBVkcsQ0FVSCxJQUFJLENBQUE7RUFDSCxPQUFPLEVBQUUsS0FBTTtDQUNmIiwKCSJuYW1lcyI6IFtdCn0= */

4
public_html/css/expanded/layout.css.map
View File

@ -5,8 +5,8 @@
"../layout.scss"
],
"sourcesContent": [
"$image-size: 300px;\n\n\nbody{\n\tbackground-color: #ccc;\n\n\tfont-family: 'Courier';\n\tfont-size: 12px;\n}\n\n\n\n#image{\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"
"$image-size: 300px;\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"
],
"mappings": "AAGA,AAAA,IAAI,CAAA;EACH,gBAAgB,EAAE,IAAK;EAEvB,WAAW,EAAE,SAAU;EACvB,SAAS,EAAE,IAAK;CAChB;;AAID,AAAA,MAAM,CAAA;EACL,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",
"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",
"names": []
}

6
public_html/css/layout.scss
View File

@ -10,7 +10,11 @@ body{
#image{
#image-loader{
display: none;
}
#canvas{
display: block;
position: relative;
width: calc( #{$image-size} - 2*2px );

4
public_html/css/min/layout.css
View File

@ -1,3 +1,3 @@
body{background-color:#ccc;font-family:'Courier';font-size:12px}#image{display:block;position:relative;width:calc( 300px - 2*2px);height:calc( 300px - 2*2px);margin:20px;border:2px solid #000}#log{display:block;position:relative;width:calc( 300px - 2*2px - 2*10px);margin:10px 20px;padding:10px;border:2px solid #555}#log span{display:block}
body{background-color:#ccc;font-family:'Courier';font-size:12px}#image-loader{display:none}#canvas{display:block;position:relative;width:calc( 300px - 2*2px);height:calc( 300px - 2*2px);margin:20px;border:2px solid #000}#log{display:block;position:relative;width:calc( 300px - 2*2px - 2*10px);margin:10px 20px;padding:10px;border:2px solid #555}#log span{display:block}
/*# sourceMappingURL=data:application/json;base64,ewoJInZlcnNpb24iOiAzLAoJImZpbGUiOiAibGF5b3V0LmNzcyIsCgkic291cmNlcyI6IFsKCQkiLi4vbGF5b3V0LnNjc3MiCgldLAoJInNvdXJjZXNDb250ZW50IjogWwoJCSIkaW1hZ2Utc2l6ZTogMzAwcHg7XG5cblxuYm9keXtcblx0YmFja2dyb3VuZC1jb2xvcjogI2NjYztcblxuXHRmb250LWZhbWlseTogJ0NvdXJpZXInO1xuXHRmb250LXNpemU6IDEycHg7XG59XG5cblxuXG4jaW1hZ2V7XG5cdGRpc3BsYXk6IGJsb2NrO1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdFx0d2lkdGg6IGNhbGMoICN7JGltYWdlLXNpemV9IC0gMioycHggKTtcblx0XHRoZWlnaHQ6IGNhbGMoICN7JGltYWdlLXNpemV9IC0gMioycHggKTtcblxuXHRtYXJnaW46IDIwcHg7XG5cblx0Ym9yZGVyOiAycHggc29saWQgIzAwMDtcbn1cblxuXG4jbG9ne1xuXHRkaXNwbGF5OiBibG9jaztcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRcdHdpZHRoOiBjYWxjKCAjeyRpbWFnZS1zaXplfSAtIDIqMnB4IC0gMioxMHB4ICk7XG5cblx0bWFyZ2luOiAxMHB4IDIwcHg7XG5cdHBhZGRpbmc6IDEwcHg7XG5cblx0Ym9yZGVyOiAycHggc29saWQgIzU1NTtcblxuXHRzcGFue1xuXHRcdGRpc3BsYXk6IGJsb2NrO1xuXHR9XG5cbn1cbiIKCV0sCgkibWFwcGluZ3MiOiAiQUFHQSxBQUFBLElBQUksQUFBQSxDQUNILGdCQUFnQixDQUFFLElBQUssQ0FFdkIsV0FBVyxDQUFFLFNBQVUsQ0FDdkIsU0FBUyxDQUFFLElBQUssQ0FDaEIsQUFJRCxBQUFBLE1BQU0sQUFBQSxDQUNMLE9BQU8sQ0FBRSxLQUFNLENBQ2YsUUFBUSxDQUFFLFFBQVMsQ0FDbEIsS0FBSyxDQUFFLG9CQUFJLENBQ1gsTUFBTSxDQUFFLG9CQUFJLENBRWIsTUFBTSxDQUFFLElBQUssQ0FFYixNQUFNLENBQUUsY0FBZSxDQUN2QixBQUdELEFBQUEsSUFBSSxBQUFBLENBQ0gsT0FBTyxDQUFFLEtBQU0sQ0FDZixRQUFRLENBQUUsUUFBUyxDQUNsQixLQUFLLENBQUUsNkJBQUksQ0FFWixNQUFNLENBQUUsU0FBVSxDQUNsQixPQUFPLENBQUUsSUFBSyxDQUVkLE1BQU0sQ0FBRSxjQUFlLENBTXZCLEFBZEQsQUFVQyxJQVZHLENBVUgsSUFBSSxBQUFBLENBQ0gsT0FBTyxDQUFFLEtBQU0sQ0FDZiIsCgkibmFtZXMiOiBbXQp9 */
/*# sourceMappingURL=data:application/json;base64,ewoJInZlcnNpb24iOiAzLAoJImZpbGUiOiAibGF5b3V0LmNzcyIsCgkic291cmNlcyI6IFsKCQkiLi4vbGF5b3V0LnNjc3MiCgldLAoJInNvdXJjZXNDb250ZW50IjogWwoJCSIkaW1hZ2Utc2l6ZTogMzAwcHg7XG5cblxuYm9keXtcblx0YmFja2dyb3VuZC1jb2xvcjogI2NjYztcblxuXHRmb250LWZhbWlseTogJ0NvdXJpZXInO1xuXHRmb250LXNpemU6IDEycHg7XG59XG5cblxuXG4jaW1hZ2UtbG9hZGVye1xuXHRkaXNwbGF5OiBub25lO1xufVxuXG4jY2FudmFze1xuXHRkaXNwbGF5OiBibG9jaztcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRcdHdpZHRoOiBjYWxjKCAjeyRpbWFnZS1zaXplfSAtIDIqMnB4ICk7XG5cdFx0aGVpZ2h0OiBjYWxjKCAjeyRpbWFnZS1zaXplfSAtIDIqMnB4ICk7XG5cblx0bWFyZ2luOiAyMHB4O1xuXG5cdGJvcmRlcjogMnB4IHNvbGlkICMwMDA7XG59XG5cblxuI2xvZ3tcblx0ZGlzcGxheTogYmxvY2s7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0XHR3aWR0aDogY2FsYyggI3skaW1hZ2Utc2l6ZX0gLSAyKjJweCAtIDIqMTBweCApO1xuXG5cdG1hcmdpbjogMTBweCAyMHB4O1xuXHRwYWRkaW5nOiAxMHB4O1xuXG5cdGJvcmRlcjogMnB4IHNvbGlkICM1NTU7XG5cblx0c3Bhbntcblx0XHRkaXNwbGF5OiBibG9jaztcblx0fVxuXG59XG4iCgldLAoJIm1hcHBpbmdzIjogIkFBR0EsQUFBQSxJQUFJLEFBQUEsQ0FDSCxnQkFBZ0IsQ0FBRSxJQUFLLENBRXZCLFdBQVcsQ0FBRSxTQUFVLENBQ3ZCLFNBQVMsQ0FBRSxJQUFLLENBQ2hCLEFBSUQsQUFBQSxhQUFhLEFBQUEsQ0FDWixPQUFPLENBQUUsSUFBSyxDQUNkLEFBRUQsQUFBQSxPQUFPLEFBQUEsQ0FDTixPQUFPLENBQUUsS0FBTSxDQUNmLFFBQVEsQ0FBRSxRQUFTLENBQ2xCLEtBQUssQ0FBRSxvQkFBSSxDQUNYLE1BQU0sQ0FBRSxvQkFBSSxDQUViLE1BQU0sQ0FBRSxJQUFLLENBRWIsTUFBTSxDQUFFLGNBQWUsQ0FDdkIsQUFHRCxBQUFBLElBQUksQUFBQSxDQUNILE9BQU8sQ0FBRSxLQUFNLENBQ2YsUUFBUSxDQUFFLFFBQVMsQ0FDbEIsS0FBSyxDQUFFLDZCQUFJLENBRVosTUFBTSxDQUFFLFNBQVUsQ0FDbEIsT0FBTyxDQUFFLElBQUssQ0FFZCxNQUFNLENBQUUsY0FBZSxDQU12QixBQWRELEFBVUMsSUFWRyxDQVVILElBQUksQUFBQSxDQUNILE9BQU8sQ0FBRSxLQUFNLENBQ2YiLAoJIm5hbWVzIjogW10KfQ== */

4
public_html/css/min/layout.css.map
View File

@ -5,8 +5,8 @@
"../layout.scss"
],
"sourcesContent": [
"$image-size: 300px;\n\n\nbody{\n\tbackground-color: #ccc;\n\n\tfont-family: 'Courier';\n\tfont-size: 12px;\n}\n\n\n\n#image{\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"
"$image-size: 300px;\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"
],
"mappings": "AAGA,AAAA,IAAI,AAAA,CACH,gBAAgB,CAAE,IAAK,CAEvB,WAAW,CAAE,SAAU,CACvB,SAAS,CAAE,IAAK,CAChB,AAID,AAAA,MAAM,AAAA,CACL,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",
"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",
"names": []
}

4
public_html/index.php
View File

@ -31,7 +31,9 @@
</head>
<body>
<img id='image'/>
<img id='image-loader'/>
<canvas id='canvas'></canvas>
<div id='log'></div>

79
public_html/js/action-script.js
View File

@ -1,29 +1,96 @@
/* [0] Initialisation
=========================================================*/
/* (1) Elements du DOM */
var DOM = {
body: $('body'),
img: $('img')
canvas: $('canvas'),
imageLoader: $('#image-loader')
};
/* (2) dat.GUI initialization */
var Controller = new dat.GUI();
/* (3) Canvas initialisation */
var _CAN = DOM.canvas;
_CAN.width = _CAN.height = 1000;
var _CON = _CAN.getContext('2d');
/* (4) Image Loader + Définitions */
var iL;
var process;
/* [1] Initialisation
=========================================================*/
var init = function(){
/* (1) Image par défaut */
this.src = 'front:male:1.jpg';
Controller.add(this, 'src', this._images);
/* (2) Attachement de dat.GUI */
Controller.addFolder('image source');
Controller.add(this, 'src', this._images).listen();
};
/* (x) Variables globales
---------------------------------------------------------*/
var pixelRatio = {
initialized: false,
init: function(){
if( this.initialized )
return;
this.initialized = true;
this._w = this._h = 0.9;
this.width = this.height = null;
this.__defineGetter__('width', function(){ return this._w; });
this.__defineGetter__('height', function(){ return this._h; });
this.__defineSetter__('width', function(v){ this._w = v; process.bind(iL._wrapper)(); });
this.__defineSetter__('height', function(v){ this._h = v; process.bind(iL._wrapper)(); });
Controller.add(this, 'width', 0, 2).listen();
Controller.add(this, 'height', 0, 2).listen();
}
};
/* [2] Routine principale
=========================================================*/
var process = function(){
var count = 0;
process = function(){
console.warn('PROCESS');
// TODO: Code here
log('Image loaded');
if( !count ){
this.defaultWidth = this.width;
this.defaultHeight = this.height;
log('Image copied', '[Canvas]');
}
count++;
/* [0] On efface le Canvas
=========================================================*/
_CON.clearRect(0, 0, _CAN.width, _CAN.height);
/* [1] Copie sur le canvas
=========================================================*/
pixelRatio.init();
this.width = this.defaultWidth * (pixelRatio.width * _CAN.width / this.defaultWidth);
this.height = this.defaultHeight * (pixelRatio.height * _CAN.height / this.defaultHeight);
_CON.drawImage(this, 0, 0, this.width, this.height);
};
@ -31,4 +98,4 @@ var process = function(){
/* [x] Chargement image
=========================================================*/
var iL = new ImageLoader( DOM.img, init, process );
iL = new ImageLoader( DOM.imageLoader, init, process );

3
public_html/js/lib/image-loader.js
View File

@ -71,7 +71,8 @@ ImageLoader.prototype._load = function(){
/* [1] On charge l'image + callback
=========================================================*/
this._wrapper.addEventListener('load', this._process.bind(this), false);
this._wrapper.addEventListener('load', this._process.bind(this._wrapper), false);
this._wrapper.src = './pictures/' + this.src.replace(/:/g, '/');
return true;

2
public_html/js/lib/min/image-loader.js
View File

@ -1,3 +1,3 @@
var ImageLoader=function(a,b){this._wrapper=a instanceof HTMLImageElement?a:null;this._src=this.src=null;this._callback="function"!=typeof b?function(){}:b;this._process="function"!=typeof process?function(){}:process;this._loaded=!1;if(!this._wrapper)throw Error("Param 1 expected to be an HTMLImageElement (<img>), but "+a.constructor.name+" received");this.__defineSetter__("src",function(a){log("src update","[ImageLoader]");this._src=a;this._load()});this.__defineGetter__("src",function(){return this._src});
AJAX.send("./pictures/index.php",function(a){this._images=JSON.parse(a);this._loaded=!0;log("initialized","[ImageLoader]");this._callback.call(this)}.bind(this),"GET")};
ImageLoader.prototype._load=function(){if(!this._loaded)throw Error("image tree not loaded yet");if("string"!=typeof this.src)throw Error("ImageLoader.src expected to be a <String>");if("function"!=typeof this._callback)throw Error("ImageLoader.callback expected to be a <Function>");if(~this._images.indexOf(this.src))return this._wrapper.addEventListener("load",this._process.bind(this),!1),this._wrapper.src="./pictures/"+this.src.replace(/:/g,"/"),!0;console.warn("Resource "+this.src+" not found!")};
ImageLoader.prototype._load=function(){if(!this._loaded)throw Error("image tree not loaded yet");if("string"!=typeof this.src)throw Error("ImageLoader.src expected to be a <String>");if("function"!=typeof this._callback)throw Error("ImageLoader.callback expected to be a <Function>");if(~this._images.indexOf(this.src))return this._wrapper.addEventListener("load",this._process.bind(this._wrapper),!1),this._wrapper.src="./pictures/"+this.src.replace(/:/g,"/"),!0;console.warn("Resource "+this.src+" not found!")};

5
public_html/js/min/action-script.js
View File

@ -1 +1,4 @@
var DOM={body:$("body"),img:$("img")},Controller=new dat.GUI,init=function(){this.src="front:male:1.jpg";Controller.add(this,"src",this._images)},process=function(){console.warn("PROCESS");log("Image loaded")},iL=new ImageLoader(DOM.img,init,process);
var DOM={body:$("body"),canvas:$("canvas"),imageLoader:$("#image-loader")},Controller=new dat.GUI,_CAN=DOM.canvas;_CAN.width=_CAN.height=1E3;
var _CON=_CAN.getContext("2d"),iL,process,init=function(){this.src="front:male:1.jpg";Controller.addFolder("image source");Controller.add(this,"src",this._images).listen()},pixelRatio={initialized:!1,init:function(){this.initialized||(this.initialized=!0,this._w=this._h=.9,this.width=this.height=null,this.__defineGetter__("width",function(){return this._w}),this.__defineGetter__("height",function(){return this._h}),this.__defineSetter__("width",function(a){this._w=a;process.bind(iL._wrapper)()}),
this.__defineSetter__("height",function(a){this._h=a;process.bind(iL._wrapper)()}),Controller.add(this,"width",0,2).listen(),Controller.add(this,"height",0,2).listen())}},count=0;
process=function(){console.warn("PROCESS");count||(this.defaultWidth=this.width,this.defaultHeight=this.height,log("Image copied","[Canvas]"));count++;_CON.clearRect(0,0,_CAN.width,_CAN.height);pixelRatio.init();this.width=pixelRatio.width*_CAN.width/this.defaultWidth*this.defaultWidth;this.height=pixelRatio.height*_CAN.height/this.defaultHeight*this.defaultHeight;_CON.drawImage(this,0,0,this.width,this.height)};iL=new ImageLoader(DOM.imageLoader,init,process);