jennschiffer.com / make8bitart
make8bitart.com
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

Merge pull request #2 from jennschiffer/remove-jquery

Remove jquery, improve lighthouse score

authored by

santa claus and committed by
GitHub 312323be 1d3e10e5

+1321 -1021
+2 -3
Gruntfile.js
··· 13 13 css: { 14 14 src: ["src/css/libs/*.css", "src/css/app/*.css"], 15 15 dest: "build/make8bitart.css", 16 - } 16 + }, 17 17 }, 18 18 19 19 uglify: { 20 20 build: { 21 21 src: [ 22 - "src/js/libs/jquery-3.2.1.min.js", 23 - "src/js/libs/draggybits.js", 22 + "src/js/libs/draggydivs.js", 24 23 "src/js/libs/keymaster.js", 25 24 "src/js/app/make8bitart.js", 26 25 ],
+1 -1
README.md
··· 8 8 9 9 ## dependencies 10 10 11 - make8bitart.com uses jQuery and a jQuery plugin I wrote: [draggybits](https://github.com/jennschiffer/draggybits). The local dev dependencies are Express and Grunt, along with the various Grunt plugins. 11 + make8bitart.com uses a plugin I wrote, draggydivs, to move the windows around. The local dev dependencies are Express and Grunt, along with the various Grunt plugins. 12 12 13 13 ## misc notes 14 14
+9 -9
package-lock.json
··· 93 93 } 94 94 }, 95 95 "node_modules/brace-expansion": { 96 - "version": "1.1.11", 97 - "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", 98 - "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", 96 + "version": "1.1.12", 97 + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz", 98 + "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==", 99 99 "dependencies": { 100 100 "balanced-match": "^1.0.0", 101 101 "concat-map": "0.0.1" ··· 1153 1153 } 1154 1154 }, 1155 1155 "node_modules/js-yaml": { 1156 - "version": "3.14.1", 1157 - "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.14.1.tgz", 1158 - "integrity": "sha512-okMH7OXXJ7YrN9Ok3/SXrnu4iX9yOk+25nqX4imS2npuvTYDmo/QEZoqwZkYaIDk3jVvBOTOIEgEhaLOynBS9g==", 1156 + "version": "3.14.2", 1157 + "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.14.2.tgz", 1158 + "integrity": "sha512-PMSmkqxr106Xa156c2M265Z+FTrPl+oxd/rgOQy2tijQeK5TxQ43psO1ZCwhVOSdnn+RzkzlRz/eY4BgJBYVpg==", 1159 1159 "dependencies": { 1160 1160 "argparse": "^1.0.7", 1161 1161 "esprima": "^4.0.0" ··· 1514 1514 } 1515 1515 }, 1516 1516 "node_modules/qs": { 1517 - "version": "6.14.0", 1518 - "resolved": "https://registry.npmjs.org/qs/-/qs-6.14.0.tgz", 1519 - "integrity": "sha512-YWWTjgABSKcvs/nWBi9PycY/JiPJqOD4JA6o9Sej2AtvSGarXxKC3OQSk4pAarbdQlKAh5D4FCQkJNkW+GAn3w==", 1517 + "version": "6.14.1", 1518 + "resolved": "https://registry.npmjs.org/qs/-/qs-6.14.1.tgz", 1519 + "integrity": "sha512-4EK3+xJl8Ts67nLYNwqw/dsFVnCf+qR7RgXSK9jEEm9unao3njwMDdmsdvoKBKHzxd7tCYz5e5M+SnMjdtXGQQ==", 1520 1520 "dependencies": { 1521 1521 "side-channel": "^1.1.0" 1522 1522 },
+1 -1
package.json
··· 1 1 { 2 2 "name": "make8bitart.com", 3 - "version": "2.0.0", 3 + "version": "2.1.0", 4 4 "description": "a fun free in-browser pixel art tool for you!", 5 5 "scripts": { 6 6 "build": "grunt",
+8
src/assets/bobross-palette.csv
··· 1 + titanium white,ffffff 2 + phthalo green,123524 3 + prussian blue,003153 4 + van dyke brown,584630 5 + alizarin crimson,e32636 6 + sap green,afcb80 7 + cad yellow,fff600 8 + permanent red,eb4734
src/assets/draggybits/dragger.png src/assets/draggydivs/dragger.png
src/assets/draggybits/hider.png src/assets/draggydivs/hider.png
src/assets/icons/copy.png

This is a binary file and will not be displayed.

src/assets/icons/cut.png

This is a binary file and will not be displayed.

src/assets/icons/dropper.png

This is a binary file and will not be displayed.

src/assets/icons/paint.png

This is a binary file and will not be displayed.

src/assets/icons/paste-disabled.png

This is a binary file and will not be displayed.

src/assets/icons/paste.png

This is a binary file and will not be displayed.

src/assets/icons/pencil.png

This is a binary file and will not be displayed.

src/assets/make8bitart-180.png

This is a binary file and will not be displayed.

src/assets/make8bitart-800.png

This is a binary file and will not be displayed.

-13
src/css/draggybits.css
··· 1 - /** 2 - * draggybits 3 - * by css perverts aka nick & jenn 4 - */ 5 - 6 - .draggy.ui-hidden { display: none;} 7 - 8 - /** controls **/ 9 - .draggy .controls { float: right; } 10 - .draggy .controls button { width: auto; height: auto; padding: 0; margin: 0; background: none; border: none; } 11 - .draggy .controls .ui-dragger { cursor: move; } 12 - .draggy .controls .ui-closer, 13 - .draggy .controls .ui-hider { cursor: pointer; }
+98 -50
src/css/make8bitart.css
··· 5 5 6 6 /* fonts */ 7 7 @font-face { 8 - font-family: 'VT323'; 9 - src: url('../assets/fonts/VT323-Regular-subset.woff2') format('woff2'), 10 - url('../assets/fonts/VT323-Regular-subset.zopfli.woff') format('woff'), 11 - url('../assets/fonts/VT323-Regular-subset.ttf') format('truetype'); 8 + font-family: "VT323"; 9 + src: url("../assets/fonts/VT323-Regular-subset.woff2") format("woff2"), 10 + url("../assets/fonts/VT323-Regular-subset.zopfli.woff") format("woff"), 11 + url("../assets/fonts/VT323-Regular-subset.ttf") format("truetype"); 12 12 font-display: swap; 13 13 } 14 14 @font-face { 15 - font-family: '8bit Art Sans'; 16 - src: url('../assets/fonts/8bit-Art-Sans-subset.woff2') format('woff2'), 17 - url('../assets/fonts/8bit-Art-Sans-subset.zopfli.woff') format('woff'), 18 - url('../assets/fonts/8bit-Art-Sans-subset.ttf') format('truetype'); 15 + font-family: "8bit Art Sans"; 16 + src: url("../assets/fonts/8bit-Art-Sans-subset.woff2") format("woff2"), 17 + url("../assets/fonts/8bit-Art-Sans-subset.zopfli.woff") format("woff"), 18 + url("../assets/fonts/8bit-Art-Sans-subset.ttf") format("truetype"); 19 19 font-display: swap; 20 20 } 21 21 ··· 23 23 background: #fff; 24 24 padding: 0; 25 25 margin: 0; 26 - font-family: 'VT323', monospace; 26 + font-family: "VT323", monospace; 27 27 font-size: 16px; 28 28 color: #000; 29 29 } ··· 34 34 35 35 h2 { 36 36 font-size: 1.5em; 37 - margin: .1em 0; 37 + margin: 0.1em 0; 38 38 } 39 39 40 40 menu { ··· 55 55 } 56 56 57 57 /* draggy "plugin" */ 58 - .draggy { 58 + .draggydiv { 59 59 padding: 10px; 60 60 box-shadow: 6px 6px 0 #000; 61 61 border: 4px solid #000; ··· 66 66 overflow: hidden; 67 67 } 68 68 69 + .draggydiv .menu { 70 + float: right; 71 + margin-left: 5px; 72 + } 73 + .draggydiv .menu button { 74 + width: auto; 75 + height: auto; 76 + padding: 0; 77 + margin: 0; 78 + background: 0 0; 79 + border: none; 80 + } 81 + .draggydiv .menu .draggydivs-drag { 82 + cursor: move; 83 + width: 30px; 84 + height: 30px; 85 + background: url("/assets/draggydivs/dragger.png"); 86 + } 87 + .draggydiv .menu .draggydivs-minimize, 88 + .draggydiv .menu .draggydivs-close { 89 + cursor: pointer; 90 + width: 30px; 91 + height: 30px; 92 + background: url("/assets/draggydivs/hider.png"); 93 + color: red; 94 + } 69 95 70 - .ui-hider img { 71 - margin: 3px 6px 0 0; 96 + #header { 97 + left: 60px !important; 98 + top: 20px !important; 99 + } 100 + 101 + #toolbox { 102 + left: 30px !important; 103 + top: 250px !important; 104 + } 105 + 106 + #colorbox { 107 + left: 750px !important; 108 + top: 50px !important; 109 + } 110 + 111 + #filebox { 112 + left: 285px !important; 113 + top: 234px !important; 114 + } 115 + #what { 116 + left: 505px !important; 117 + top: 120px !important; 72 118 } 73 119 74 120 /* tabs */ ··· 79 125 } 80 126 81 127 .tabs button { 82 - font-family: 'VT323', monospace; 128 + font-family: "VT323", monospace; 83 129 font-size: 1em; 84 130 display: inline-block; 85 - padding: .5em 1em; 86 - margin: 0 0 .5em; 131 + padding: 0.5em 1em; 132 + margin: 0 0 0.5em; 87 133 border: 1px solid #000; 88 134 background-color: #ccc; 89 135 box-shadow: 2px 2px 0px #000; ··· 97 143 .tabs:hover { 98 144 cursor: pointer; 99 145 } 100 - 101 146 102 147 /* header */ 103 148 header { 104 149 font-size: 1em; 105 - width: 200px; 150 + width: 200px !important; 106 151 } 107 152 108 153 header h1 { 109 - font-family: '8bit Art Sans'; 154 + font-family: "8bit Art Sans"; 110 155 font-size: 2em; 111 156 line-height: 1em; 112 157 margin: 0; 113 158 } 114 159 115 - #minimized-tools-menu { 160 + #draggydivs-minimized { 116 161 font-size: 1.2em; 117 162 margin-top: 10px; 118 163 padding: 0; 164 + list-style: none; 119 165 } 120 166 121 - #minimized-tools-menu button { 167 + #draggydivs-minimized a { 122 168 display: inline-block; 123 169 padding: 3px 10px; 124 170 background: lime; 125 171 margin: 3px; 126 172 border: none; 127 - font-family: 'VT323', monospace; 173 + font-family: "VT323", monospace; 128 174 font-size: 1em; 175 + color: black; 176 + text-decoration: none; 129 177 } 130 178 131 - #minimized-tools-menu button:hover { 179 + #draggydivs-minimized a:hover { 132 180 color: green; 133 181 cursor: pointer; 134 182 } 135 183 136 - #minimized-tools-menu button:after { 137 - content: ' +'; 184 + #draggydivs-minimized a:after { 185 + content: " +"; 138 186 } 139 187 140 188 /* social and credits */ 141 189 #what { 142 - width: 200px; 190 + width: 200px !important; 143 191 } 144 192 145 193 /* canvas tools box */ 146 194 #toolbox { 147 - width: 200px; 195 + width: 200px !important; 148 196 } 149 197 150 198 #toolbox .inner { ··· 159 207 160 208 #toolbox ul li { 161 209 display: inline-block; 162 - margin: .2em; 210 + margin: 0.2em; 163 211 } 164 212 165 213 .icon-button { ··· 170 218 } 171 219 172 220 .icon-button img { 173 - padding: .3em; 221 + padding: 0.3em; 174 222 vertical-align: middle; 175 223 } 176 224 ··· 181 229 .text-button { 182 230 background: #efefef; 183 231 border: 2px solid #ccc; 184 - padding: .3em .5em; 185 - margin: .2em; 232 + padding: 0.3em 0.5em; 233 + margin: 0.2em; 186 234 font-family: monospace; 187 - font-size: .8em; 235 + font-size: 0.8em; 188 236 font-weight: bold; 189 237 cursor: pointer; 190 238 } 191 239 192 240 input[type="submit"] { 193 - margin: .2em 0 .2em 0; 194 - font-size: .8em; 241 + margin: 0.2em 0 0.2em 0; 242 + font-size: 0.8em; 195 243 } 196 244 197 245 input[type="file"] { ··· 216 264 217 265 /* save box */ 218 266 #filebox { 219 - width: 175px; 267 + width: 175px !important; 220 268 } 221 269 222 270 #filebox input { ··· 225 273 226 274 #filebox label { 227 275 display: block; 228 - margin: 1em .5em; 276 + margin: 1em 0.5em; 229 277 } 230 278 231 279 .instructions { ··· 234 282 235 283 /* color picker/palette box */ 236 284 #colorbox { 237 - width: 225px; 285 + width: 225px !important; 238 286 } 239 287 240 288 .colors, ··· 245 293 } 246 294 247 295 .colors { 248 - margin: .5em 0; 296 + margin: 0.5em 0; 249 297 } 250 298 251 299 .button { 252 300 display: block; 253 301 float: left; 254 - border: 2px solid rgba(255,255,255,.5); 302 + border: 2px solid rgba(255, 255, 255, 0.5); 255 303 } 256 304 257 305 .button.save { ··· 294 342 295 343 .button.color.white { 296 344 background: white; 297 - border: 2px solid rgba(0,0,0,.25); 345 + border: 2px solid rgba(0, 0, 0, 0.25); 298 346 } 299 347 300 348 .button.color.transparent { 301 349 border-color: #ccc; 302 - background: url('../assets/bg.png'); 350 + background: url("../assets/bg.png"); 303 351 } 304 352 305 353 .button.color.current, ··· 357 405 text-align: center; 358 406 width: 100%; 359 407 height: 100%; 360 - background: rgba(0,0,0,.8); 408 + background: rgba(0, 0, 0, 0.8); 361 409 position: absolute; 362 410 top: 0; 363 411 left: 0; ··· 379 427 380 428 .inside-modal h2 { 381 429 font-size: 2em; 382 - margin: .25em 1em; 430 + margin: 0.25em 1em; 383 431 } 384 432 385 433 .inside-modal .ui-hider { ··· 442 490 display: block; 443 491 border: 5px solid #000; 444 492 margin: 10px auto; 445 - background: url('../assets/bg.png'); 493 + background: url("../assets/bg.png"); 446 494 } 447 495 448 496 #pxon-modal-container textarea { ··· 452 500 } 453 501 454 502 /* mobile */ 455 - @media only screen and ( min-device-width: 320px ) and ( max-device-width: 568px ) { 503 + @media only screen and (min-device-width: 320px) and (max-device-width: 568px) { 456 504 body { 457 505 font-size: 1em; 458 506 } 459 - 507 + 460 508 .ui-dragger { 461 509 display: none; 462 510 } 463 511 464 512 input { 465 - font-size: .6em; 513 + font-size: 0.6em; 466 514 } 467 515 468 516 header { ··· 470 518 } 471 519 472 520 #toolbox input { 473 - font-size: .8em; 521 + font-size: 0.8em; 474 522 } 475 523 476 524 #save-selection { ··· 478 526 } 479 527 480 528 h2 { 481 - margin: .5em 0; 529 + margin: 0.5em 0; 482 530 } 483 531 } 484 532 485 533 /* misc */ 486 534 .hidden { 487 - display: none!important; 535 + display: none !important; 488 536 } 489 537 490 538 .clearfix:after {
+93 -93
src/index.html
··· 31 31 type="font/woff2" 32 32 crossorigin 33 33 /> 34 - <link rel="stylesheet" href="draggybits.min.css" /> 35 34 <link rel="stylesheet" href="make8bitart.min.css" /> 36 35 <link rel="icon" href="/assets/brighton.png" /> 37 36 <link rel="manifest" href="/manifest.json" /> 38 - <link rel="me" href="https://glitch.com/@jennschiffer" /> 39 37 <meta name="theme-color" content="#00ffff" /> 40 38 <script src="app.min.js" defer></script> 41 39 <script ··· 95 93 / / _ _ 96 94 (_.-.'O'-'. HEADER INFO --> 97 95 98 - <header id="header" class="draggy" role="banner"> 99 - <div class="controls"> 100 - <button role="button" class="ui-dragger"> 101 - <img 102 - src="assets/draggybits/dragger.png" 103 - width="30" 104 - height="30" 105 - alt="move controls window" 106 - /> 96 + <header id="header" class="draggydiv" title="make 8-bit art!" role="banner"> 97 + <div class="menu"> 98 + <button 99 + role="button" 100 + class="draggydivs-drag" 101 + aria-label="move this box" 102 + > 103 + &#10021; 107 104 </button> 108 105 </div> 109 - 110 - <h1>make 8-bit art!</h1> 111 - <menu id="minimized-tools-menu" role="navigation"></menu> 106 + <main> 107 + <div class="inner"> 108 + <h1>make 8-bit art!</h1> 109 + <ul id="draggydivs-minimized"></ul> 110 + </div> 111 + </main> 112 112 </header> 113 113 114 114 <!-- ··· 127 127 ~@#~~ == ...______ __ ___ _--~~--_ SOCIAL LINKS 128 128 --> 129 129 130 - <section id="what" class="draggy" title="what is this?" data-title="what"> 131 - <div class="controls"> 132 - <button role="button" class="ui-dragger"> 133 - <img 134 - src="assets/draggybits/dragger.png" 135 - width="30" 136 - height="30" 137 - alt="move controls window" 138 - /> 130 + <section 131 + id="what" 132 + class="draggydiv draggydivs-init-closed" 133 + title="what is this?" 134 + data-title="what" 135 + > 136 + <div class="menu"> 137 + <button 138 + role="button" 139 + class="draggydivs-drag" 140 + aria-label="move this box" 141 + > 142 + &#10021; 139 143 </button> 140 - <button role="button" class="ui-hider"> 141 - <img 142 - src="assets/draggybits/hider.png" 143 - width="30" 144 - height="30" 145 - alt="move controls window" 146 - /> 144 + 145 + <button 146 + role="button" 147 + class="draggydivs-minimize" 148 + aria-label="minimize this box" 149 + > 150 + &#10799; 147 151 </button> 148 152 </div> 149 153 150 154 <h2>what is this?</h2> 151 155 152 156 <p> 153 - this is an 154 - <a 155 - href="https://glitch.com/edit/#!/make8bitart" 156 - title="link to make8bitart repo on glitch" 157 - target="_blank" 158 - >open source</a 159 - > 160 - pixel art drawing tool by 157 + this is a free web-based pixel art drawing tool by 161 158 <a 162 159 href="https://jennschiffer.com" 163 160 title="official website of" 164 161 target="_blank" 165 162 >jenn schiffer</a 166 - >, now on <a href="https://glitch.com">glitch.com</a>! 163 + >! 167 164 </p> 168 165 169 166 <p> 170 - if you make something cool, i wanna see it – find me on the fediverse 171 - <a rel="me" href="https://pixel.kitchen/@jenn">@jenn@pixel.kitchen</a> 172 - or email jenn@dotbiz.info! 167 + if you make something cool, i wanna see it – find me on bluesky 168 + <a rel="me" href="https://bsky.app/profile/jennschiffer.com" 169 + >@jennschiffer.com</a 170 + > 171 + or email hi@jennschiffer.com! 173 172 </p> 174 173 </section> 175 174 ··· 193 192 194 193 <section 195 194 id="toolbox" 196 - class="draggy" 195 + class="draggydiv draggydivs-init-closed" 197 196 title="canvas/brush tools" 198 197 data-title="tools" 199 198 > 200 - <div class="controls"> 201 - <button role="button" class="ui-dragger"> 202 - <img 203 - src="assets/draggybits/dragger.png" 204 - width="30" 205 - height="30" 206 - alt="move controls window" 207 - /> 199 + <div class="menu"> 200 + <button 201 + role="button" 202 + class="draggydivs-drag" 203 + aria-label="move this box" 204 + > 205 + &#10021; 208 206 </button> 209 - <button role="button" class="ui-hider"> 210 - <img 211 - src="assets/draggybits/hider.png" 212 - width="30" 213 - height="30" 214 - alt="move controls window" 215 - /> 207 + 208 + <button 209 + role="button" 210 + class="draggydivs-minimize" 211 + aria-label="minimize this box" 212 + > 213 + &#10799; 216 214 </button> 217 215 </div> 218 216 ··· 328 326 329 327 <section 330 328 id="filebox" 331 - class="draggy" 329 + class="draggydiv draggydivs-init-closed" 332 330 title="export/save" 333 - data-title="export-save" 331 + data-title="export/save" 334 332 > 335 - <div class="controls"> 336 - <button role="button" class="ui-dragger"> 337 - <img src="assets/draggybits/dragger.png" alt="move controls window" /> 333 + <div class="menu"> 334 + <button 335 + role="button" 336 + class="draggydivs-drag" 337 + aria-label="move this box" 338 + > 339 + &#10021; 338 340 </button> 339 - <button role="button" class="ui-hider"> 340 - <img src="assets/draggybits/hider.png" alt="move controls window" /> 341 + 342 + <button 343 + role="button" 344 + class="draggydivs-minimize" 345 + aria-label="minimize this box" 346 + > 347 + &#10799; 341 348 </button> 342 349 </div> 343 350 ··· 361 368 <div id="export"> 362 369 <h2>export art</h2> 363 370 364 - <label for="save-png" class="png" id="save-png-form"> 371 + <label for="save-full" class="png" id="save-png-form"> 365 372 to png:<br /> 366 373 <button role="button" class="text-button" id="save-full"> 367 374 full page ··· 414 421 415 422 <section 416 423 id="colorbox" 417 - class="draggy" 424 + class="draggydiv draggydivs-init-closed" 418 425 title="color tools" 419 426 data-title="colors" 420 427 > 421 - <div class="controls"> 422 - <button role="button" class="ui-dragger"> 423 - <img 424 - src="assets/draggybits/dragger.png" 425 - width="30" 426 - height="30" 427 - alt="move controls window" 428 - /> 428 + <div class="menu"> 429 + <button 430 + role="button" 431 + class="draggydivs-drag" 432 + aria-label="move this box" 433 + > 434 + &#10021; 429 435 </button> 430 - <button role="button" class="ui-hider"> 431 - <img 432 - src="assets/draggybits/hider.png" 433 - width="30" 434 - height="30" 435 - alt="move controls window" 436 - /> 436 + 437 + <button 438 + role="button" 439 + class="draggydivs-minimize" 440 + aria-label="minimize this box" 441 + > 442 + &#10799; 437 443 </button> 438 444 </div> 439 445 ··· 570 576 <div class="controls"> 571 577 <button role="button" class="ui-hider"> 572 578 <img 573 - src="assets/draggybits/hider.png" 579 + src="assets/draggydivs/hider.png" 574 580 width="30" 575 581 height="30" 576 582 alt="move controls window" ··· 582 588 ><img id="finished-art" 583 589 /></a> 584 590 585 - <p> 586 - Click or drag your art to your desktop to save!<br /> 587 - <button role="button" class="text-button" id="save-imgur"> 588 - Or upload to imgur.com! 589 - </button> 590 - </p> 591 - <p id="link-imgur"></p> 591 + <p>Click or drag your art to your desktop to save!<br /></p> 592 592 </div> 593 593 </section> 594 594 ··· 597 597 <div class="controls"> 598 598 <button role="button" class="ui-hider"> 599 599 <img 600 - src="assets/draggybits/hider.png" 600 + src="assets/draggydivs/hider.png" 601 601 width="30" 602 602 height="30" 603 603 alt="move controls window" ··· 617 617 <div class="controls"> 618 618 <button role="button" class="ui-hider"> 619 619 <img 620 - src="assets/draggybits/hider.png" 620 + src="assets/draggydivs/hider.png" 621 621 width="30" 622 622 height="30" 623 623 alt="move controls window" ··· 637 637 fun! 638 638 </p> 639 639 640 - <textarea></textarea> 640 + <textarea name="pxon"></textarea> 641 641 642 642 <p> 643 643 <strong
+960 -662
src/js/app/make8bitart.js
··· 4 4 * turn down for #butts 5 5 */ 6 6 7 - (function ($, key, window, document) { 7 + (function (key, window, document) { 8 8 "use strict"; 9 9 10 + // Helper to get element offset 11 + var getElementOffset = function (element) { 12 + var rect = element.getBoundingClientRect(); 13 + return { 14 + top: rect.top + window.pageYOffset, 15 + left: rect.left + window.pageXOffset, 16 + }; 17 + }; 18 + 10 19 var ctx, 11 20 pickerPaletteCtx, 12 21 savedCanvas, ··· 16 25 historyPointer, 17 26 drawPathId, 18 27 ctxOverlay, 19 - colorHistory, 20 - resizing; 28 + colorHistory; 21 29 var undoRedoHistory = []; 22 30 var drawHistory = []; 23 31 ··· 37 45 }; 38 46 39 47 var DOM = { 40 - $window: $(window), 41 - $body: $("body"), 48 + $window: window, 49 + $body: document.body, 42 50 43 - $header: $("#header"), 44 - $whatbox: $("#what"), 45 - $toolbox: $("#toolbox"), 46 - $filebox: $("#filebox"), 47 - $colorbox: $("#colorbox"), 48 - $waiting: $("#wait"), 51 + $header: document.getElementById("header"), 52 + $whatbox: document.getElementById("what"), 53 + $toolbox: document.getElementById("toolbox"), 54 + $filebox: document.getElementById("filebox"), 55 + $colorbox: document.getElementById("colorbox"), 56 + $waiting: document.getElementById("wait"), 49 57 50 - $tabs: $(".tabs button"), 58 + $tabs: document.querySelectorAll(".tabs button"), 51 59 52 - $color: $(".color"), 53 - $colorHistoryModule: $("#color-history"), 54 - $colorHistoryPalette: $(".color-history-list"), 55 - $colorCustomPalette: $(".color-custom-list"), 56 - $pickers: $("#pickers"), 57 - $customPalettes: $("#custom-palettes"), 58 - $defaultPalettes: $("#default-palettes"), 59 - $8bitPicker: $("#eight-bit-colors"), 60 - $colorPickerDemo: $(".color-demo"), 61 - $hex: $("#hex-color"), 62 - $dropper: $("#color-dropper"), 60 + $color: document.querySelectorAll(".color"), 61 + $colorHistoryModule: document.getElementById("color-history"), 62 + $colorHistoryPalette: document.querySelector(".color-history-list"), 63 + $colorCustomPalette: document.querySelector(".color-custom-list"), 64 + $pickers: document.getElementById("pickers"), 65 + $customPalettes: document.getElementById("custom-palettes"), 66 + $defaultPalettes: document.getElementById("default-palettes"), 67 + $8bitPicker: document.getElementById("eight-bit-colors"), 68 + $colorPickerDemo: document.querySelectorAll(".color-demo"), 69 + $hex: document.getElementById("hex-color"), 70 + $dropper: document.getElementById("color-dropper"), 63 71 64 - $toolButtons: $(".icon-button"), 72 + $toolButtons: document.querySelectorAll(".icon-button"), 65 73 66 - $pencil: $("#pencil"), 67 - $paint: $("#paint"), 74 + $pencil: document.getElementById("pencil"), 75 + $paint: document.getElementById("paint"), 68 76 69 - $buttonNewCanvas: $("#new-canvas"), 70 - $buttonSaveLocal: $("#save-local"), 71 - $buttonSaveFull: $("#save-full"), 72 - $buttonSaveSelection: $("#save-selection"), 73 - $buttonSaveImgur: $("#save-imgur"), 74 - $buttonOpenFile: $("#open-file"), 75 - $buttonOpenLocal: $("#open-local"), 77 + $buttonNewCanvas: document.getElementById("new-canvas"), 78 + $buttonSaveLocal: document.getElementById("save-local"), 79 + $buttonSaveFull: document.getElementById("save-full"), 80 + $buttonSaveSelection: document.getElementById("save-selection"), 81 + $buttonOpenFile: document.getElementById("open-file"), 82 + $buttonOpenLocal: document.getElementById("open-local"), 76 83 77 - $buttonImportPXON: $("#import-pxon"), 78 - $buttonExportPXON: $("#export-pxon"), 79 - $pxonModalContainer: $("#pxon-modal-container"), 84 + $buttonImportPXON: document.getElementById("import-pxon"), 85 + $buttonExportPXON: document.getElementById("export-pxon"), 86 + $pxonModalContainer: document.getElementById("pxon-modal-container"), 80 87 81 - $pixelSizeInput: $(".pixel-size-input"), 82 - $pixelSizeDemoDiv: $("#pixel-size-demo"), 88 + $pixelSizeInput: document.querySelectorAll(".pixel-size-input"), 89 + $pixelSizeDemoDiv: document.getElementById("pixel-size-demo"), 83 90 84 - $minimizedToolsMenu: $("#minimized-tools-menu"), 85 - $draggydivs: $(".draggy"), 86 - $saveInstruction: $(".instructions.save"), 87 - $pasteInstructions: $(".instructions.paste"), 91 + $minimizedToolsList: document.getElementById("minimized-tools-menu"), 92 + $draggydivs: document.querySelectorAll(".draggydiv"), 93 + $saveInstruction: document.querySelector(".instructions.save"), 94 + $pasteInstructions: document.querySelector(".instructions.paste"), 88 95 89 - $undo: $("#undo"), 90 - $redo: $("#redo"), 96 + $undo: document.getElementById("undo"), 97 + $redo: document.getElementById("redo"), 91 98 92 - $cut: $("#cut"), 93 - $copy: $("#copy"), 94 - $paste: $("#paste"), 99 + $cut: document.getElementById("cut"), 100 + $copy: document.getElementById("copy"), 101 + $paste: document.getElementById("paste"), 95 102 96 - $modalContainers: $(".modal"), 97 - $modalExit: $(".modal .ui-hider"), 103 + $modalContainers: document.querySelectorAll(".modal"), 104 + $modalExit: document.querySelectorAll(".modal .ui-hider"), 98 105 99 - $saveModalContainer: $("#save-modal-container"), 100 - $saveImg: $("#finished-art"), 101 - $linkImgur: $("#link-imgur"), 106 + $saveModalContainer: document.getElementById("save-modal-container"), 107 + $saveImg: document.getElementById("finished-art"), 102 108 103 - $openLocalModalContainer: $("#open-modal-container"), 104 - $openFile: $("#open-file"), 105 - $openLocalForm: $("#open-local-form"), 106 - $openLocal: $("#open-local"), 107 - $openLocalGallery: $("#open-modal .gallery"), 108 - $openLocalGalleryItems: $("#open-modal .gallery li"), 109 + $openLocalModalContainer: document.getElementById("open-modal-container"), 110 + $openFile: document.getElementById("open-file"), 111 + $openLocalForm: document.getElementById("open-local-form"), 112 + $openLocal: document.getElementById("open-local"), 113 + $openLocalGallery: document.querySelector("#open-modal .gallery"), 114 + $openLocalGalleryItems: null, // Will be set dynamically 109 115 $colorHistoryTools: { 110 - clearPalette: $("#color-history-tools .clear"), 111 - exportPalette: $("#color-history-tools .export"), 116 + clearPalette: document.querySelector("#color-history-tools .clear"), 117 + exportPalette: document.querySelector("#color-history-tools .export"), 112 118 }, 113 119 114 120 $colorCustomTools: { 115 - clearPalette: $("#color-custom-tools .clear"), 116 - importPalette: $("#color-custom-tools .import"), 121 + clearPalette: document.querySelector("#color-custom-tools .clear"), 122 + importPalette: document.querySelector("#color-custom-tools .import"), 117 123 }, 118 124 }; 119 125 ··· 135 141 }; 136 142 137 143 var windowCanvas = { 138 - height: DOM.$window.height() - (DOM.$window.height() % 15), 139 - width: Math.max(DOM.$window.width() - (DOM.$window.width() % 15), 250), 144 + height: window.innerHeight - (window.innerHeight % 15), 145 + width: window.innerWidth - (window.innerWidth % 15), 140 146 background: 'url("assets/bg.png")', 141 147 }; 142 148 ··· 158 164 }, 159 165 }; 160 166 161 - // you should register your own imgur app here https://api.imgur.com/ 162 - var imgur = { 163 - clientId: "11112830fafe58a", 164 - }; 165 - 166 - /*** OUTSIDE LIBRARY STUFF - DRAGGYDIVS ***/ 167 - 168 - var onMinimizeToolsMenuClick = function (e) { 169 - var $this = $(this); 170 - var $elem = $this.data("draggy"); 171 - $elem.draggyBits("restore"); 172 - $this.parent().remove(); 173 - }; 174 - 175 - var onMinimize = function ($elem) { 176 - var $a = $( 177 - '<button role="button" tabindex="0" data-section="#' + 178 - $elem.attr("data-title") + 179 - '">' 180 - ) 181 - .html($elem.attr("title")) 182 - .on("click", onMinimizeToolsMenuClick) 183 - .data("draggy", $elem); 184 - $("<span></span>").append($a).appendTo(DOM.$minimizedToolsMenu); 185 - }; 186 - 187 - DOM.$draggydivs.draggyBits({ onMinimize: onMinimize }); 188 - 189 - // if mouse up is on toolboxes, don't keep drawing 190 - DOM.$draggydivs.mouseup(function () { 191 - DOM.$canvas.off("mousemove"); 192 - }); 193 - 194 - /*** DRAGGY POSITIONS ***/ 195 - 196 - DOM.$header.css({ 197 - left: "20px", 198 - top: "20px", 199 - }); 200 - DOM.$colorbox.css({ 201 - left: "20px", 202 - top: "240px", 203 - }); 204 - DOM.$toolbox.css({ 205 - left: "40px", 206 - top: "260px", 207 - }); 208 - DOM.$filebox.css({ 209 - left: "60px", 210 - top: "280px", 211 - }); 212 - DOM.$whatbox.css({ 213 - left: "80px", 214 - top: "300px", 215 - }); 216 - 217 - 218 167 /*** FUNCTIONS WOWOWOW ***/ 219 168 220 169 /* canvas & drawing */ 221 170 222 171 var generateCanvas = function () { 223 172 // drawing 224 - DOM.$canvas = $( 225 - '<canvas id="canvas" width="' + 226 - windowCanvas.width + 227 - '" height="' + 228 - windowCanvas.height + 229 - "\">Your browser doesn't support canvas. Boo-hiss.</canvas>" 230 - ); 231 - DOM.$body.prepend(DOM.$canvas); 232 - ctx = DOM.$canvas[0].getContext("2d", { willReadFrequently: true }); 173 + DOM.$canvas = document.createElement("canvas"); 174 + DOM.$canvas.id = "canvas"; 175 + DOM.$canvas.width = windowCanvas.width; 176 + DOM.$canvas.height = windowCanvas.height; 177 + DOM.$canvas.textContent = "Your browser doesn't support canvas. Boo-hiss."; 178 + DOM.$body.insertBefore(DOM.$canvas, DOM.$body.firstChild); 179 + ctx = DOM.$canvas.getContext("2d"); 233 180 234 181 // selection save overlay 235 - DOM.$overlay = $( 236 - '<canvas id="overlay" width="' + 237 - windowCanvas.width + 238 - '" height="' + 239 - windowCanvas.height + 240 - '"></canvas>' 241 - ); 242 - DOM.$overlay 243 - .css({ 244 - background: "none", 245 - position: "absolute", 246 - top: 0, 247 - left: 0, 248 - }) 249 - .addClass(classes.hidden); 182 + DOM.$overlay = document.createElement("canvas"); 183 + DOM.$overlay.id = "overlay"; 184 + DOM.$overlay.width = windowCanvas.width; 185 + DOM.$overlay.height = windowCanvas.height; 186 + DOM.$overlay.style.background = "none"; 187 + DOM.$overlay.style.position = "absolute"; 188 + DOM.$overlay.style.top = "0"; 189 + DOM.$overlay.style.left = "0"; 190 + DOM.$overlay.classList.add(classes.hidden); 250 191 251 - DOM.$body.prepend(DOM.$overlay); 252 - ctxOverlay = DOM.$overlay[0].getContext("2d", { willReadFrequently: true }); 192 + DOM.$body.insertBefore(DOM.$overlay, DOM.$body.firstChild); 193 + ctxOverlay = DOM.$overlay.getContext("2d"); 253 194 ctxOverlay.fillStyle = "rgba(0,0,0,.5)"; 254 195 255 196 // restore webstorage data ··· 263 204 windowCanvas.width = width - (width % pixel.size); 264 205 windowCanvas.height = height - (width % pixel.size); 265 206 266 - DOM.$canvas.attr("width", width).attr("height", height); 267 - DOM.$overlay.attr("width", width).attr("height", height); 268 - ctx = DOM.$canvas[0].getContext("2d", { willReadFrequently: true }); 269 - ctxOverlay = DOM.$overlay[0].getContext("2d", { willReadFrequently: true }); 270 - ctxOverlay.fillStyle = "rgba(0,0,0,.5)"; 271 - }; 272 - 273 - var resizeCanvas = function () { 274 - if ( 275 - DOM.$window.width() - (DOM.$window.width() % pixel.size) <= 276 - windowCanvas.width && 277 - DOM.$window.height() - (DOM.$window.height() % pixel.size) <= 278 - windowCanvas.height 279 - ) { 280 - return; 281 - } else { 282 - // if local storage 283 - if (!canStorage() || mode.save) { 284 - return; 285 - } else { 286 - var newWidth = DOM.$window.width() - (DOM.$window.width() % pixel.size); 287 - var newHeight = 288 - DOM.$window.height() - (DOM.$window.height() % pixel.size); 289 - 290 - // save image 291 - saveToLocalStorage(); 292 - 293 - // set canvas size 294 - setCanvasSize(newWidth, newHeight); 295 - 296 - // draw image 297 - drawFromLocalStorage(); 298 - } 207 + if (DOM.$canvas) { 208 + DOM.$canvas.width = width; 209 + DOM.$canvas.height = height; 210 + } 211 + if (DOM.$overlay) { 212 + DOM.$overlay.width = width; 213 + DOM.$overlay.height = height; 214 + } 215 + if (DOM.$canvas) { 216 + ctx = DOM.$canvas.getContext("2d"); 217 + } 218 + if (DOM.$overlay) { 219 + ctxOverlay = DOM.$overlay.getContext("2d"); 220 + ctxOverlay.fillStyle = "rgba(0,0,0,.5)"; 299 221 } 300 222 }; 301 223 ··· 305 227 "You cannot undo canvas resets. Are you sure you want to erase this entire drawing?" 306 228 ) 307 229 ) { 308 - ctx.clearRect(0, 0, DOM.$canvas.width(), DOM.$canvas.height()); 230 + if (DOM.$canvas && ctx) { 231 + ctx.clearRect(0, 0, DOM.$canvas.width, DOM.$canvas.height); 232 + } 309 233 310 234 if (sizeToViewport) { 311 235 // set the canvas to viewport size if new 312 - setCanvasSize(DOM.$body.prop("clientWidth"), DOM.$window.height()); 236 + setCanvasSize(DOM.$body.clientWidth, window.innerHeight); 313 237 } 314 238 315 - if (background && background !== "rgba(0, 0, 0, 0)") { 239 + if ( 240 + background && 241 + background !== "rgba(0, 0, 0, 0)" && 242 + DOM.$canvas && 243 + ctx 244 + ) { 316 245 ctx.fillStyle = background; 317 - ctx.fillRect(0, 0, DOM.$canvas.width(), DOM.$canvas.height()); 246 + ctx.fillRect(0, 0, DOM.$canvas.width, DOM.$canvas.height); 318 247 } 319 248 320 249 // reset history 321 250 undoRedoHistory = []; 322 251 historyPointer = -1; 323 - DOM.$redo.attr("disabled", "disabled"); 324 - DOM.$undo.attr("disabled", "disabled"); 252 + if (DOM.$redo) { 253 + DOM.$redo.setAttribute("disabled", "disabled"); 254 + } 255 + if (DOM.$undo) { 256 + DOM.$undo.setAttribute("disabled", "disabled"); 257 + } 325 258 } 326 259 }; 327 260 328 261 var initPixel = function (size) { 329 262 pixel.size = parseInt(size); 330 - DOM.$pixelSizeDemoDiv.css({ 331 - width: pixel.size, 332 - height: pixel.size, 263 + if (DOM.$pixelSizeDemoDiv) { 264 + DOM.$pixelSizeDemoDiv.style.width = pixel.size + "px"; 265 + DOM.$pixelSizeDemoDiv.style.height = pixel.size + "px"; 266 + } 267 + Array.from(DOM.$pixelSizeInput).forEach(function (input) { 268 + input.value = pixel.size; 333 269 }); 334 - DOM.$pixelSizeInput.val(pixel.size); 335 270 336 271 var img = new Image(); 337 272 img.src = generateBackgroundGrid(pixel.size); 338 273 img.onload = function updateCanvasBackground() { 339 - DOM.$canvas.css("background", "url(" + img.src + ")"); 274 + if (DOM.$canvas) { 275 + DOM.$canvas.style.background = "url(" + img.src + ")"; 276 + } 340 277 }; 341 278 }; 342 279 ··· 550 487 }; 551 488 552 489 var drawToCanvas = function (src, x, y, clear) { 553 - if (clear) { 554 - ctx.clearRect(0, 0, DOM.$canvas.width(), DOM.$canvas.height()); 490 + if (clear && DOM.$canvas && ctx) { 491 + ctx.clearRect(0, 0, DOM.$canvas.width, DOM.$canvas.height); 555 492 } 556 493 557 494 var img = new Image(); 558 495 img.onload = function () { 496 + if (!DOM.$canvas) { 497 + return; 498 + } 499 + 559 500 // increase canvas size in case image is bigger 560 501 var newWidth = 561 - DOM.$canvas.width() < this.width ? this.width : DOM.$canvas.width(); 502 + DOM.$canvas.width < this.width ? this.width : DOM.$canvas.width; 562 503 var newHeight = 563 - DOM.$canvas.height() < this.height ? this.height : DOM.$canvas.height(); 504 + DOM.$canvas.height < this.height ? this.height : DOM.$canvas.height; 564 505 565 506 setCanvasSize(newWidth, newHeight); 566 507 567 - ctx.drawImage(img, x, y); 508 + if (ctx) { 509 + ctx.drawImage(img, x, y); 510 + } 568 511 }; 569 512 img.src = src; 570 513 }; ··· 604 547 undoRedoHistory.push(pixelDrawn); 605 548 drawHistory.push(pixelDrawn); 606 549 historyPointer++; 607 - DOM.$undo.removeAttr("disabled"); 550 + if (DOM.$undo) { 551 + DOM.$undo.removeAttribute("disabled"); 552 + } 608 553 }; 609 554 610 555 var undoRedo = function (pointer, undoFlag) { ··· 666 611 667 612 var resetModes = function () { 668 613 if (mode.dropper) { 669 - DOM.$dropper.removeAttr("style"); 670 - DOM.$canvas.removeClass(classes.dropperMode); 614 + if (DOM.$dropper) { 615 + DOM.$dropper.removeAttribute("style"); 616 + } 617 + if (DOM.$canvas) { 618 + DOM.$canvas.classList.remove(classes.dropperMode); 619 + } 671 620 mode.dropper = false; 672 621 var backgroundIMG; 673 622 ··· 675 624 backgroundIMG = "none"; 676 625 } 677 626 678 - DOM.$pixelSizeDemoDiv.css("background-image", backgroundIMG); 679 - DOM.$colorPickerDemo.css({ 680 - "background-image": backgroundIMG, 681 - "background-color": pixel.color, 627 + if (DOM.$pixelSizeDemoDiv) { 628 + DOM.$pixelSizeDemoDiv.style.backgroundImage = backgroundIMG; 629 + } 630 + Array.from(DOM.$colorPickerDemo).forEach(function (demo) { 631 + demo.style.backgroundImage = backgroundIMG; 632 + demo.style.backgroundColor = pixel.color; 682 633 }); 683 - DOM.$hex.val(rgbToHex(pixel.color)); 634 + if (DOM.$hex) { 635 + DOM.$hex.value = rgbToHex(pixel.color); 636 + } 684 637 } else if (mode.save) { 685 - DOM.$buttonSaveSelection.click(); 638 + if (DOM.$buttonSaveSelection) { 639 + DOM.$buttonSaveSelection.click(); 640 + } 686 641 } else if (mode.copy || mode.cut) { 687 - DOM.$overlay.addClass(classes.hidden); 642 + if (DOM.$overlay) { 643 + DOM.$overlay.classList.add(classes.hidden); 644 + } 688 645 } else if (mode.paste) { 689 - DOM.$pasteInstructions.addClass(classes.hidden); 646 + if (DOM.$pasteInstructions) { 647 + DOM.$pasteInstructions.classList.add(classes.hidden); 648 + } 690 649 } 691 650 692 651 for (var prop in mode) { ··· 695 654 } 696 655 } 697 656 698 - DOM.$toolButtons.removeClass(classes.currentTool); 657 + Array.from(DOM.$toolButtons).forEach(function (btn) { 658 + btn.classList.remove(classes.currentTool); 659 + }); 699 660 }; 700 661 701 662 var init8bitPicker = function () { 702 663 // turns palette into canvas 703 - pickerPaletteCtx = DOM.$8bitPicker[0].getContext("2d", { willReadFrequently: true }); 664 + pickerPaletteCtx = DOM.$8bitPicker.getContext("2d"); 704 665 var img = new Image(); 705 666 img.onload = function () { 706 667 pickerPaletteCtx.drawImage(img, 0, 0); ··· 718 679 var sanitizedColors = sanitizeColorArray(colorHistory); 719 680 720 681 sanitizedColors.forEach(function (color) { 721 - var latestColorButton = $( 722 - '<li><button role="button" class="button color" style="background-color:#' + 723 - color + 724 - '" title="history:#' + 725 - color + 726 - '" data-color="#' + 727 - color + 728 - '" /> </button></li>' 729 - ); 730 - DOM.$colorHistoryPalette.append(latestColorButton); 682 + var li = document.createElement("li"); 683 + var button = document.createElement("button"); 684 + button.setAttribute("role", "button"); 685 + button.className = "button color"; 686 + button.style.backgroundColor = "#" + color; 687 + button.setAttribute("title", "history:#" + color); 688 + button.setAttribute("data-color", "#" + color); 689 + li.appendChild(button); 690 + if (DOM.$colorHistoryPalette) { 691 + DOM.$colorHistoryPalette.appendChild(li); 692 + } 731 693 }); 732 694 733 695 // bind click to color buttons 734 - DOM.$color = $("." + classes.color); 735 - DOM.$color.click(bindColorClick); 696 + DOM.$color = document.querySelectorAll("." + classes.color); 697 + Array.from(DOM.$color).forEach(function (btn) { 698 + btn.addEventListener("click", bindColorClick); 699 + }); 736 700 } 737 701 }; 738 702 739 703 var generateBackgroundGrid = function (pixelSize) { 740 704 var bgCanvas = document.createElement("canvas"), 741 - bgCtx = bgCanvas.getContext("2d", { willReadFrequently: true }), 705 + bgCtx = bgCanvas.getContext("2d"), 742 706 width = pixelSize * 2, 743 707 height = pixelSize * 2; 744 708 ··· 767 731 rectangleSelection.endY = roundToNearestPixel(e.pageY); 768 732 769 733 // temporary canvas to save image 770 - DOM.$body.append('<canvas id="' + classes.selectionCanvas + '"></canvas>'); 771 - var $tempCanvas = $("#" + classes.selectionCanvas); 772 - var tempCtx = $tempCanvas[0].getContext("2d"); 734 + var tempCanvas = document.createElement("canvas"); 735 + tempCanvas.id = classes.selectionCanvas; 736 + DOM.$body.appendChild(tempCanvas); 737 + var tempCtx = tempCanvas.getContext("2d"); 773 738 774 739 // set dimensions and draw based on selection 775 740 var width = Math.abs(rectangleSelection.endX - rectangleSelection.startX); 776 741 var height = Math.abs(rectangleSelection.endY - rectangleSelection.startY); 777 - $tempCanvas[0].width = width; 778 - $tempCanvas[0].height = height; 742 + tempCanvas.width = width; 743 + tempCanvas.height = height; 779 744 780 745 var startX = Math.min(rectangleSelection.startX, rectangleSelection.endX); 781 746 var startY = Math.min(rectangleSelection.startY, rectangleSelection.endY); 782 747 783 - if (width && height) { 748 + if (width && height && DOM.$canvas) { 784 749 tempCtx.drawImage( 785 - DOM.$canvas[0], 750 + DOM.$canvas, 786 751 startX, 787 752 startY, 788 753 width, ··· 792 757 width, 793 758 height 794 759 ); 795 - var img = $tempCanvas[0].toDataURL("image/png"); 760 + var img = tempCanvas.toDataURL("image/png"); 796 761 797 762 if (mode === action.save) { 798 763 displayFinishedArt(img); 799 - DOM.$buttonSaveSelection.click(); 800 - DOM.$saveModalContainer.removeClass(classes.hidden); 764 + if (DOM.$buttonSaveSelection) { 765 + DOM.$buttonSaveSelection.click(); 766 + } 767 + if (DOM.$saveModalContainer) { 768 + DOM.$saveModalContainer.classList.remove(classes.hidden); 769 + } 801 770 } else { 802 771 clipboard = new Image(); 803 772 clipboard.src = img; 804 773 805 774 if (mode === action.cut) { 806 - var originalImage = DOM.$canvas[0].toDataURL("image/png"); 807 - ctx.clearRect(startX, startY, width, height); 808 - DOM.$cut.click(); 775 + var originalImage = DOM.$canvas.toDataURL("image/png"); 776 + if (ctx) { 777 + ctx.clearRect(startX, startY, width, height); 778 + } 779 + if (DOM.$cut) { 780 + DOM.$cut.click(); 781 + } 809 782 810 783 // add "cut" action to undo/redo array 811 - var newImage = DOM.$canvas[0].toDataURL("image/png"); 784 + var newImage = DOM.$canvas.toDataURL("image/png"); 812 785 action.index++; 813 786 drawPathId = Date(); 814 787 pushToHistory( ··· 830 803 831 804 if (mode === action.copy) { 832 805 // trigger copy click 833 - DOM.$copy.click(); 806 + if (DOM.$copy) { 807 + DOM.$copy.click(); 808 + } 834 809 } 835 810 } 836 811 } 837 812 838 813 // remove tempCanvas 839 - $tempCanvas.remove(); 814 + if (tempCanvas.parentNode) { 815 + tempCanvas.parentNode.removeChild(tempCanvas); 816 + } 840 817 }; 841 818 842 819 var drawSelection = function (e) { 820 + if (!DOM.$overlay || !ctxOverlay) { 821 + return; 822 + } 843 823 rectangleSelection.w = roundToNearestPixel( 844 - e.pageX - this.offsetLeft - rectangleSelection.startX 824 + e.pageX - DOM.$overlay.offsetLeft - rectangleSelection.startX 845 825 ); 846 826 rectangleSelection.h = roundToNearestPixel( 847 - e.pageY - this.offsetTop - rectangleSelection.startY 827 + e.pageY - DOM.$overlay.offsetTop - rectangleSelection.startY 848 828 ); 849 - ctxOverlay.clearRect(0, 0, DOM.$overlay.width(), DOM.$overlay.height()); 829 + ctxOverlay.clearRect(0, 0, DOM.$overlay.width, DOM.$overlay.height); 850 830 ctxOverlay.fillStyle = "rgba(0,0,0,.5)"; 851 - ctxOverlay.fillRect(0, 0, DOM.$overlay.width(), DOM.$overlay.height()); 831 + ctxOverlay.fillRect(0, 0, DOM.$overlay.width, DOM.$overlay.height); 852 832 ctxOverlay.clearRect( 853 833 rectangleSelection.startX, 854 834 rectangleSelection.startY, ··· 858 838 }; 859 839 860 840 var displayFinishedArt = function (src) { 861 - DOM.$saveImg.attr("src", src); 862 - DOM.$saveImg.parent().attr("href", src); 863 - DOM.$saveModalContainer.removeClass(classes.hidden); 864 - DOM.$saveModalContainer.find(".ui-hider").focus(); 841 + if (DOM.$saveImg) { 842 + DOM.$saveImg.setAttribute("src", src); 843 + if (DOM.$saveImg.parentElement) { 844 + DOM.$saveImg.parentElement.setAttribute("href", src); 845 + } 846 + } 847 + if (DOM.$saveModalContainer) { 848 + DOM.$saveModalContainer.classList.remove(classes.hidden); 849 + var hider = DOM.$saveModalContainer.querySelector(".ui-hider"); 850 + if (hider) { 851 + hider.focus(); 852 + } 853 + } 865 854 }; 866 855 867 856 var renderLocalGallery = function () { 868 857 if (savedCanvasArray.length === 0) { 869 - DOM.$openLocalModalContainer.addClass(classes.hidden); 870 - DOM.$openLocalForm.addClass(classes.hidden); 858 + if (DOM.$openLocalModalContainer) { 859 + DOM.$openLocalModalContainer.classList.add(classes.hidden); 860 + } 861 + if (DOM.$openLocalForm) { 862 + DOM.$openLocalForm.classList.add(classes.hidden); 863 + } 871 864 return; 872 865 } 873 866 874 - DOM.$openLocalForm.removeClass(classes.hidden); 875 - DOM.$openLocalGalleryItems.remove(); 867 + if (DOM.$openLocalForm) { 868 + DOM.$openLocalForm.classList.remove(classes.hidden); 869 + } 870 + if (DOM.$openLocalGallery) { 871 + DOM.$openLocalGallery.innerHTML = ""; 872 + } 876 873 877 874 for (var i = 0; i < savedCanvasArray.length; i++) { 878 - var $li = $( 879 - '<li data-local="' + 880 - i + 881 - '">' + 882 - '<button role="button" class="thumb"><img src="' + 883 - savedCanvasArray[i] + 884 - '" alt="open thumbnail #' + 885 - i + 886 - '" /></button>' + 887 - '<button role="button" class="delete"><img class="delete" src="assets/draggybits/hider.png" alt="delete thumbnail #' + 888 - i + 889 - '"></button>' + 890 - "</li>" 891 - ); 892 - DOM.$openLocalGallery.append($li); 875 + var li = document.createElement("li"); 876 + li.setAttribute("data-local", i); 877 + 878 + var thumbButton = document.createElement("button"); 879 + thumbButton.setAttribute("role", "button"); 880 + thumbButton.className = "thumb"; 881 + var thumbImg = document.createElement("img"); 882 + thumbImg.src = savedCanvasArray[i]; 883 + thumbImg.alt = "open thumbnail #" + i; 884 + thumbButton.appendChild(thumbImg); 885 + 886 + var deleteButton = document.createElement("button"); 887 + deleteButton.setAttribute("role", "button"); 888 + deleteButton.className = "delete"; 889 + var deleteImg = document.createElement("img"); 890 + deleteImg.className = "delete"; 891 + deleteImg.src = "assets/draggydivs/hider.png"; 892 + deleteImg.alt = "delete thumbnail #" + i; 893 + deleteButton.appendChild(deleteImg); 894 + 895 + li.appendChild(thumbButton); 896 + li.appendChild(deleteButton); 897 + 898 + if (DOM.$openLocalGallery) { 899 + DOM.$openLocalGallery.appendChild(li); 900 + } 893 901 } 894 902 895 - DOM.$openLocalGalleryItems = DOM.$openLocalGallery.find("li"); 896 - DOM.$openLocalGalleryItemThumbs = DOM.$openLocalGallery.find(".thumb"); 897 - DOM.$openLocalGalleryItemDelete = DOM.$openLocalGallery.find(".delete"); 903 + DOM.$openLocalGalleryItems = DOM.$openLocalGallery 904 + ? DOM.$openLocalGallery.querySelectorAll("li") 905 + : []; 906 + var thumbs = DOM.$openLocalGallery 907 + ? DOM.$openLocalGallery.querySelectorAll(".thumb") 908 + : []; 909 + var deletes = DOM.$openLocalGallery 910 + ? DOM.$openLocalGallery.querySelectorAll(".delete") 911 + : []; 898 912 899 - DOM.$openLocalGalleryItemThumbs.click(function () { 900 - var img = savedCanvasArray[$(this).parent("li").data("local")]; 901 - drawToCanvas(img, 0, 0, true); 902 - DOM.$openLocalModalContainer.addClass(classes.hidden); 913 + Array.from(thumbs).forEach(function (thumb) { 914 + thumb.addEventListener("click", function () { 915 + var li = thumb.closest("li"); 916 + var index = parseInt(li.getAttribute("data-local"), 10); 917 + var img = savedCanvasArray[index]; 918 + drawToCanvas(img, 0, 0, true); 919 + if (DOM.$openLocalModalContainer) { 920 + DOM.$openLocalModalContainer.classList.add(classes.hidden); 921 + } 922 + }); 903 923 }); 904 924 905 925 // delete locally 906 - DOM.$openLocalGalleryItemDelete.click(function () { 907 - if ( 908 - window.confirm( 909 - "Careful! This will permanently delete this thumbnail's art from your browser." 910 - ) 911 - ) { 912 - savedCanvasArray.splice($(this).parent("li").data("local"), 1); 913 - localStorage.make8bitartSavedCanvasArray = 914 - JSON.stringify(savedCanvasArray); 915 - savedCanvasArray = JSON.parse(localStorage.make8bitartSavedCanvasArray); 916 - renderLocalGallery(); 917 - } 926 + Array.from(deletes).forEach(function (delBtn) { 927 + delBtn.addEventListener("click", function () { 928 + if ( 929 + window.confirm( 930 + "Careful! This will permanently delete this thumbnail's art from your browser." 931 + ) 932 + ) { 933 + var li = delBtn.closest("li"); 934 + var index = parseInt(li.getAttribute("data-local"), 10); 935 + savedCanvasArray.splice(index, 1); 936 + localStorage.make8bitartSavedCanvasArray = 937 + JSON.stringify(savedCanvasArray); 938 + savedCanvasArray = JSON.parse( 939 + localStorage.make8bitartSavedCanvasArray 940 + ); 941 + renderLocalGallery(); 942 + } 943 + }); 918 944 }); 919 945 }; 920 946 921 947 var saveToLocalStorage = function () { 922 - if (canStorage()) { 923 - savedCanvas = DOM.$canvas[0].toDataURL("image/png"); 948 + if (canStorage() && DOM.$canvas) { 949 + savedCanvas = DOM.$canvas.toDataURL("image/png"); 924 950 localStorage.make8bitartSavedCanvas = savedCanvas; 925 951 } 926 952 }; 927 953 928 954 var saveToLocalStorageArray = function () { 929 - if (canStorage()) { 955 + if (canStorage() && DOM.$canvas) { 930 956 //parsejson 931 957 if (localStorage.make8bitartSavedCanvasArray) { 932 958 savedCanvasArray = JSON.parse(localStorage.make8bitartSavedCanvasArray); ··· 935 961 } 936 962 937 963 //push 938 - savedCanvasArray.push(DOM.$canvas[0].toDataURL("image/png")); 964 + savedCanvasArray.push(DOM.$canvas.toDataURL("image/png")); 939 965 940 966 //stringify 941 967 localStorage.make8bitartSavedCanvasArray = ··· 943 969 } 944 970 }; 945 971 946 - var uploadToImgur = function () { 947 - var imgDataURL = DOM.$saveImg 948 - .attr("src") 949 - .replace(/^data:image\/(png|jpg);base64,/, ""); 950 - $.ajax({ 951 - method: "POST", 952 - url: "https://api.imgur.com/3/image", 953 - headers: { 954 - Authorization: "Client-ID " + imgur.clientId, 955 - }, 956 - dataType: "json", 957 - data: { 958 - image: imgDataURL, 959 - type: "base64", 960 - title: "made on make8bitart.com", 961 - description: "made on make8bitart.com", 962 - }, 963 - success: function (result) { 964 - var directURL = result.data.link; 965 - var shareURL = "https://imgur.com/gallery/" + result.data.id; 966 - var imgurHTML = 967 - '<p>image link: <a target="_blank" href="' + 968 - directURL + 969 - '">' + 970 - directURL + 971 - "</a></p>"; 972 - DOM.$linkImgur.html(imgurHTML); 973 - DOM.$buttonSaveImgur.addClass(classes.hidden); 974 - }, 975 - error: function (result) { 976 - DOM.$linkImgur.text("There was an error saving to Imgur."); 977 - }, 978 - }); 979 - }; 980 - 981 972 /* colors */ 982 973 983 974 var getRGBColor = function (imageData) { ··· 1044 1035 1045 1036 var setDropperColor = function (color) { 1046 1037 pixel.color = color; 1047 - DOM.$color.removeClass(classes.current); 1048 - DOM.$pixelSizeDemoDiv.css("background-image", "none"); 1049 - DOM.$colorPickerDemo.css("background-image", "none"); 1050 - DOM.$pixelSizeDemoDiv.css("background-color", pixel.color); 1051 - DOM.$colorPickerDemo.css("background-color", pixel.color); 1052 - DOM.$hex.val(rgbToHex(DOM.$colorPickerDemo.css("background-color"))); 1053 - DOM.$draggydivs.css("box-shadow", "5px 5px 0 " + pixel.color); 1038 + Array.from(DOM.$color).forEach(function (btn) { 1039 + btn.classList.remove(classes.current); 1040 + }); 1041 + if (DOM.$pixelSizeDemoDiv) { 1042 + DOM.$pixelSizeDemoDiv.style.backgroundImage = "none"; 1043 + DOM.$pixelSizeDemoDiv.style.backgroundColor = pixel.color; 1044 + } 1045 + Array.from(DOM.$colorPickerDemo).forEach(function (demo) { 1046 + demo.style.backgroundImage = "none"; 1047 + demo.style.backgroundColor = pixel.color; 1048 + }); 1049 + var demoColor = 1050 + DOM.$colorPickerDemo.length > 0 1051 + ? window.getComputedStyle(DOM.$colorPickerDemo[0]).backgroundColor 1052 + : pixel.color; 1053 + if (DOM.$hex) { 1054 + DOM.$hex.value = rgbToHex(demoColor); 1055 + } 1056 + Array.from(DOM.$draggydivs).forEach(function (div) { 1057 + div.style.boxShadow = "5px 5px 0 " + pixel.color; 1058 + }); 1054 1059 }; 1055 1060 1056 1061 var hexColorChosen = function () { 1057 - var newColor = "#" + DOM.$hex.val(); 1058 - $("." + classes.current).removeClass(classes.current); 1059 - DOM.$hex.addClass(classes.current); 1062 + if (!DOM.$hex) { 1063 + return; 1064 + } 1065 + var newColor = "#" + DOM.$hex.value; 1066 + document.querySelectorAll("." + classes.current).forEach(function (el) { 1067 + el.classList.remove(classes.current); 1068 + }); 1069 + DOM.$hex.classList.add(classes.current); 1060 1070 1061 1071 pixel.color = newColor; 1062 - DOM.$colorPickerDemo.css("background-color", newColor); 1063 - DOM.$draggydivs.css("box-shadow", "5px 5px 0 " + newColor); 1072 + Array.from(DOM.$colorPickerDemo).forEach(function (demo) { 1073 + demo.style.backgroundColor = newColor; 1074 + }); 1075 + Array.from(DOM.$draggydivs).forEach(function (div) { 1076 + div.style.boxShadow = "5px 5px 0 " + newColor; 1077 + }); 1064 1078 }; 1065 1079 1066 1080 var areColorsEqual = function (alpha, beta) { ··· 1078 1092 }; 1079 1093 1080 1094 var updateColorHistoryPalette = function () { 1095 + if (!DOM.$colorHistoryPalette) { 1096 + return; 1097 + } 1081 1098 var hexColor = rgbToHex(pixel.color); 1082 1099 var colorHistoryPos = colorHistory.indexOf(hexColor); 1100 + var items; 1083 1101 if (colorHistoryPos === -1) { 1084 1102 if (colorHistory.length === 20) { 1085 1103 colorHistory.pop(); 1086 - DOM.$colorHistoryPalette.find("li").eq(19).remove(); 1104 + items = DOM.$colorHistoryPalette.querySelectorAll("li"); 1105 + if (items.length > 19 && items[19].parentNode) { 1106 + items[19].parentNode.removeChild(items[19]); 1107 + } 1087 1108 } 1088 1109 } else { 1089 1110 colorHistory.splice(colorHistoryPos, 1); 1090 - DOM.$colorHistoryPalette.find("li").eq(colorHistoryPos).remove(); 1111 + items = DOM.$colorHistoryPalette.querySelectorAll("li"); 1112 + if (items[colorHistoryPos] && items[colorHistoryPos].parentNode) { 1113 + items[colorHistoryPos].parentNode.removeChild(items[colorHistoryPos]); 1114 + } 1091 1115 } 1092 1116 1093 1117 colorHistory.unshift(hexColor); 1094 1118 1095 - var latestColorButton = $( 1096 - '<li><button role="button" class="button color" style="background-color:#' + 1097 - hexColor + 1098 - '" title="history:#' + 1099 - hexColor + 1100 - '" data-color="#' + 1101 - hexColor + 1102 - '" /> </button></li>' 1119 + var li = document.createElement("li"); 1120 + var button = document.createElement("button"); 1121 + button.setAttribute("role", "button"); 1122 + button.className = "button color"; 1123 + button.style.backgroundColor = "#" + hexColor; 1124 + button.setAttribute("title", "history:#" + hexColor); 1125 + button.setAttribute("data-color", "#" + hexColor); 1126 + li.appendChild(button); 1127 + DOM.$colorHistoryPalette.insertBefore( 1128 + li, 1129 + DOM.$colorHistoryPalette.firstChild 1103 1130 ); 1104 - DOM.$colorHistoryPalette.prepend(latestColorButton); 1105 - latestColorButton.find("a").addClass(classes.current); 1131 + button.classList.add(classes.current); 1106 1132 1107 1133 // bind click to new colors 1108 - DOM.$color = $("." + classes.color); 1109 - DOM.$color.click(bindColorClick); 1110 - DOM.$colorHistoryModule.removeClass(classes.hidden); 1134 + DOM.$color = document.querySelectorAll("." + classes.color); 1135 + Array.from(DOM.$color).forEach(function (btn) { 1136 + btn.addEventListener("click", bindColorClick); 1137 + }); 1138 + if (DOM.$colorHistoryModule) { 1139 + DOM.$colorHistoryModule.classList.remove(classes.hidden); 1140 + } 1111 1141 1112 1142 // save to local storage 1113 1143 if (canStorage()) { ··· 1150 1180 }; 1151 1181 1152 1182 var importPXON = function (e) { 1153 - var file = $(this).prop("files")[0]; 1154 - getFileData(file); 1183 + var file = e.target.files[0]; 1184 + if (file) { 1185 + getFileData(file); 1186 + } 1155 1187 }; 1156 1188 1157 1189 var exportPXON = function (e) { ··· 1172 1204 pxon.pxif.pixels = drawHistory; 1173 1205 1174 1206 // open pxon modal 1175 - DOM.$pxonModalContainer.removeClass(classes.hidden); 1176 - DOM.$pxonModalContainer.find(".ui-hider").focus(); 1177 - 1178 - var pxonData = JSON.stringify(pxon); 1179 - DOM.$pxonModalContainer.find("textarea").html(pxonData); 1207 + if (DOM.$pxonModalContainer) { 1208 + DOM.$pxonModalContainer.classList.remove(classes.hidden); 1209 + var hider = DOM.$pxonModalContainer.querySelector(".ui-hider"); 1210 + if (hider) { 1211 + hider.focus(); 1212 + } 1213 + var textarea = DOM.$pxonModalContainer.querySelector("textarea"); 1214 + if (textarea) { 1215 + var pxonData = JSON.stringify(pxon); 1216 + textarea.value = pxonData; 1217 + } 1218 + } 1180 1219 }; 1181 1220 1182 1221 /*** EVENTS ***/ ··· 1196 1235 if (mode.dropper) { 1197 1236 mode.dropper = false; 1198 1237 setDropperColor(origRGB); 1199 - DOM.$canvas.removeClass(classes.dropperMode); 1200 - DOM.$dropper.removeClass(classes.currentTool).removeAttr("style"); 1238 + if (DOM.$canvas) { 1239 + DOM.$canvas.classList.remove(classes.dropperMode); 1240 + } 1241 + if (DOM.$dropper) { 1242 + DOM.$dropper.classList.remove(classes.currentTool); 1243 + DOM.$dropper.removeAttribute("style"); 1244 + } 1201 1245 } else if (mode.paste) { 1202 1246 var x = Math.ceil(e.pageX / pixel.size) * pixel.size - pixel.size; 1203 1247 var y = Math.ceil(e.pageY / pixel.size) * pixel.size - pixel.size; 1204 1248 1205 - var originalImage = DOM.$canvas[0].toDataURL("image/png"); 1249 + if (!DOM.$canvas || !ctx) { 1250 + return; 1251 + } 1252 + var originalImage = DOM.$canvas.toDataURL("image/png"); 1206 1253 ctx.drawImage(clipboard, x, y); 1207 1254 1208 1255 // reset history 1209 1256 undoRedoHistory = undoRedoHistory.slice(0, historyPointer + 1); 1210 - DOM.$redo.attr("disabled", "disabled"); 1257 + if (DOM.$redo) { 1258 + DOM.$redo.setAttribute("disabled", "disabled"); 1259 + } 1211 1260 1212 1261 // add action to undo/redo 1213 - var newImage = DOM.$canvas[0].toDataURL("image/png"); 1262 + var newImage = DOM.$canvas.toDataURL("image/png"); 1214 1263 action.index++; 1215 1264 drawPathId = Date(); 1216 1265 pushToHistory( ··· 1229 1278 // save to local storage 1230 1279 saveToLocalStorage(); 1231 1280 1232 - DOM.$paste.click(); 1281 + if (DOM.$paste) { 1282 + DOM.$paste.click(); 1283 + } 1233 1284 } else if (!mode.save && !mode.copy && !mode.cut) { 1234 1285 // reset history 1235 1286 undoRedoHistory = undoRedoHistory.slice(0, historyPointer + 1); 1236 - DOM.$redo.attr("disabled", "disabled"); 1287 + if (DOM.$redo) { 1288 + DOM.$redo.setAttribute("disabled", "disabled"); 1289 + } 1237 1290 1238 1291 if (mode.paint && !areColorsEqual(origRGB, pixel.color)) { 1239 1292 action.index++; ··· 1262 1315 ); 1263 1316 } 1264 1317 1265 - DOM.$canvas.on("mousemove", drawOnMove); 1318 + if (DOM.$canvas) { 1319 + DOM.$canvas.addEventListener("mousemove", drawOnMove); 1320 + } 1266 1321 1267 1322 // touch 1268 - DOM.$canvas[0].addEventListener("touchmove", touchDraw, { 1269 - passive: true, 1270 - }); 1323 + if (DOM.$canvas) { 1324 + DOM.$canvas.addEventListener("touchmove", touchDraw, false); 1325 + } 1271 1326 1272 1327 // update color history palette - shows latest 20 colors used 1273 1328 if (pixel.color !== "rgba(0, 0, 0, 0)") { ··· 1277 1332 } else { 1278 1333 // overlay stuff 1279 1334 rectangleSelection = {}; 1280 - rectangleSelection.startX = roundToNearestPixel( 1281 - e.pageX - this.offsetLeft 1282 - ); 1283 - rectangleSelection.startY = roundToNearestPixel(e.pageY - this.offsetTop); 1284 - DOM.$overlay.on("mousemove", drawSelection); 1335 + if (DOM.$overlay) { 1336 + rectangleSelection.startX = roundToNearestPixel( 1337 + e.pageX - DOM.$overlay.offsetLeft 1338 + ); 1339 + rectangleSelection.startY = roundToNearestPixel( 1340 + e.pageY - DOM.$overlay.offsetTop 1341 + ); 1342 + DOM.$overlay.addEventListener("mousemove", drawSelection); 1343 + } 1285 1344 1286 1345 // touch 1287 - DOM.$overlay[0].addEventListener("touchmove", drawSelection, { 1288 - passive: true, 1289 - }); 1346 + if (DOM.$overlay) { 1347 + DOM.$overlay.addEventListener("touchmove", drawSelection, false); 1348 + } 1290 1349 } 1291 1350 }; 1292 1351 ··· 1296 1355 } 1297 1356 1298 1357 if (!mode.save && !mode.copy && !mode.cut) { 1299 - DOM.$canvas.off("mousemove"); 1358 + if (DOM.$canvas) { 1359 + DOM.$canvas.removeEventListener("mousemove", drawOnMove); 1360 + } 1300 1361 mode.drawing = false; 1301 1362 drawPathId = null; 1302 1363 1303 1364 saveToLocalStorage(); 1304 1365 } else { 1305 - DOM.$overlay.off("mousemove"); 1306 - ctxOverlay.clearRect(0, 0, DOM.$overlay.width(), DOM.$overlay.height()); 1366 + if (DOM.$overlay) { 1367 + DOM.$overlay.removeEventListener("mousemove", drawSelection); 1368 + } 1369 + if (ctxOverlay && DOM.$overlay) { 1370 + ctxOverlay.clearRect(0, 0, DOM.$overlay.width, DOM.$overlay.height); 1371 + } 1307 1372 1308 1373 if (mode.save) { 1309 1374 generateSelection(e, "save"); ··· 1316 1381 }; 1317 1382 1318 1383 var onRightClick = function (e) { 1384 + e.preventDefault(); 1319 1385 resetModes(); 1386 + if (!ctx) { 1387 + return false; 1388 + } 1320 1389 var origData = ctx.getImageData(e.pageX, e.pageY, 1, 1).data; 1321 1390 var origRGB = getRGBColor(origData); 1322 1391 1323 1392 setDropperColor(origRGB); 1324 1393 1325 - DOM.$canvas.removeClass(classes.dropperMode); 1326 - DOM.$dropper.removeClass(classes.currentTool).removeAttr("style"); 1394 + if (DOM.$canvas) { 1395 + DOM.$canvas.classList.remove(classes.dropperMode); 1396 + } 1397 + if (DOM.$dropper) { 1398 + DOM.$dropper.classList.remove(classes.currentTool); 1399 + DOM.$dropper.removeAttribute("style"); 1400 + } 1327 1401 1328 1402 return false; 1329 1403 }; ··· 1331 1405 /* tools */ 1332 1406 1333 1407 // draw clicked 1334 - DOM.$pencil.click(function (e) { 1335 - e.preventDefault(); 1336 - resetModes(); 1337 - $(this).addClass(classes.currentTool); 1338 - }); 1408 + if (DOM.$pencil) { 1409 + DOM.$pencil.addEventListener("click", function (e) { 1410 + e.preventDefault(); 1411 + resetModes(); 1412 + this.classList.add(classes.currentTool); 1413 + }); 1414 + } 1339 1415 1340 1416 // paint clicked 1341 - DOM.$paint.click(function (e) { 1342 - e.preventDefault(); 1343 - resetModes(); 1344 - $(this).addClass(classes.currentTool); 1345 - mode.paint = true; 1346 - }); 1417 + if (DOM.$paint) { 1418 + DOM.$paint.addEventListener("click", function (e) { 1419 + e.preventDefault(); 1420 + resetModes(); 1421 + this.classList.add(classes.currentTool); 1422 + mode.paint = true; 1423 + }); 1424 + } 1347 1425 1348 1426 // pixel size slider changed 1349 - DOM.$pixelSizeInput.change(function () { 1350 - initPixel($(this).val()); 1427 + Array.from(DOM.$pixelSizeInput).forEach(function (input) { 1428 + input.addEventListener("change", function () { 1429 + initPixel(this.value); 1430 + }); 1351 1431 }); 1352 1432 1353 1433 // reset canvas 1354 - DOM.$buttonNewCanvas.click(function () { 1355 - resetCanvas(pixel.color, true); 1356 - saveToLocalStorage(); 1357 - }); 1434 + if (DOM.$buttonNewCanvas) { 1435 + DOM.$buttonNewCanvas.addEventListener("click", function () { 1436 + resetCanvas(pixel.color, true); 1437 + saveToLocalStorage(); 1438 + }); 1439 + } 1358 1440 1359 1441 // ensure elements are enabled before triggering a click event 1360 1442 var triggerClickForEnabled = function (elem) { 1361 1443 return function () { 1362 1444 // no-op if there is nothing to undo 1363 - if (elem.is(":disabled")) { 1445 + if (elem.disabled) { 1364 1446 return; 1365 1447 } 1366 1448 1367 1449 // trigger the click 1368 - elem.trigger("click"); 1450 + elem.click(); 1369 1451 }; 1370 1452 }; 1371 1453 1372 1454 // undo 1373 - DOM.$undo.click(function () { 1374 - undoRedo(historyPointer, true); 1375 - historyPointer--; 1455 + if (DOM.$undo) { 1456 + DOM.$undo.addEventListener("click", function () { 1457 + undoRedo(historyPointer, true); 1458 + historyPointer--; 1376 1459 1377 - DOM.$redo.removeAttr("disabled"); 1460 + if (DOM.$redo) { 1461 + DOM.$redo.removeAttribute("disabled"); 1462 + } 1378 1463 1379 - if (historyPointer < 0) { 1380 - DOM.$undo.attr("disabled", "disabled"); 1381 - } 1382 - }); 1464 + if (historyPointer < 0) { 1465 + DOM.$undo.setAttribute("disabled", "disabled"); 1466 + } 1467 + }); 1468 + } 1383 1469 1384 1470 // redo 1385 - DOM.$redo.click(function () { 1386 - historyPointer++; 1387 - undoRedo(historyPointer, false); 1471 + if (DOM.$redo) { 1472 + DOM.$redo.addEventListener("click", function () { 1473 + historyPointer++; 1474 + undoRedo(historyPointer, false); 1388 1475 1389 - DOM.$undo.removeAttr("disabled"); 1390 - if (historyPointer === undoRedoHistory.length - 1) { 1391 - DOM.$redo.attr("disabled", "disabled"); 1392 - } 1393 - }); 1476 + if (DOM.$undo) { 1477 + DOM.$undo.removeAttribute("disabled"); 1478 + } 1479 + if (historyPointer === undoRedoHistory.length - 1) { 1480 + DOM.$redo.setAttribute("disabled", "disabled"); 1481 + } 1482 + }); 1483 + } 1394 1484 1395 1485 // cut 1396 - DOM.$cut.click(function () { 1397 - resetModes(); 1398 - if (mode.cut) { 1399 - mode.cut = false; 1400 - $(this).removeClass(classes.currentTool); 1401 - DOM.$overlay.addClass(classes.hidden); 1402 - } else { 1403 - mode.cut = true; 1404 - ctxOverlay.fillRect(0, 0, DOM.$overlay.width(), DOM.$overlay.height()); 1405 - $(this).addClass(classes.currentTool); 1406 - DOM.$overlay.removeClass(classes.hidden); 1407 - } 1408 - }); 1486 + if (DOM.$cut) { 1487 + DOM.$cut.addEventListener("click", function () { 1488 + resetModes(); 1489 + if (mode.cut) { 1490 + mode.cut = false; 1491 + this.classList.remove(classes.currentTool); 1492 + if (DOM.$overlay) { 1493 + DOM.$overlay.classList.add(classes.hidden); 1494 + } 1495 + } else { 1496 + mode.cut = true; 1497 + if (ctxOverlay && DOM.$overlay) { 1498 + ctxOverlay.fillRect(0, 0, DOM.$overlay.width, DOM.$overlay.height); 1499 + } 1500 + this.classList.add(classes.currentTool); 1501 + if (DOM.$overlay) { 1502 + DOM.$overlay.classList.remove(classes.hidden); 1503 + } 1504 + } 1505 + }); 1506 + } 1409 1507 1410 1508 // copy 1411 - DOM.$copy.click(function () { 1412 - resetModes(); 1413 - if (mode.copy) { 1414 - mode.copy = false; 1415 - $(this).removeClass(classes.currentTool); 1416 - DOM.$overlay.addClass(classes.hidden); 1417 - } else { 1418 - mode.copy = true; 1419 - ctxOverlay.fillRect(0, 0, DOM.$overlay.width(), DOM.$overlay.height()); 1420 - $(this).addClass(classes.currentTool); 1421 - DOM.$overlay.removeClass(classes.hidden); 1422 - } 1423 - }); 1509 + if (DOM.$copy) { 1510 + DOM.$copy.addEventListener("click", function () { 1511 + resetModes(); 1512 + if (mode.copy) { 1513 + mode.copy = false; 1514 + this.classList.remove(classes.currentTool); 1515 + if (DOM.$overlay) { 1516 + DOM.$overlay.classList.add(classes.hidden); 1517 + } 1518 + } else { 1519 + mode.copy = true; 1520 + if (ctxOverlay && DOM.$overlay) { 1521 + ctxOverlay.fillRect(0, 0, DOM.$overlay.width, DOM.$overlay.height); 1522 + } 1523 + this.classList.add(classes.currentTool); 1524 + if (DOM.$overlay) { 1525 + DOM.$overlay.classList.remove(classes.hidden); 1526 + } 1527 + } 1528 + }); 1529 + } 1424 1530 1425 1531 // paste 1426 - DOM.$paste.click(function () { 1427 - if (!clipboard) { 1428 - return; 1429 - } 1430 - resetModes(); 1532 + if (DOM.$paste) { 1533 + DOM.$paste.addEventListener("click", function () { 1534 + if (!clipboard) { 1535 + return; 1536 + } 1537 + resetModes(); 1431 1538 1432 - if (!mode.paste) { 1433 - mode.paste = true; 1434 - $(this).addClass(classes.currentTool); 1539 + if (!mode.paste) { 1540 + mode.paste = true; 1541 + this.classList.add(classes.currentTool); 1435 1542 1436 - // show instructions 1437 - DOM.$pasteInstructions.addClass(classes.hidden); 1438 - } 1439 - }); 1543 + // show instructions 1544 + if (DOM.$pasteInstructions) { 1545 + DOM.$pasteInstructions.classList.add(classes.hidden); 1546 + } 1547 + } 1548 + }); 1549 + } 1440 1550 1441 1551 // undo alias to ctrl+z, macs aliased to cmd+z 1442 1552 key("ctrl+z, ⌘+z", triggerClickForEnabled(DOM.$undo)); ··· 1446 1556 1447 1557 // close save modal alias to esc 1448 1558 key("esc", function () { 1449 - DOM.$modalContainers.addClass(classes.hidden); 1559 + Array.from(DOM.$modalContainers).forEach(function (modal) { 1560 + modal.classList.add(classes.hidden); 1561 + }); 1450 1562 }); 1451 1563 1452 1564 // pencil tool (matches photoshop) ··· 1459 1571 1460 1572 // color click binding function 1461 1573 var bindColorClick = function () { 1462 - var $newColor = $(this); 1463 - var newColorLabel = $newColor.attr("data-color"); 1574 + var newColor = this; 1575 + var newColorLabel = newColor.getAttribute("data-color"); 1464 1576 var demoColor; 1465 1577 1466 - $("." + classes.current).removeClass(classes.current); 1467 - $newColor.addClass(classes.current); 1578 + document.querySelectorAll("." + classes.current).forEach(function (el) { 1579 + el.classList.remove(classes.current); 1580 + }); 1581 + newColor.classList.add(classes.current); 1468 1582 pixel.color = newColorLabel; 1469 1583 1470 1584 if (pixel.color !== "rgba(0, 0, 0, 0)") { 1471 1585 demoColor = pixel.color; 1472 - DOM.$pixelSizeDemoDiv.css("background-image", "none"); 1473 - DOM.$colorPickerDemo.css("background-image", "none"); 1586 + if (DOM.$pixelSizeDemoDiv) { 1587 + DOM.$pixelSizeDemoDiv.style.backgroundImage = "none"; 1588 + } 1589 + Array.from(DOM.$colorPickerDemo).forEach(function (demo) { 1590 + demo.style.backgroundImage = "none"; 1591 + }); 1474 1592 } else { 1475 - DOM.$pixelSizeDemoDiv.css("background-image", windowCanvas.background); 1476 - DOM.$colorPickerDemo.css("background-image", windowCanvas.background); 1477 - DOM.$hex.val(""); 1593 + if (DOM.$pixelSizeDemoDiv) { 1594 + DOM.$pixelSizeDemoDiv.style.backgroundImage = windowCanvas.background; 1595 + } 1596 + Array.from(DOM.$colorPickerDemo).forEach(function (demo) { 1597 + demo.style.backgroundImage = windowCanvas.background; 1598 + }); 1599 + if (DOM.$hex) { 1600 + DOM.$hex.value = ""; 1601 + } 1602 + } 1603 + if (DOM.$pixelSizeDemoDiv) { 1604 + DOM.$pixelSizeDemoDiv.style.backgroundColor = demoColor; 1478 1605 } 1479 - DOM.$pixelSizeDemoDiv.css("background-color", demoColor); 1480 - DOM.$colorPickerDemo.css("background-color", demoColor); 1481 - DOM.$hex.val(rgbToHex(DOM.$colorPickerDemo.css("background-color"))); 1482 - DOM.$draggydivs.css("box-shadow", "5px 5px 0 " + newColorLabel); 1606 + Array.from(DOM.$colorPickerDemo).forEach(function (demo) { 1607 + demo.style.backgroundColor = demoColor; 1608 + }); 1609 + var demoColorValue = 1610 + DOM.$colorPickerDemo.length > 0 1611 + ? window.getComputedStyle(DOM.$colorPickerDemo[0]).backgroundColor 1612 + : demoColor; 1613 + if (DOM.$hex) { 1614 + DOM.$hex.value = rgbToHex(demoColorValue); 1615 + } 1616 + Array.from(DOM.$draggydivs).forEach(function (div) { 1617 + div.style.boxShadow = "5px 5px 0 " + newColorLabel; 1618 + }); 1483 1619 }; 1484 1620 1485 1621 // choose color 1486 - DOM.$color.click(bindColorClick); 1622 + Array.from(DOM.$color).forEach(function (btn) { 1623 + btn.addEventListener("click", bindColorClick); 1624 + }); 1487 1625 1488 1626 // custom color hover 1489 - DOM.$8bitPicker.mouseover(function (e) { 1490 - $(this).mousemove(mousemovePickerPalette); 1491 - }); 1627 + if (DOM.$8bitPicker) { 1628 + var mousemoveHandler = null; 1629 + DOM.$8bitPicker.addEventListener("mouseover", function (e) { 1630 + mousemoveHandler = function (evt) { 1631 + mousemovePickerPalette(evt); 1632 + }; 1633 + this.addEventListener("mousemove", mousemoveHandler); 1634 + }); 1492 1635 1493 - DOM.$8bitPicker.mouseout(function (e) { 1494 - $(this).unbind("mouseover"); 1495 - DOM.$colorPickerDemo.css("background-color", pixel.color); 1496 - DOM.$hex.val(rgbToHex(DOM.$colorPickerDemo.css("background-color"))); 1497 - }); 1636 + DOM.$8bitPicker.addEventListener("mouseout", function (e) { 1637 + if (mousemoveHandler) { 1638 + this.removeEventListener("mousemove", mousemoveHandler); 1639 + mousemoveHandler = null; 1640 + } 1641 + var demoColor = 1642 + DOM.$colorPickerDemo.length > 0 1643 + ? window.getComputedStyle(DOM.$colorPickerDemo[0]).backgroundColor 1644 + : pixel.color; 1645 + Array.from(DOM.$colorPickerDemo).forEach(function (demo) { 1646 + demo.style.backgroundColor = pixel.color; 1647 + }); 1648 + if (DOM.$hex) { 1649 + DOM.$hex.value = rgbToHex(demoColor); 1650 + } 1651 + }); 1652 + } 1498 1653 1499 1654 var mousemovePickerPalette = function (e) { 1500 - var boundingRect = DOM.$8bitPicker.offset(); 1655 + if (!DOM.$8bitPicker || !pickerPaletteCtx) { 1656 + return; 1657 + } 1658 + var boundingRect = getElementOffset(DOM.$8bitPicker); 1501 1659 var hoverData = pickerPaletteCtx.getImageData( 1502 1660 e.pageX - boundingRect.left, 1503 1661 e.pageY - boundingRect.top, ··· 1505 1663 1 1506 1664 ).data; 1507 1665 var hoverRGB = getRGBColor(hoverData); 1508 - DOM.$pixelSizeDemoDiv.css("background-image", "none"); 1509 - DOM.$colorPickerDemo.css("background-image", "none"); 1510 - DOM.$colorPickerDemo.css("background-color", hoverRGB); 1511 - DOM.$hex.val(rgbToHex(hoverRGB)); 1666 + if (DOM.$pixelSizeDemoDiv) { 1667 + DOM.$pixelSizeDemoDiv.style.backgroundImage = "none"; 1668 + } 1669 + Array.from(DOM.$colorPickerDemo).forEach(function (demo) { 1670 + demo.style.backgroundImage = "none"; 1671 + demo.style.backgroundColor = hoverRGB; 1672 + }); 1673 + if (DOM.$hex) { 1674 + DOM.$hex.value = rgbToHex(hoverRGB); 1675 + } 1512 1676 }; 1513 1677 1514 1678 // custom color chosen 1515 - DOM.$8bitPicker.click(function (e) { 1516 - var boundingRect = DOM.$8bitPicker.offset(); 1517 - var clickData = pickerPaletteCtx.getImageData( 1518 - e.pageX - boundingRect.left, 1519 - e.pageY - boundingRect.top, 1520 - 1, 1521 - 1 1522 - ).data; 1523 - var newColor = getRGBColor(clickData); 1524 - $("." + classes.current).removeClass(classes.current); 1679 + if (DOM.$8bitPicker) { 1680 + DOM.$8bitPicker.addEventListener("click", function (e) { 1681 + if (!pickerPaletteCtx) { 1682 + return; 1683 + } 1684 + var boundingRect = getElementOffset(DOM.$8bitPicker); 1685 + var clickData = pickerPaletteCtx.getImageData( 1686 + e.pageX - boundingRect.left, 1687 + e.pageY - boundingRect.top, 1688 + 1, 1689 + 1 1690 + ).data; 1691 + var newColor = getRGBColor(clickData); 1692 + document.querySelectorAll("." + classes.current).forEach(function (el) { 1693 + el.classList.remove(classes.current); 1694 + }); 1525 1695 1526 - pixel.color = newColor; 1527 - DOM.$colorPickerDemo.css("background-color", newColor); 1528 - DOM.$draggydivs.css("box-shadow", "5px 5px 0 " + newColor); 1529 - }); 1696 + pixel.color = newColor; 1697 + Array.from(DOM.$colorPickerDemo).forEach(function (demo) { 1698 + demo.style.backgroundColor = newColor; 1699 + }); 1700 + Array.from(DOM.$draggydivs).forEach(function (div) { 1701 + div.style.boxShadow = "5px 5px 0 " + newColor; 1702 + }); 1703 + }); 1704 + } 1530 1705 1531 1706 // hex color input change 1532 - DOM.$hex.keyup(hexColorChosen); 1533 - DOM.$hex.focus(hexColorChosen); 1707 + if (DOM.$hex) { 1708 + DOM.$hex.addEventListener("keyup", hexColorChosen); 1709 + DOM.$hex.addEventListener("focus", hexColorChosen); 1710 + } 1534 1711 1535 1712 // color dropper clicked 1536 - DOM.$dropper.click(function (e) { 1537 - e.preventDefault(); 1713 + if (DOM.$dropper) { 1714 + DOM.$dropper.addEventListener("click", function (e) { 1715 + e.preventDefault(); 1538 1716 1539 - if (DOM.$dropper.hasClass(classes.currentTool)) { 1540 - resetModes(); 1541 - } else { 1542 - resetModes(); 1543 - mode.dropper = true; 1544 - DOM.$dropper.addClass(classes.currentTool); 1545 - DOM.$canvas.addClass(classes.dropperMode); 1717 + if (DOM.$dropper.classList.contains(classes.currentTool)) { 1718 + resetModes(); 1719 + } else { 1720 + resetModes(); 1721 + mode.dropper = true; 1722 + DOM.$dropper.classList.add(classes.currentTool); 1723 + if (DOM.$canvas) { 1724 + DOM.$canvas.classList.add(classes.dropperMode); 1725 + } 1546 1726 1547 - DOM.$canvas.mousemove(function (e) { 1548 - var hoverData = ctx.getImageData(e.pageX, e.pageY, 1, 1).data; 1549 - var hoverRGB = getRGBColor(hoverData); 1550 - DOM.$dropper.css("background-color", hoverRGB); 1727 + var dropperMousemove = function (evt) { 1728 + if (!ctx) { 1729 + return; 1730 + } 1731 + var hoverData = ctx.getImageData(evt.pageX, evt.pageY, 1, 1).data; 1732 + var hoverRGB = getRGBColor(hoverData); 1733 + if (DOM.$dropper) { 1734 + DOM.$dropper.style.backgroundColor = hoverRGB; 1735 + } 1736 + 1737 + if (DOM.$pixelSizeDemoDiv) { 1738 + DOM.$pixelSizeDemoDiv.style.backgroundImage = "none"; 1739 + } 1740 + Array.from(DOM.$colorPickerDemo).forEach(function (demo) { 1741 + demo.style.backgroundImage = "none"; 1742 + demo.style.backgroundColor = hoverRGB; 1743 + }); 1744 + if (DOM.$hex) { 1745 + DOM.$hex.value = rgbToHex(hoverRGB); 1746 + } 1747 + }; 1551 1748 1552 - DOM.$pixelSizeDemoDiv.css("background-image", "none"); 1553 - DOM.$colorPickerDemo.css({ 1554 - "background-image": "none", 1555 - "background-color": hoverRGB, 1556 - }); 1557 - DOM.$hex.val(rgbToHex(hoverRGB)); 1558 - }); 1559 - } 1560 - }); 1749 + if (DOM.$canvas) { 1750 + DOM.$canvas.addEventListener("mousemove", dropperMousemove); 1751 + } 1752 + } 1753 + }); 1754 + } 1561 1755 1562 1756 /* importing and exporting */ 1563 1757 1564 1758 // save locally 1565 - DOM.$buttonSaveLocal.click(function () { 1566 - saveToLocalStorageArray(); 1567 - renderLocalGallery(); 1759 + if (DOM.$buttonSaveLocal) { 1760 + DOM.$buttonSaveLocal.addEventListener("click", function () { 1761 + saveToLocalStorageArray(); 1762 + renderLocalGallery(); 1568 1763 1569 - alert( 1570 - 'Your art has been saved locally to your browser. You can see all locally saved art by clicking the "open existing art" button!' 1571 - ); 1572 - }); 1764 + alert( 1765 + 'Your art has been saved locally to your browser. You can see all locally saved art by clicking the "open existing art" button!' 1766 + ); 1767 + }); 1768 + } 1573 1769 1574 1770 // save full canvas 1575 - DOM.$buttonSaveFull.click(function () { 1576 - var savedPNG = DOM.$canvas[0].toDataURL("image/png"); 1577 - displayFinishedArt(savedPNG); 1578 - }); 1771 + if (DOM.$buttonSaveFull) { 1772 + DOM.$buttonSaveFull.addEventListener("click", function () { 1773 + if (DOM.$canvas) { 1774 + var savedPNG = DOM.$canvas.toDataURL("image/png"); 1775 + displayFinishedArt(savedPNG); 1776 + } 1777 + }); 1778 + } 1579 1779 1580 1780 // save selection of canvas button clicked 1581 - DOM.$buttonSaveSelection.click(function () { 1582 - if (mode.save) { 1583 - mode.save = false; 1584 - DOM.$saveInstruction.slideUp(); 1585 - $(this).val(copy.selectionOn); 1586 - DOM.$overlay.addClass(classes.hidden); 1587 - } else { 1588 - resetModes(); 1589 - mode.save = true; 1590 - DOM.$saveInstruction.slideDown(); 1591 - $(this).val(copy.selectionOff); 1592 - ctxOverlay.fillRect(0, 0, DOM.$overlay.width(), DOM.$overlay.height()); 1593 - DOM.$overlay.removeClass(classes.hidden); 1594 - } 1595 - }); 1781 + if (DOM.$buttonSaveSelection) { 1782 + DOM.$buttonSaveSelection.addEventListener("click", function () { 1783 + if (mode.save) { 1784 + mode.save = false; 1785 + if (DOM.$saveInstruction) { 1786 + DOM.$saveInstruction.style.display = "none"; 1787 + } 1788 + if (this.tagName === "INPUT" || this.tagName === "BUTTON") { 1789 + this.value = copy.selectionOn; 1790 + } 1791 + if (DOM.$overlay) { 1792 + DOM.$overlay.classList.add(classes.hidden); 1793 + } 1794 + } else { 1795 + resetModes(); 1796 + mode.save = true; 1797 + if (DOM.$saveInstruction) { 1798 + DOM.$saveInstruction.style.display = "block"; 1799 + } 1800 + if (this.tagName === "INPUT" || this.tagName === "BUTTON") { 1801 + this.value = copy.selectionOff; 1802 + } 1803 + if (ctxOverlay && DOM.$overlay) { 1804 + ctxOverlay.fillRect(0, 0, DOM.$overlay.width, DOM.$overlay.height); 1805 + } 1806 + if (DOM.$overlay) { 1807 + DOM.$overlay.classList.remove(classes.hidden); 1808 + } 1809 + } 1810 + }); 1811 + } 1596 1812 1597 1813 // open import local modal 1598 - DOM.$buttonOpenLocal.click(function () { 1599 - DOM.$openLocalModalContainer.removeClass(classes.hidden); 1600 - DOM.$openLocalModalContainer.find(".ui-hider").focus(); 1601 - }); 1814 + if (DOM.$buttonOpenLocal) { 1815 + DOM.$buttonOpenLocal.addEventListener("click", function () { 1816 + if (DOM.$openLocalModalContainer) { 1817 + DOM.$openLocalModalContainer.classList.remove(classes.hidden); 1818 + var hider = DOM.$openLocalModalContainer.querySelector(".ui-hider"); 1819 + if (hider) { 1820 + hider.focus(); 1821 + } 1822 + } 1823 + }); 1824 + } 1602 1825 1603 1826 // import pxon 1604 - DOM.$buttonImportPXON.change(importPXON); 1827 + if (DOM.$buttonImportPXON) { 1828 + DOM.$buttonImportPXON.addEventListener("change", importPXON); 1829 + } 1605 1830 1606 1831 // export pxon 1607 - DOM.$buttonExportPXON.click(exportPXON); 1832 + if (DOM.$buttonExportPXON) { 1833 + DOM.$buttonExportPXON.addEventListener("click", exportPXON); 1834 + } 1608 1835 1609 1836 // hide save modal container if exit button clicked 1610 - DOM.$modalExit.click(function () { 1611 - DOM.$modalContainers.addClass(classes.hidden); 1612 - DOM.$linkImgur.html(""); 1613 - DOM.$buttonSaveImgur.removeClass(classes.hidden); 1837 + Array.from(DOM.$modalExit).forEach(function (exit) { 1838 + exit.addEventListener("click", function () { 1839 + Array.from(DOM.$modalContainers).forEach(function (modal) { 1840 + modal.classList.add(classes.hidden); 1841 + }); 1842 + }); 1614 1843 }); 1615 1844 1616 1845 // hide save modal container if clicking outside of modal 1617 - DOM.$modalContainers.click(function (e) { 1618 - var target = $(e.target).context; 1619 - if ( 1620 - target === DOM.$saveModalContainer[0] || 1621 - target === DOM.$openLocalModalContainer[0] 1622 - ) { 1623 - $(this).addClass(classes.hidden); 1624 - } 1625 - }); 1626 - 1627 - // save to imgur 1628 - DOM.$buttonSaveImgur.click(function () { 1629 - uploadToImgur(); 1846 + Array.from(DOM.$modalContainers).forEach(function (container) { 1847 + container.addEventListener("click", function (e) { 1848 + var target = e.target; 1849 + if ( 1850 + target === DOM.$saveModalContainer || 1851 + target === DOM.$openLocalModalContainer 1852 + ) { 1853 + this.classList.add(classes.hidden); 1854 + } 1855 + }); 1630 1856 }); 1631 1857 1632 1858 /* misc */ 1633 1859 1634 1860 // tabs 1635 - DOM.$tabs.click(function (e) { 1636 - var activeTab = $(this); 1637 - var href = activeTab.attr("data-href"); 1638 - activeTab.siblings().removeClass(classes.activeTab); 1639 - activeTab.addClass(classes.activeTab); 1861 + Array.from(DOM.$tabs).forEach(function (tab) { 1862 + tab.addEventListener("click", function (e) { 1863 + var activeTab = this; 1864 + var href = activeTab.getAttribute("data-href"); 1865 + 1866 + // Remove active class from siblings 1867 + Array.from(activeTab.parentElement.children).forEach(function (sibling) { 1868 + sibling.classList.remove(classes.activeTab); 1869 + }); 1870 + activeTab.classList.add(classes.activeTab); 1871 + 1872 + var toHide = []; 1873 + Array.from(activeTab.parentElement.children).forEach(function (sibling) { 1874 + if (sibling !== activeTab) { 1875 + toHide.push(sibling.getAttribute("data-href")); 1876 + } 1877 + }); 1640 1878 1641 - var toHide = []; 1642 - activeTab.siblings().each(function () { 1643 - toHide.push($(this).attr("data-href")); 1879 + var targetElement = document.querySelector(href); 1880 + if (targetElement) { 1881 + targetElement.classList.remove(classes.hidden); 1882 + } 1883 + for (var i = 0; i < toHide.length; i++) { 1884 + var hideElement = document.querySelector(toHide[i]); 1885 + if (hideElement) { 1886 + hideElement.classList.add(classes.hidden); 1887 + } 1888 + } 1644 1889 }); 1890 + }); 1891 + 1892 + // canvas window size changes 1893 + window.addEventListener("resize", function () { 1894 + var windowWidth = window.innerWidth; 1895 + var windowHeight = window.innerHeight; 1896 + if ( 1897 + windowWidth - (windowWidth % pixel.size) <= windowCanvas.width && 1898 + windowHeight - (windowHeight % pixel.size) <= windowCanvas.height 1899 + ) { 1900 + return; 1901 + } else { 1902 + // if local storage 1903 + if (!canStorage() || mode.save) { 1904 + return; 1905 + } else { 1906 + var newWidth = windowWidth - (windowWidth % pixel.size); 1907 + var newHeight = windowHeight - (windowHeight % pixel.size); 1908 + 1909 + // save image 1910 + saveToLocalStorage(); 1645 1911 1646 - $(href).removeClass(classes.hidden); 1647 - for (var i = 0; i < toHide.length; i++) { 1648 - $(toHide[i]).addClass(classes.hidden); 1649 - } 1650 - }); 1912 + // set canvas size 1913 + setCanvasSize(newWidth, newHeight); 1651 1914 1652 - // canvas window size changes, with timeout to prevent lost art D: 1653 - DOM.$window.resize(function () { 1654 - clearTimeout(resizing); 1655 - resizing = setTimeout(resizeCanvas, 100); 1915 + // draw image 1916 + drawFromLocalStorage(); 1917 + } 1918 + } 1656 1919 }); 1657 1920 1658 1921 // clear color history, palette and storage 1659 - DOM.$colorHistoryTools.clearPalette.click(function () { 1660 - colorHistory = []; 1661 - DOM.$colorHistoryPalette.find("li").remove(); 1662 - localStorage.colorHistory = []; 1663 - DOM.$colorHistoryModule.addClass(classes.hidden); 1664 - }); 1922 + if (DOM.$colorHistoryTools && DOM.$colorHistoryTools.clearPalette) { 1923 + DOM.$colorHistoryTools.clearPalette.addEventListener("click", function () { 1924 + colorHistory = []; 1925 + if (DOM.$colorHistoryPalette) { 1926 + DOM.$colorHistoryPalette.innerHTML = ""; 1927 + } 1928 + localStorage.colorHistory = []; 1929 + if (DOM.$colorHistoryModule) { 1930 + DOM.$colorHistoryModule.classList.add(classes.hidden); 1931 + } 1932 + }); 1933 + } 1665 1934 1666 1935 // export color history 1667 - DOM.$colorHistoryTools.exportPalette.click(function () { 1668 - console.log("export coming soon"); 1669 - }); 1936 + if (DOM.$colorHistoryTools && DOM.$colorHistoryTools.exportPalette) { 1937 + DOM.$colorHistoryTools.exportPalette.addEventListener("click", function () { 1938 + console.log("export coming soon"); 1939 + }); 1940 + } 1670 1941 1671 1942 // clear custom colors palette 1672 - DOM.$colorCustomTools.clearPalette.click(function () { 1673 - DOM.$colorCustomPalette.find("li").remove(); 1674 - }); 1943 + if (DOM.$colorCustomTools && DOM.$colorCustomTools.clearPalette) { 1944 + DOM.$colorCustomTools.clearPalette.addEventListener("click", function () { 1945 + if (DOM.$colorCustomPalette) { 1946 + DOM.$colorCustomPalette.innerHTML = ""; 1947 + } 1948 + }); 1949 + } 1675 1950 1676 1951 // import custom colors palette 1677 - DOM.$colorCustomTools.importPalette.on("change", function (e) { 1678 - // get the file submitted 1679 - var file = $(this).prop("files")[0]; 1952 + if (DOM.$colorCustomTools && DOM.$colorCustomTools.importPalette) { 1953 + DOM.$colorCustomTools.importPalette.addEventListener( 1954 + "change", 1955 + function (e) { 1956 + // get the file submitted 1957 + var file = e.target.files[0]; 1958 + if (!file) { 1959 + return; 1960 + } 1680 1961 1681 - // helper function to parse csv data 1682 - var parseCSVData = function (data) { 1683 - // since we have csv data, clear the current custom palette 1684 - DOM.$colorCustomPalette.find("li").remove(); 1962 + // helper function to parse csv data 1963 + var parseCSVData = function (data) { 1964 + // since we have csv data, clear the current custom palette 1965 + if (DOM.$colorCustomPalette) { 1966 + DOM.$colorCustomPalette.innerHTML = ""; 1967 + } 1685 1968 1686 - // get csv text and parse 1687 - var csv = data.target.result; 1688 - var rows = csv.split(/\r\n|\n/); 1969 + // get csv text and parse 1970 + var csv = data.target.result; 1971 + var rows = csv.split(/\r\n|\n/); 1689 1972 1690 - for (var i = 0; i < rows.length; i++) { 1691 - var dataPair = rows[i].split(","); 1973 + for (var i = 0; i < rows.length; i++) { 1974 + if (!rows[i]) { 1975 + continue; 1976 + } 1977 + var dataPair = rows[i].split(","); 1692 1978 1693 - // create button, set properties, and add to palette 1694 - var $newCustomButton = $("<a>"); 1695 - $newCustomButton.attr({ 1696 - class: "button color", 1697 - style: "background-color:#" + dataPair[1], 1698 - title: dataPair[0], 1699 - "data-color": "#" + dataPair[1], 1700 - }); 1701 - var $newCustomButtonContainer = $("<li>").append($newCustomButton); 1702 - DOM.$colorCustomPalette.append($newCustomButtonContainer); 1703 - } 1979 + // create button, set properties, and add to palette 1980 + var newCustomButton = document.createElement("button"); 1981 + newCustomButton.className = "button color"; 1982 + newCustomButton.style.backgroundColor = "#" + dataPair[1]; 1983 + newCustomButton.setAttribute("title", dataPair[0]); 1984 + newCustomButton.setAttribute("data-color", "#" + dataPair[1]); 1704 1985 1705 - // set events to make these colors work 1706 - DOM.$color = $("." + classes.color); 1707 - DOM.$color.click(bindColorClick); 1708 - }; 1986 + var newCustomButtonContainer = document.createElement("li"); 1987 + newCustomButtonContainer.appendChild(newCustomButton); 1988 + if (DOM.$colorCustomPalette) { 1989 + DOM.$colorCustomPalette.appendChild(newCustomButtonContainer); 1990 + } 1991 + } 1709 1992 1710 - // read the file if browser has the FileReader API 1711 - if (window.FileReader) { 1712 - var fileReader = new FileReader(); 1713 - fileReader.readAsText(file); 1714 - fileReader.onload = parseCSVData; 1715 - fileReader.onerror = function () { 1716 - alert("Unable to read file. Try again."); 1717 - }; 1718 - } else { 1719 - alert( 1720 - "Your browser doesn't support FileReader, which is required for uploading custom palettes." 1721 - ); 1722 - } 1723 - }); 1993 + // set events to make these colors work 1994 + DOM.$color = document.querySelectorAll("." + classes.color); 1995 + Array.from(DOM.$color).forEach(function (btn) { 1996 + btn.addEventListener("click", bindColorClick); 1997 + }); 1998 + }; 1999 + 2000 + // read the file if browser has the FileReader API 2001 + if (window.FileReader) { 2002 + var fileReader = new FileReader(); 2003 + fileReader.readAsText(file); 2004 + fileReader.onload = parseCSVData; 2005 + fileReader.onerror = function () { 2006 + alert("Unable to read file. Try again."); 2007 + }; 2008 + } else { 2009 + alert( 2010 + "Your browser doesn't support FileReader, which is required for uploading custom palettes." 2011 + ); 2012 + } 2013 + } 2014 + ); 2015 + } 1724 2016 1725 2017 /*** INIT HA HA HA ***/ 1726 - DOM.$customPalettes.addClass(classes.hidden); 2018 + if (DOM.$customPalettes) { 2019 + DOM.$customPalettes.classList.add(classes.hidden); 2020 + } 1727 2021 generateCanvas(); 1728 2022 init8bitPicker(); 1729 2023 ··· 1732 2026 colorHistory = localStorage.colorHistory.split(","); 1733 2027 } else { 1734 2028 colorHistory = []; 1735 - DOM.$colorHistoryModule.addClass(classes.hidden); 2029 + if (DOM.$colorHistoryModule) { 2030 + DOM.$colorHistoryModule.classList.add(classes.hidden); 2031 + } 1736 2032 } 1737 2033 1738 2034 initColorHistoryPalette(); 1739 2035 initPixel(15); 1740 2036 1741 - // init hide toolboxes 1742 - DOM.$colorbox.draggyBits("minimize"); 1743 - DOM.$toolbox.draggyBits("minimize"); 1744 - DOM.$filebox.draggyBits("minimize"); 1745 - DOM.$whatbox.draggyBits("minimize"); 1746 - 1747 2037 // only show the following in draggy divs if local storage exists 1748 2038 if (!canStorage()) { 1749 - $("." + classes.local).addClass(classes.hidden); 2039 + document.querySelectorAll("." + classes.local).forEach(function (el) { 2040 + el.classList.add(classes.hidden); 2041 + }); 1750 2042 } else { 1751 2043 if ( 1752 2044 localStorage.make8bitartSavedCanvasArray && ··· 1757 2049 renderLocalGallery(); 1758 2050 1759 2051 // open local storage gallery 1760 - DOM.$buttonOpenLocal.trigger("click"); 2052 + if (DOM.$buttonOpenLocal) { 2053 + DOM.$buttonOpenLocal.click(); 2054 + } 1761 2055 } else { 1762 - DOM.$openLocalForm.addClass(classes.hidden); 2056 + if (DOM.$openLocalForm) { 2057 + DOM.$openLocalForm.classList.add(classes.hidden); 2058 + } 1763 2059 } 1764 2060 } 1765 2061 1766 2062 historyPointer = -1; 1767 2063 1768 - DOM.$canvas.mousedown(onMouseDown).mouseup(onMouseUp); 1769 - DOM.$overlay.mousedown(onMouseDown).mouseup(onMouseUp); 1770 - DOM.$canvas.on("contextmenu", onRightClick); 1771 - 1772 - //touch 1773 - DOM.$canvas[0].addEventListener("touchstart", onMouseDown, { passive: true }); 1774 - DOM.$canvas[0].addEventListener("touchend", onMouseUp, { passive: true }); 1775 - DOM.$overlay[0].addEventListener("touchstart", onMouseDown, { 1776 - passive: true, 1777 - }); 1778 - DOM.$overlay[0].addEventListener("touchend", onMouseUp, { passive: true }); 1779 - })(window.jQuery, window.key, window, document); 2064 + if (DOM.$canvas) { 2065 + DOM.$canvas.addEventListener("mousedown", onMouseDown); 2066 + DOM.$canvas.addEventListener("mouseup", onMouseUp); 2067 + DOM.$canvas.addEventListener("contextmenu", onRightClick); 2068 + DOM.$canvas.addEventListener("touchstart", onMouseDown, false); 2069 + DOM.$canvas.addEventListener("touchend", onMouseUp, false); 2070 + } 2071 + if (DOM.$overlay) { 2072 + DOM.$overlay.addEventListener("mousedown", onMouseDown); 2073 + DOM.$overlay.addEventListener("mouseup", onMouseUp); 2074 + DOM.$overlay.addEventListener("touchstart", onMouseDown, false); 2075 + DOM.$overlay.addEventListener("touchend", onMouseUp, false); 2076 + } 2077 + })(window.key, window, document);
-180
src/js/libs/draggybits.js
··· 1 - (function($) { 2 - 3 - var pluginName = 'draggyBits'; 4 - var movingClass = 'ui-moving'; 5 - var draggerClass = 'ui-dragger'; 6 - var closerClass = 'ui-closer'; 7 - var minimizeClass = 'ui-hider'; 8 - var hiddenClass = 'ui-hidden'; 9 - 10 - var isMoving = false; 11 - var zIndex = 100; 12 - var pos = { x:0, y:0 }; 13 - var numDraggers = 0; 14 - var tileOffset = { x:20, y:20}; 15 - 16 - var $current; 17 - var $window = $(window); 18 - 19 - var defaults = { 20 - onMinimize : function (e) { return false; }, 21 - onInit : function (e) { return false; }, 22 - onClose : function (e) { return false; }, 23 - onRestore : function (e) { return false; } 24 - }; 25 - 26 - var methods = { 27 - 28 - init : function (opts) { 29 - 30 - return this.each(function() { 31 - 32 - var $this = $(this).addClass(pluginName); 33 - var $dragger = $this.find('.' + draggerClass); 34 - var $closer = $this.find('.' + closerClass).click(onCloseClick); 35 - var $minimizer = $this.find('.' + minimizeClass).click(onMinimizeClick); 36 - 37 - var options = $.extend(defaults, opts); 38 - 39 - var data = { 40 - $this : $this, 41 - $dragger : $dragger, 42 - $closer : $closer, 43 - $minimizer : $minimizer, 44 - onMinimize : options.onMinimize, 45 - onClose : options.onClose, 46 - onInit : options.onInit, 47 - onRestore : options.onRestore 48 - }; 49 - 50 - $this.data(pluginName, data); 51 - 52 - $dragger.attr('aria-grabbed', false); 53 - $dragger.mousedown(onMouseDown); 54 - 55 - numDraggers++; 56 - 57 - var css = { 58 - top : numDraggers * tileOffset.y, 59 - left : 200 + (numDraggers * tileOffset.x), 60 - position : 'absolute' 61 - }; 62 - 63 - $this.css(css); 64 - 65 - options.onInit($this); 66 - }); 67 - }, 68 - 69 - minimize : function () { 70 - var $this = $(this).addClass(hiddenClass); 71 - var data = $this.data(pluginName); 72 - data.onMinimize($this); 73 - }, 74 - 75 - restore : function () { 76 - var $this = $(this).removeClass(hiddenClass).css("z-index", zIndex++).focus(); 77 - var data = $this.data(pluginName); 78 - data.onRestore($this); 79 - }, 80 - 81 - close : function () { 82 - var $this = $(this); 83 - var data = $this.data(pluginName); 84 - data.onClose($this); 85 - $this.remove(); 86 - } 87 - 88 - }; 89 - 90 - 91 - 92 - 93 - /*** MODULE DEFINITION ***/ 94 - 95 - $.fn[pluginName] = function (method) { 96 - if ( methods[method] ) { 97 - return methods[method].apply(this, Array.prototype.slice.call(arguments, 1)); 98 - } else if (typeof method === 'object' || !method) { 99 - return methods.init.apply(this,arguments); 100 - } else { 101 - $.error('Method ' + method + ' does not exist'); 102 - } 103 - }; 104 - 105 - 106 - 107 - 108 - /*** EVENTS HANDLERS ***/ 109 - 110 - var onMove = function (e) { 111 - e.preventDefault(); 112 - var curr = { x: e.pageX, y: e.pageY }; 113 - 114 - var dx = curr.x - pos.x; 115 - var dy = curr.y - pos.y; 116 - 117 - $current.css({top:"+="+dy, left:"+="+dx}); 118 - 119 - pos = curr; 120 - }; 121 - 122 - var onMouseUp = function (e) { 123 - var $this = $(e.target); 124 - 125 - if (!isMoving) { 126 - return; 127 - } 128 - 129 - $this.attr('aria-grabbed', false); 130 - $('.' + movingClass).removeClass(movingClass) 131 - 132 - $window.off('mousemove'); 133 - isMoving = false; 134 - 135 - // touch 136 - window.removeEventListener('touchmove', onMove, {passive:true}); 137 - }; 138 - 139 - var onMouseDown = function (e) { 140 - var $target = $(e.target); 141 - var $this = ( $target.is('button') ) ? $target : $target.parent('button'); 142 - var isDragger = $this.hasClass(draggerClass); 143 - $this.parents('.'+ pluginName).css("z-index", zIndex++); 144 - 145 - if (!isDragger) { 146 - return; 147 - } 148 - 149 - e.preventDefault() 150 - pos = { x: e.pageX, y: e.pageY }; 151 - 152 - $this.attr('aria-grabbed', true); 153 - $current = $this.parents('.'+ pluginName).addClass(movingClass); 154 - $window.on('mousemove', onMove); 155 - 156 - isMoving = true; 157 - 158 - // touch 159 - window.addEventListener('touchmove', onMove, {passive:true}); 160 - }; 161 - 162 - var onCloseClick = function (e) { 163 - var $this = $(this); 164 - var $par = $this.parents('.'+ pluginName); 165 - $par[pluginName]('close'); 166 - }; 167 - 168 - var onMinimizeClick = function (e) { 169 - var $this = $(this); 170 - var $par = $this.parents('.'+ pluginName); 171 - $par[pluginName]('minimize'); 172 - }; 173 - 174 - /*** GLOBAL EVENTS ***/ 175 - $(window).mouseup(onMouseUp); 176 - 177 - // touch 178 - window.addEventListener('touchend', onMouseUp, {passive:true}); 179 - 180 - })( jQuery );
+145
src/js/libs/draggydivs.js
··· 1 + (function () { 2 + const draggydivs = document.getElementsByClassName("draggydiv"); 3 + const minimizedList = document.getElementById("draggydivs-minimized"); 4 + let buttonsDrag = []; 5 + let buttonsMinimize = []; 6 + let zIndex = 1000; 7 + let pos = { x: 0, y: 0 }; 8 + let currentDraggy; 9 + 10 + // event helpers 11 + const minimizeDraggydiv = (draggydiv, inURL) => { 12 + if (!minimizedList) { 13 + minimizedList = document.createElement("ul"); 14 + minimizedList.className = "draggydivs-minimized"; 15 + document.body.appendChild(minimizedList); 16 + } 17 + 18 + const minimizedItem = document.createElement("li"); 19 + const minimizedItemTitle = draggydiv.getAttribute("title"); 20 + minimizedItem.innerHTML = `<a class="draggydiv-title" href=#>${minimizedItemTitle}</a>`; 21 + minimizedList.appendChild(minimizedItem); 22 + 23 + minimizedItem.addEventListener("click", onMinimizedItemClick); 24 + 25 + draggydiv.style.display = "none"; 26 + }; 27 + 28 + const expandDraggydiv = (draggydiv, inURL) => { 29 + zIndex++; 30 + draggydiv.style.zIndex = zIndex; 31 + draggydiv.style.display = "block"; 32 + 33 + const menuItems = document.querySelectorAll(".draggydiv-title"); 34 + [].forEach.call(menuItems, function (item) { 35 + if (item.innerHTML == draggydiv.title) { 36 + item.closest("li").remove(); 37 + } 38 + }); 39 + 40 + const { top } = draggydiv.getBoundingClientRect(); 41 + window.scrollTo(0, top); 42 + }; 43 + 44 + // event callbacks 45 + const onDragClick = (e) => { 46 + pos = { x: e.pageX, y: e.pageY }; 47 + currentDraggy = e.target.closest(".draggydiv"); 48 + 49 + document.addEventListener("mousemove", onMove); 50 + document.addEventListener("touchmove", onMove); 51 + document.addEventListener("mouseup", onMouseUp); 52 + document.addEventListener("touchend", onMouseUp); 53 + 54 + zIndex++; 55 + currentDraggy.style.zIndex = zIndex; 56 + }; 57 + 58 + const onMinimizeClick = (e) => { 59 + minimizeDraggydiv(e.target.closest(".draggydiv")); 60 + }; 61 + 62 + const onMinimizedItemClick = (e) => { 63 + e.preventDefault(); 64 + const thisMinimizedItem = e.target; 65 + const thisMinimizedItemTitle = thisMinimizedItem.innerHTML; 66 + 67 + const draggyToExpand = document.querySelector( 68 + `[title="${thisMinimizedItemTitle}"]` 69 + ); 70 + expandDraggydiv(draggyToExpand); 71 + }; 72 + 73 + const onMove = (e) => { 74 + const curr = { x: e.pageX, y: e.pageY }; 75 + const dx = curr.x - pos.x; 76 + const dy = curr.y - pos.y; 77 + 78 + const currentDraggyStyle = getComputedStyle(currentDraggy); 79 + 80 + currentDraggy.style.setProperty( 81 + "left", 82 + parseInt(currentDraggyStyle.left) + dx + "px", 83 + "important" 84 + ); 85 + currentDraggy.style.setProperty( 86 + "top", 87 + parseInt(currentDraggyStyle.top) + dy + "px", 88 + "important" 89 + ); 90 + 91 + pos = curr; 92 + }; 93 + 94 + const onMouseUp = (e) => { 95 + document.removeEventListener("mousemove", onMove); 96 + document.removeEventListener("touchmove", onMove); 97 + document.removeEventListener("mouseup", onMouseUp); 98 + document.removeEventListener("touchend", onMouseUp); 99 + }; 100 + 101 + // init draggydiv styling and button events 102 + const draggyPromises = []; 103 + for (let i = 0; i < draggydivs.length; i++) { 104 + const thisDraggyPromise = new Promise((resolve, reject) => { 105 + draggydivs[i].style.top = parseInt(draggydivs[i].offsetTop) + "px"; 106 + draggydivs[i].style.left = parseInt(draggydivs[i].offsetLeft) + "px"; 107 + draggydivs[i].style.width = parseInt(draggydivs[i].offsetWidth) + "px"; 108 + draggydivs[i].style.zIndex = zIndex; 109 + resolve(draggydivs[i]); 110 + }); 111 + draggyPromises.push(thisDraggyPromise); 112 + 113 + zIndex++; 114 + 115 + buttonsDrag = buttonsDrag.concat( 116 + Array.prototype.slice.call( 117 + draggydivs[i].getElementsByClassName("draggydivs-drag") 118 + ) 119 + ); 120 + buttonsMinimize = buttonsMinimize.concat( 121 + Array.prototype.slice.call( 122 + draggydivs[i].getElementsByClassName("draggydivs-minimize") 123 + ) 124 + ); 125 + 126 + for (let j = 0; j < buttonsDrag.length; j++) { 127 + buttonsDrag[j].addEventListener("mousedown", onDragClick); 128 + buttonsDrag[j].addEventListener("touchstart", onDragClick); 129 + } 130 + 131 + for (let k = 0; k < buttonsMinimize.length; k++) { 132 + buttonsMinimize[k].addEventListener("click", onMinimizeClick); 133 + } 134 + 135 + // if draggydiv initially has "draggydivs-init-closed" class, minimize 136 + if (draggydivs[i].classList.contains("draggydivs-init-closed")) { 137 + minimizeDraggydiv(draggydivs[i], true); 138 + } 139 + } 140 + Promise.all(draggyPromises).then((draggydivVals) => { 141 + draggydivVals.forEach((draggydiv) => { 142 + draggydiv.style.position = "absolute"; 143 + }); 144 + }); 145 + })();
-4
src/js/libs/jquery-3.2.1.min.js
··· 1 - /*! jQuery v3.2.1 | (c) JS Foundation and other contributors | jquery.org/license */ 2 - !function(a,b){"use strict";"object"==typeof module&&"object"==typeof module.exports?module.exports=a.document?b(a,!0):function(a){if(!a.document)throw new Error("jQuery requires a window with a document");return b(a)}:b(a)}("undefined"!=typeof window?window:this,function(a,b){"use strict";var c=[],d=a.document,e=Object.getPrototypeOf,f=c.slice,g=c.concat,h=c.push,i=c.indexOf,j={},k=j.toString,l=j.hasOwnProperty,m=l.toString,n=m.call(Object),o={};function p(a,b){b=b||d;var c=b.createElement("script");c.text=a,b.head.appendChild(c).parentNode.removeChild(c)}var q="3.2.1",r=function(a,b){return new r.fn.init(a,b)},s=/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g,t=/^-ms-/,u=/-([a-z])/g,v=function(a,b){return b.toUpperCase()};r.fn=r.prototype={jquery:q,constructor:r,length:0,toArray:function(){return f.call(this)},get:function(a){return null==a?f.call(this):a<0?this[a+this.length]:this[a]},pushStack:function(a){var b=r.merge(this.constructor(),a);return b.prevObject=this,b},each:function(a){return r.each(this,a)},map:function(a){return this.pushStack(r.map(this,function(b,c){return a.call(b,c,b)}))},slice:function(){return this.pushStack(f.apply(this,arguments))},first:function(){return this.eq(0)},last:function(){return this.eq(-1)},eq:function(a){var b=this.length,c=+a+(a<0?b:0);return this.pushStack(c>=0&&c<b?[this[c]]:[])},end:function(){return this.prevObject||this.constructor()},push:h,sort:c.sort,splice:c.splice},r.extend=r.fn.extend=function(){var a,b,c,d,e,f,g=arguments[0]||{},h=1,i=arguments.length,j=!1;for("boolean"==typeof g&&(j=g,g=arguments[h]||{},h++),"object"==typeof g||r.isFunction(g)||(g={}),h===i&&(g=this,h--);h<i;h++)if(null!=(a=arguments[h]))for(b in a)c=g[b],d=a[b],g!==d&&(j&&d&&(r.isPlainObject(d)||(e=Array.isArray(d)))?(e?(e=!1,f=c&&Array.isArray(c)?c:[]):f=c&&r.isPlainObject(c)?c:{},g[b]=r.extend(j,f,d)):void 0!==d&&(g[b]=d));return g},r.extend({expando:"jQuery"+(q+Math.random()).replace(/\D/g,""),isReady:!0,error:function(a){throw new Error(a)},noop:function(){},isFunction:function(a){return"function"===r.type(a)},isWindow:function(a){return null!=a&&a===a.window},isNumeric:function(a){var b=r.type(a);return("number"===b||"string"===b)&&!isNaN(a-parseFloat(a))},isPlainObject:function(a){var b,c;return!(!a||"[object Object]"!==k.call(a))&&(!(b=e(a))||(c=l.call(b,"constructor")&&b.constructor,"function"==typeof c&&m.call(c)===n))},isEmptyObject:function(a){var b;for(b in a)return!1;return!0},type:function(a){return null==a?a+"":"object"==typeof a||"function"==typeof a?j[k.call(a)]||"object":typeof a},globalEval:function(a){p(a)},camelCase:function(a){return a.replace(t,"ms-").replace(u,v)},each:function(a,b){var c,d=0;if(w(a)){for(c=a.length;d<c;d++)if(b.call(a[d],d,a[d])===!1)break}else for(d in a)if(b.call(a[d],d,a[d])===!1)break;return a},trim:function(a){return null==a?"":(a+"").replace(s,"")},makeArray:function(a,b){var c=b||[];return null!=a&&(w(Object(a))?r.merge(c,"string"==typeof a?[a]:a):h.call(c,a)),c},inArray:function(a,b,c){return null==b?-1:i.call(b,a,c)},merge:function(a,b){for(var c=+b.length,d=0,e=a.length;d<c;d++)a[e++]=b[d];return a.length=e,a},grep:function(a,b,c){for(var d,e=[],f=0,g=a.length,h=!c;f<g;f++)d=!b(a[f],f),d!==h&&e.push(a[f]);return e},map:function(a,b,c){var d,e,f=0,h=[];if(w(a))for(d=a.length;f<d;f++)e=b(a[f],f,c),null!=e&&h.push(e);else for(f in a)e=b(a[f],f,c),null!=e&&h.push(e);return g.apply([],h)},guid:1,proxy:function(a,b){var c,d,e;if("string"==typeof b&&(c=a[b],b=a,a=c),r.isFunction(a))return d=f.call(arguments,2),e=function(){return a.apply(b||this,d.concat(f.call(arguments)))},e.guid=a.guid=a.guid||r.guid++,e},now:Date.now,support:o}),"function"==typeof Symbol&&(r.fn[Symbol.iterator]=c[Symbol.iterator]),r.each("Boolean Number String Function Array Date RegExp Object Error Symbol".split(" "),function(a,b){j["[object "+b+"]"]=b.toLowerCase()});function w(a){var b=!!a&&"length"in a&&a.length,c=r.type(a);return"function"!==c&&!r.isWindow(a)&&("array"===c||0===b||"number"==typeof b&&b>0&&b-1 in a)}var x=function(a){var b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u="sizzle"+1*new Date,v=a.document,w=0,x=0,y=ha(),z=ha(),A=ha(),B=function(a,b){return a===b&&(l=!0),0},C={}.hasOwnProperty,D=[],E=D.pop,F=D.push,G=D.push,H=D.slice,I=function(a,b){for(var c=0,d=a.length;c<d;c++)if(a[c]===b)return c;return-1},J="checked|selected|async|autofocus|autoplay|controls|defer|disabled|hidden|ismap|loop|multiple|open|readonly|required|scoped",K="[\\x20\\t\\r\\n\\f]",L="(?:\\\\.|[\\w-]|[^\0-\\xa0])+",M="\\["+K+"*("+L+")(?:"+K+"*([*^$|!~]?=)"+K+"*(?:'((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\"|("+L+"))|)"+K+"*\\]",N=":("+L+")(?:\\((('((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\")|((?:\\\\.|[^\\\\()[\\]]|"+M+")*)|.*)\\)|)",O=new RegExp(K+"+","g"),P=new RegExp("^"+K+"+|((?:^|[^\\\\])(?:\\\\.)*)"+K+"+$","g"),Q=new RegExp("^"+K+"*,"+K+"*"),R=new RegExp("^"+K+"*([>+~]|"+K+")"+K+"*"),S=new RegExp("="+K+"*([^\\]'\"]*?)"+K+"*\\]","g"),T=new RegExp(N),U=new RegExp("^"+L+"$"),V={ID:new RegExp("^#("+L+")"),CLASS:new RegExp("^\\.("+L+")"),TAG:new RegExp("^("+L+"|[*])"),ATTR:new RegExp("^"+M),PSEUDO:new RegExp("^"+N),CHILD:new RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+K+"*(even|odd|(([+-]|)(\\d*)n|)"+K+"*(?:([+-]|)"+K+"*(\\d+)|))"+K+"*\\)|)","i"),bool:new RegExp("^(?:"+J+")$","i"),needsContext:new RegExp("^"+K+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+K+"*((?:-\\d)?\\d*)"+K+"*\\)|)(?=[^-]|$)","i")},W=/^(?:input|select|textarea|button)$/i,X=/^h\d$/i,Y=/^[^{]+\{\s*\[native \w/,Z=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,$=/[+~]/,_=new RegExp("\\\\([\\da-f]{1,6}"+K+"?|("+K+")|.)","ig"),aa=function(a,b,c){var d="0x"+b-65536;return d!==d||c?b:d<0?String.fromCharCode(d+65536):String.fromCharCode(d>>10|55296,1023&d|56320)},ba=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\0-\x1f\x7f-\uFFFF\w-]/g,ca=function(a,b){return b?"\0"===a?"\ufffd":a.slice(0,-1)+"\\"+a.charCodeAt(a.length-1).toString(16)+" ":"\\"+a},da=function(){m()},ea=ta(function(a){return a.disabled===!0&&("form"in a||"label"in a)},{dir:"parentNode",next:"legend"});try{G.apply(D=H.call(v.childNodes),v.childNodes),D[v.childNodes.length].nodeType}catch(fa){G={apply:D.length?function(a,b){F.apply(a,H.call(b))}:function(a,b){var c=a.length,d=0;while(a[c++]=b[d++]);a.length=c-1}}}function ga(a,b,d,e){var f,h,j,k,l,o,r,s=b&&b.ownerDocument,w=b?b.nodeType:9;if(d=d||[],"string"!=typeof a||!a||1!==w&&9!==w&&11!==w)return d;if(!e&&((b?b.ownerDocument||b:v)!==n&&m(b),b=b||n,p)){if(11!==w&&(l=Z.exec(a)))if(f=l[1]){if(9===w){if(!(j=b.getElementById(f)))return d;if(j.id===f)return d.push(j),d}else if(s&&(j=s.getElementById(f))&&t(b,j)&&j.id===f)return d.push(j),d}else{if(l[2])return G.apply(d,b.getElementsByTagName(a)),d;if((f=l[3])&&c.getElementsByClassName&&b.getElementsByClassName)return G.apply(d,b.getElementsByClassName(f)),d}if(c.qsa&&!A[a+" "]&&(!q||!q.test(a))){if(1!==w)s=b,r=a;else if("object"!==b.nodeName.toLowerCase()){(k=b.getAttribute("id"))?k=k.replace(ba,ca):b.setAttribute("id",k=u),o=g(a),h=o.length;while(h--)o[h]="#"+k+" "+sa(o[h]);r=o.join(","),s=$.test(a)&&qa(b.parentNode)||b}if(r)try{return G.apply(d,s.querySelectorAll(r)),d}catch(x){}finally{k===u&&b.removeAttribute("id")}}}return i(a.replace(P,"$1"),b,d,e)}function ha(){var a=[];function b(c,e){return a.push(c+" ")>d.cacheLength&&delete b[a.shift()],b[c+" "]=e}return b}function ia(a){return a[u]=!0,a}function ja(a){var b=n.createElement("fieldset");try{return!!a(b)}catch(c){return!1}finally{b.parentNode&&b.parentNode.removeChild(b),b=null}}function ka(a,b){var c=a.split("|"),e=c.length;while(e--)d.attrHandle[c[e]]=b}function la(a,b){var c=b&&a,d=c&&1===a.nodeType&&1===b.nodeType&&a.sourceIndex-b.sourceIndex;if(d)return d;if(c)while(c=c.nextSibling)if(c===b)return-1;return a?1:-1}function ma(a){return function(b){var c=b.nodeName.toLowerCase();return"input"===c&&b.type===a}}function na(a){return function(b){var c=b.nodeName.toLowerCase();return("input"===c||"button"===c)&&b.type===a}}function oa(a){return function(b){return"form"in b?b.parentNode&&b.disabled===!1?"label"in b?"label"in b.parentNode?b.parentNode.disabled===a:b.disabled===a:b.isDisabled===a||b.isDisabled!==!a&&ea(b)===a:b.disabled===a:"label"in b&&b.disabled===a}}function pa(a){return ia(function(b){return b=+b,ia(function(c,d){var e,f=a([],c.length,b),g=f.length;while(g--)c[e=f[g]]&&(c[e]=!(d[e]=c[e]))})})}function qa(a){return a&&"undefined"!=typeof a.getElementsByTagName&&a}c=ga.support={},f=ga.isXML=function(a){var b=a&&(a.ownerDocument||a).documentElement;return!!b&&"HTML"!==b.nodeName},m=ga.setDocument=function(a){var b,e,g=a?a.ownerDocument||a:v;return g!==n&&9===g.nodeType&&g.documentElement?(n=g,o=n.documentElement,p=!f(n),v!==n&&(e=n.defaultView)&&e.top!==e&&(e.addEventListener?e.addEventListener("unload",da,!1):e.attachEvent&&e.attachEvent("onunload",da)),c.attributes=ja(function(a){return a.className="i",!a.getAttribute("className")}),c.getElementsByTagName=ja(function(a){return a.appendChild(n.createComment("")),!a.getElementsByTagName("*").length}),c.getElementsByClassName=Y.test(n.getElementsByClassName),c.getById=ja(function(a){return o.appendChild(a).id=u,!n.getElementsByName||!n.getElementsByName(u).length}),c.getById?(d.filter.ID=function(a){var b=a.replace(_,aa);return function(a){return a.getAttribute("id")===b}},d.find.ID=function(a,b){if("undefined"!=typeof b.getElementById&&p){var c=b.getElementById(a);return c?[c]:[]}}):(d.filter.ID=function(a){var b=a.replace(_,aa);return function(a){var c="undefined"!=typeof a.getAttributeNode&&a.getAttributeNode("id");return c&&c.value===b}},d.find.ID=function(a,b){if("undefined"!=typeof b.getElementById&&p){var c,d,e,f=b.getElementById(a);if(f){if(c=f.getAttributeNode("id"),c&&c.value===a)return[f];e=b.getElementsByName(a),d=0;while(f=e[d++])if(c=f.getAttributeNode("id"),c&&c.value===a)return[f]}return[]}}),d.find.TAG=c.getElementsByTagName?function(a,b){return"undefined"!=typeof b.getElementsByTagName?b.getElementsByTagName(a):c.qsa?b.querySelectorAll(a):void 0}:function(a,b){var c,d=[],e=0,f=b.getElementsByTagName(a);if("*"===a){while(c=f[e++])1===c.nodeType&&d.push(c);return d}return f},d.find.CLASS=c.getElementsByClassName&&function(a,b){if("undefined"!=typeof b.getElementsByClassName&&p)return b.getElementsByClassName(a)},r=[],q=[],(c.qsa=Y.test(n.querySelectorAll))&&(ja(function(a){o.appendChild(a).innerHTML="<a id='"+u+"'></a><select id='"+u+"-\r\\' msallowcapture=''><option selected=''></option></select>",a.querySelectorAll("[msallowcapture^='']").length&&q.push("[*^$]="+K+"*(?:''|\"\")"),a.querySelectorAll("[selected]").length||q.push("\\["+K+"*(?:value|"+J+")"),a.querySelectorAll("[id~="+u+"-]").length||q.push("~="),a.querySelectorAll(":checked").length||q.push(":checked"),a.querySelectorAll("a#"+u+"+*").length||q.push(".#.+[+~]")}),ja(function(a){a.innerHTML="<a href='' disabled='disabled'></a><select disabled='disabled'><option/></select>";var b=n.createElement("input");b.setAttribute("type","hidden"),a.appendChild(b).setAttribute("name","D"),a.querySelectorAll("[name=d]").length&&q.push("name"+K+"*[*^$|!~]?="),2!==a.querySelectorAll(":enabled").length&&q.push(":enabled",":disabled"),o.appendChild(a).disabled=!0,2!==a.querySelectorAll(":disabled").length&&q.push(":enabled",":disabled"),a.querySelectorAll("*,:x"),q.push(",.*:")})),(c.matchesSelector=Y.test(s=o.matches||o.webkitMatchesSelector||o.mozMatchesSelector||o.oMatchesSelector||o.msMatchesSelector))&&ja(function(a){c.disconnectedMatch=s.call(a,"*"),s.call(a,"[s!='']:x"),r.push("!=",N)}),q=q.length&&new RegExp(q.join("|")),r=r.length&&new RegExp(r.join("|")),b=Y.test(o.compareDocumentPosition),t=b||Y.test(o.contains)?function(a,b){var c=9===a.nodeType?a.documentElement:a,d=b&&b.parentNode;return a===d||!(!d||1!==d.nodeType||!(c.contains?c.contains(d):a.compareDocumentPosition&&16&a.compareDocumentPosition(d)))}:function(a,b){if(b)while(b=b.parentNode)if(b===a)return!0;return!1},B=b?function(a,b){if(a===b)return l=!0,0;var d=!a.compareDocumentPosition-!b.compareDocumentPosition;return d?d:(d=(a.ownerDocument||a)===(b.ownerDocument||b)?a.compareDocumentPosition(b):1,1&d||!c.sortDetached&&b.compareDocumentPosition(a)===d?a===n||a.ownerDocument===v&&t(v,a)?-1:b===n||b.ownerDocument===v&&t(v,b)?1:k?I(k,a)-I(k,b):0:4&d?-1:1)}:function(a,b){if(a===b)return l=!0,0;var c,d=0,e=a.parentNode,f=b.parentNode,g=[a],h=[b];if(!e||!f)return a===n?-1:b===n?1:e?-1:f?1:k?I(k,a)-I(k,b):0;if(e===f)return la(a,b);c=a;while(c=c.parentNode)g.unshift(c);c=b;while(c=c.parentNode)h.unshift(c);while(g[d]===h[d])d++;return d?la(g[d],h[d]):g[d]===v?-1:h[d]===v?1:0},n):n},ga.matches=function(a,b){return ga(a,null,null,b)},ga.matchesSelector=function(a,b){if((a.ownerDocument||a)!==n&&m(a),b=b.replace(S,"='$1']"),c.matchesSelector&&p&&!A[b+" "]&&(!r||!r.test(b))&&(!q||!q.test(b)))try{var d=s.call(a,b);if(d||c.disconnectedMatch||a.document&&11!==a.document.nodeType)return d}catch(e){}return ga(b,n,null,[a]).length>0},ga.contains=function(a,b){return(a.ownerDocument||a)!==n&&m(a),t(a,b)},ga.attr=function(a,b){(a.ownerDocument||a)!==n&&m(a);var e=d.attrHandle[b.toLowerCase()],f=e&&C.call(d.attrHandle,b.toLowerCase())?e(a,b,!p):void 0;return void 0!==f?f:c.attributes||!p?a.getAttribute(b):(f=a.getAttributeNode(b))&&f.specified?f.value:null},ga.escape=function(a){return(a+"").replace(ba,ca)},ga.error=function(a){throw new Error("Syntax error, unrecognized expression: "+a)},ga.uniqueSort=function(a){var b,d=[],e=0,f=0;if(l=!c.detectDuplicates,k=!c.sortStable&&a.slice(0),a.sort(B),l){while(b=a[f++])b===a[f]&&(e=d.push(f));while(e--)a.splice(d[e],1)}return k=null,a},e=ga.getText=function(a){var b,c="",d=0,f=a.nodeType;if(f){if(1===f||9===f||11===f){if("string"==typeof a.textContent)return a.textContent;for(a=a.firstChild;a;a=a.nextSibling)c+=e(a)}else if(3===f||4===f)return a.nodeValue}else while(b=a[d++])c+=e(b);return c},d=ga.selectors={cacheLength:50,createPseudo:ia,match:V,attrHandle:{},find:{},relative:{">":{dir:"parentNode",first:!0}," ":{dir:"parentNode"},"+":{dir:"previousSibling",first:!0},"~":{dir:"previousSibling"}},preFilter:{ATTR:function(a){return a[1]=a[1].replace(_,aa),a[3]=(a[3]||a[4]||a[5]||"").replace(_,aa),"~="===a[2]&&(a[3]=" "+a[3]+" "),a.slice(0,4)},CHILD:function(a){return a[1]=a[1].toLowerCase(),"nth"===a[1].slice(0,3)?(a[3]||ga.error(a[0]),a[4]=+(a[4]?a[5]+(a[6]||1):2*("even"===a[3]||"odd"===a[3])),a[5]=+(a[7]+a[8]||"odd"===a[3])):a[3]&&ga.error(a[0]),a},PSEUDO:function(a){var b,c=!a[6]&&a[2];return V.CHILD.test(a[0])?null:(a[3]?a[2]=a[4]||a[5]||"":c&&T.test(c)&&(b=g(c,!0))&&(b=c.indexOf(")",c.length-b)-c.length)&&(a[0]=a[0].slice(0,b),a[2]=c.slice(0,b)),a.slice(0,3))}},filter:{TAG:function(a){var b=a.replace(_,aa).toLowerCase();return"*"===a?function(){return!0}:function(a){return a.nodeName&&a.nodeName.toLowerCase()===b}},CLASS:function(a){var b=y[a+" "];return b||(b=new RegExp("(^|"+K+")"+a+"("+K+"|$)"))&&y(a,function(a){return b.test("string"==typeof a.className&&a.className||"undefined"!=typeof a.getAttribute&&a.getAttribute("class")||"")})},ATTR:function(a,b,c){return function(d){var e=ga.attr(d,a);return null==e?"!="===b:!b||(e+="","="===b?e===c:"!="===b?e!==c:"^="===b?c&&0===e.indexOf(c):"*="===b?c&&e.indexOf(c)>-1:"$="===b?c&&e.slice(-c.length)===c:"~="===b?(" "+e.replace(O," ")+" ").indexOf(c)>-1:"|="===b&&(e===c||e.slice(0,c.length+1)===c+"-"))}},CHILD:function(a,b,c,d,e){var f="nth"!==a.slice(0,3),g="last"!==a.slice(-4),h="of-type"===b;return 1===d&&0===e?function(a){return!!a.parentNode}:function(b,c,i){var j,k,l,m,n,o,p=f!==g?"nextSibling":"previousSibling",q=b.parentNode,r=h&&b.nodeName.toLowerCase(),s=!i&&!h,t=!1;if(q){if(f){while(p){m=b;while(m=m[p])if(h?m.nodeName.toLowerCase()===r:1===m.nodeType)return!1;o=p="only"===a&&!o&&"nextSibling"}return!0}if(o=[g?q.firstChild:q.lastChild],g&&s){m=q,l=m[u]||(m[u]={}),k=l[m.uniqueID]||(l[m.uniqueID]={}),j=k[a]||[],n=j[0]===w&&j[1],t=n&&j[2],m=n&&q.childNodes[n];while(m=++n&&m&&m[p]||(t=n=0)||o.pop())if(1===m.nodeType&&++t&&m===b){k[a]=[w,n,t];break}}else if(s&&(m=b,l=m[u]||(m[u]={}),k=l[m.uniqueID]||(l[m.uniqueID]={}),j=k[a]||[],n=j[0]===w&&j[1],t=n),t===!1)while(m=++n&&m&&m[p]||(t=n=0)||o.pop())if((h?m.nodeName.toLowerCase()===r:1===m.nodeType)&&++t&&(s&&(l=m[u]||(m[u]={}),k=l[m.uniqueID]||(l[m.uniqueID]={}),k[a]=[w,t]),m===b))break;return t-=e,t===d||t%d===0&&t/d>=0}}},PSEUDO:function(a,b){var c,e=d.pseudos[a]||d.setFilters[a.toLowerCase()]||ga.error("unsupported pseudo: "+a);return e[u]?e(b):e.length>1?(c=[a,a,"",b],d.setFilters.hasOwnProperty(a.toLowerCase())?ia(function(a,c){var d,f=e(a,b),g=f.length;while(g--)d=I(a,f[g]),a[d]=!(c[d]=f[g])}):function(a){return e(a,0,c)}):e}},pseudos:{not:ia(function(a){var b=[],c=[],d=h(a.replace(P,"$1"));return d[u]?ia(function(a,b,c,e){var f,g=d(a,null,e,[]),h=a.length;while(h--)(f=g[h])&&(a[h]=!(b[h]=f))}):function(a,e,f){return b[0]=a,d(b,null,f,c),b[0]=null,!c.pop()}}),has:ia(function(a){return function(b){return ga(a,b).length>0}}),contains:ia(function(a){return a=a.replace(_,aa),function(b){return(b.textContent||b.innerText||e(b)).indexOf(a)>-1}}),lang:ia(function(a){return U.test(a||"")||ga.error("unsupported lang: "+a),a=a.replace(_,aa).toLowerCase(),function(b){var c;do if(c=p?b.lang:b.getAttribute("xml:lang")||b.getAttribute("lang"))return c=c.toLowerCase(),c===a||0===c.indexOf(a+"-");while((b=b.parentNode)&&1===b.nodeType);return!1}}),target:function(b){var c=a.location&&a.location.hash;return c&&c.slice(1)===b.id},root:function(a){return a===o},focus:function(a){return a===n.activeElement&&(!n.hasFocus||n.hasFocus())&&!!(a.type||a.href||~a.tabIndex)},enabled:oa(!1),disabled:oa(!0),checked:function(a){var b=a.nodeName.toLowerCase();return"input"===b&&!!a.checked||"option"===b&&!!a.selected},selected:function(a){return a.parentNode&&a.parentNode.selectedIndex,a.selected===!0},empty:function(a){for(a=a.firstChild;a;a=a.nextSibling)if(a.nodeType<6)return!1;return!0},parent:function(a){return!d.pseudos.empty(a)},header:function(a){return X.test(a.nodeName)},input:function(a){return W.test(a.nodeName)},button:function(a){var b=a.nodeName.toLowerCase();return"input"===b&&"button"===a.type||"button"===b},text:function(a){var b;return"input"===a.nodeName.toLowerCase()&&"text"===a.type&&(null==(b=a.getAttribute("type"))||"text"===b.toLowerCase())},first:pa(function(){return[0]}),last:pa(function(a,b){return[b-1]}),eq:pa(function(a,b,c){return[c<0?c+b:c]}),even:pa(function(a,b){for(var c=0;c<b;c+=2)a.push(c);return a}),odd:pa(function(a,b){for(var c=1;c<b;c+=2)a.push(c);return a}),lt:pa(function(a,b,c){for(var d=c<0?c+b:c;--d>=0;)a.push(d);return a}),gt:pa(function(a,b,c){for(var d=c<0?c+b:c;++d<b;)a.push(d);return a})}},d.pseudos.nth=d.pseudos.eq;for(b in{radio:!0,checkbox:!0,file:!0,password:!0,image:!0})d.pseudos[b]=ma(b);for(b in{submit:!0,reset:!0})d.pseudos[b]=na(b);function ra(){}ra.prototype=d.filters=d.pseudos,d.setFilters=new ra,g=ga.tokenize=function(a,b){var c,e,f,g,h,i,j,k=z[a+" "];if(k)return b?0:k.slice(0);h=a,i=[],j=d.preFilter;while(h){c&&!(e=Q.exec(h))||(e&&(h=h.slice(e[0].length)||h),i.push(f=[])),c=!1,(e=R.exec(h))&&(c=e.shift(),f.push({value:c,type:e[0].replace(P," ")}),h=h.slice(c.length));for(g in d.filter)!(e=V[g].exec(h))||j[g]&&!(e=j[g](e))||(c=e.shift(),f.push({value:c,type:g,matches:e}),h=h.slice(c.length));if(!c)break}return b?h.length:h?ga.error(a):z(a,i).slice(0)};function sa(a){for(var b=0,c=a.length,d="";b<c;b++)d+=a[b].value;return d}function ta(a,b,c){var d=b.dir,e=b.next,f=e||d,g=c&&"parentNode"===f,h=x++;return b.first?function(b,c,e){while(b=b[d])if(1===b.nodeType||g)return a(b,c,e);return!1}:function(b,c,i){var j,k,l,m=[w,h];if(i){while(b=b[d])if((1===b.nodeType||g)&&a(b,c,i))return!0}else while(b=b[d])if(1===b.nodeType||g)if(l=b[u]||(b[u]={}),k=l[b.uniqueID]||(l[b.uniqueID]={}),e&&e===b.nodeName.toLowerCase())b=b[d]||b;else{if((j=k[f])&&j[0]===w&&j[1]===h)return m[2]=j[2];if(k[f]=m,m[2]=a(b,c,i))return!0}return!1}}function ua(a){return a.length>1?function(b,c,d){var e=a.length;while(e--)if(!a[e](b,c,d))return!1;return!0}:a[0]}function va(a,b,c){for(var d=0,e=b.length;d<e;d++)ga(a,b[d],c);return c}function wa(a,b,c,d,e){for(var f,g=[],h=0,i=a.length,j=null!=b;h<i;h++)(f=a[h])&&(c&&!c(f,d,e)||(g.push(f),j&&b.push(h)));return g}function xa(a,b,c,d,e,f){return d&&!d[u]&&(d=xa(d)),e&&!e[u]&&(e=xa(e,f)),ia(function(f,g,h,i){var j,k,l,m=[],n=[],o=g.length,p=f||va(b||"*",h.nodeType?[h]:h,[]),q=!a||!f&&b?p:wa(p,m,a,h,i),r=c?e||(f?a:o||d)?[]:g:q;if(c&&c(q,r,h,i),d){j=wa(r,n),d(j,[],h,i),k=j.length;while(k--)(l=j[k])&&(r[n[k]]=!(q[n[k]]=l))}if(f){if(e||a){if(e){j=[],k=r.length;while(k--)(l=r[k])&&j.push(q[k]=l);e(null,r=[],j,i)}k=r.length;while(k--)(l=r[k])&&(j=e?I(f,l):m[k])>-1&&(f[j]=!(g[j]=l))}}else r=wa(r===g?r.splice(o,r.length):r),e?e(null,g,r,i):G.apply(g,r)})}function ya(a){for(var b,c,e,f=a.length,g=d.relative[a[0].type],h=g||d.relative[" "],i=g?1:0,k=ta(function(a){return a===b},h,!0),l=ta(function(a){return I(b,a)>-1},h,!0),m=[function(a,c,d){var e=!g&&(d||c!==j)||((b=c).nodeType?k(a,c,d):l(a,c,d));return b=null,e}];i<f;i++)if(c=d.relative[a[i].type])m=[ta(ua(m),c)];else{if(c=d.filter[a[i].type].apply(null,a[i].matches),c[u]){for(e=++i;e<f;e++)if(d.relative[a[e].type])break;return xa(i>1&&ua(m),i>1&&sa(a.slice(0,i-1).concat({value:" "===a[i-2].type?"*":""})).replace(P,"$1"),c,i<e&&ya(a.slice(i,e)),e<f&&ya(a=a.slice(e)),e<f&&sa(a))}m.push(c)}return ua(m)}function za(a,b){var c=b.length>0,e=a.length>0,f=function(f,g,h,i,k){var l,o,q,r=0,s="0",t=f&&[],u=[],v=j,x=f||e&&d.find.TAG("*",k),y=w+=null==v?1:Math.random()||.1,z=x.length;for(k&&(j=g===n||g||k);s!==z&&null!=(l=x[s]);s++){if(e&&l){o=0,g||l.ownerDocument===n||(m(l),h=!p);while(q=a[o++])if(q(l,g||n,h)){i.push(l);break}k&&(w=y)}c&&((l=!q&&l)&&r--,f&&t.push(l))}if(r+=s,c&&s!==r){o=0;while(q=b[o++])q(t,u,g,h);if(f){if(r>0)while(s--)t[s]||u[s]||(u[s]=E.call(i));u=wa(u)}G.apply(i,u),k&&!f&&u.length>0&&r+b.length>1&&ga.uniqueSort(i)}return k&&(w=y,j=v),t};return c?ia(f):f}return h=ga.compile=function(a,b){var c,d=[],e=[],f=A[a+" "];if(!f){b||(b=g(a)),c=b.length;while(c--)f=ya(b[c]),f[u]?d.push(f):e.push(f);f=A(a,za(e,d)),f.selector=a}return f},i=ga.select=function(a,b,c,e){var f,i,j,k,l,m="function"==typeof a&&a,n=!e&&g(a=m.selector||a);if(c=c||[],1===n.length){if(i=n[0]=n[0].slice(0),i.length>2&&"ID"===(j=i[0]).type&&9===b.nodeType&&p&&d.relative[i[1].type]){if(b=(d.find.ID(j.matches[0].replace(_,aa),b)||[])[0],!b)return c;m&&(b=b.parentNode),a=a.slice(i.shift().value.length)}f=V.needsContext.test(a)?0:i.length;while(f--){if(j=i[f],d.relative[k=j.type])break;if((l=d.find[k])&&(e=l(j.matches[0].replace(_,aa),$.test(i[0].type)&&qa(b.parentNode)||b))){if(i.splice(f,1),a=e.length&&sa(i),!a)return G.apply(c,e),c;break}}}return(m||h(a,n))(e,b,!p,c,!b||$.test(a)&&qa(b.parentNode)||b),c},c.sortStable=u.split("").sort(B).join("")===u,c.detectDuplicates=!!l,m(),c.sortDetached=ja(function(a){return 1&a.compareDocumentPosition(n.createElement("fieldset"))}),ja(function(a){return a.innerHTML="<a href='#'></a>","#"===a.firstChild.getAttribute("href")})||ka("type|href|height|width",function(a,b,c){if(!c)return a.getAttribute(b,"type"===b.toLowerCase()?1:2)}),c.attributes&&ja(function(a){return a.innerHTML="<input/>",a.firstChild.setAttribute("value",""),""===a.firstChild.getAttribute("value")})||ka("value",function(a,b,c){if(!c&&"input"===a.nodeName.toLowerCase())return a.defaultValue}),ja(function(a){return null==a.getAttribute("disabled")})||ka(J,function(a,b,c){var d;if(!c)return a[b]===!0?b.toLowerCase():(d=a.getAttributeNode(b))&&d.specified?d.value:null}),ga}(a);r.find=x,r.expr=x.selectors,r.expr[":"]=r.expr.pseudos,r.uniqueSort=r.unique=x.uniqueSort,r.text=x.getText,r.isXMLDoc=x.isXML,r.contains=x.contains,r.escapeSelector=x.escape;var y=function(a,b,c){var d=[],e=void 0!==c;while((a=a[b])&&9!==a.nodeType)if(1===a.nodeType){if(e&&r(a).is(c))break;d.push(a)}return d},z=function(a,b){for(var c=[];a;a=a.nextSibling)1===a.nodeType&&a!==b&&c.push(a);return c},A=r.expr.match.needsContext;function B(a,b){return a.nodeName&&a.nodeName.toLowerCase()===b.toLowerCase()}var C=/^<([a-z][^\/\0>:\x20\t\r\n\f]*)[\x20\t\r\n\f]*\/?>(?:<\/\1>|)$/i,D=/^.[^:#\[\.,]*$/;function E(a,b,c){return r.isFunction(b)?r.grep(a,function(a,d){return!!b.call(a,d,a)!==c}):b.nodeType?r.grep(a,function(a){return a===b!==c}):"string"!=typeof b?r.grep(a,function(a){return i.call(b,a)>-1!==c}):D.test(b)?r.filter(b,a,c):(b=r.filter(b,a),r.grep(a,function(a){return i.call(b,a)>-1!==c&&1===a.nodeType}))}r.filter=function(a,b,c){var d=b[0];return c&&(a=":not("+a+")"),1===b.length&&1===d.nodeType?r.find.matchesSelector(d,a)?[d]:[]:r.find.matches(a,r.grep(b,function(a){return 1===a.nodeType}))},r.fn.extend({find:function(a){var b,c,d=this.length,e=this;if("string"!=typeof a)return this.pushStack(r(a).filter(function(){for(b=0;b<d;b++)if(r.contains(e[b],this))return!0}));for(c=this.pushStack([]),b=0;b<d;b++)r.find(a,e[b],c);return d>1?r.uniqueSort(c):c},filter:function(a){return this.pushStack(E(this,a||[],!1))},not:function(a){return this.pushStack(E(this,a||[],!0))},is:function(a){return!!E(this,"string"==typeof a&&A.test(a)?r(a):a||[],!1).length}});var F,G=/^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]+))$/,H=r.fn.init=function(a,b,c){var e,f;if(!a)return this;if(c=c||F,"string"==typeof a){if(e="<"===a[0]&&">"===a[a.length-1]&&a.length>=3?[null,a,null]:G.exec(a),!e||!e[1]&&b)return!b||b.jquery?(b||c).find(a):this.constructor(b).find(a);if(e[1]){if(b=b instanceof r?b[0]:b,r.merge(this,r.parseHTML(e[1],b&&b.nodeType?b.ownerDocument||b:d,!0)),C.test(e[1])&&r.isPlainObject(b))for(e in b)r.isFunction(this[e])?this[e](b[e]):this.attr(e,b[e]);return this}return f=d.getElementById(e[2]),f&&(this[0]=f,this.length=1),this}return a.nodeType?(this[0]=a,this.length=1,this):r.isFunction(a)?void 0!==c.ready?c.ready(a):a(r):r.makeArray(a,this)};H.prototype=r.fn,F=r(d);var I=/^(?:parents|prev(?:Until|All))/,J={children:!0,contents:!0,next:!0,prev:!0};r.fn.extend({has:function(a){var b=r(a,this),c=b.length;return this.filter(function(){for(var a=0;a<c;a++)if(r.contains(this,b[a]))return!0})},closest:function(a,b){var c,d=0,e=this.length,f=[],g="string"!=typeof a&&r(a);if(!A.test(a))for(;d<e;d++)for(c=this[d];c&&c!==b;c=c.parentNode)if(c.nodeType<11&&(g?g.index(c)>-1:1===c.nodeType&&r.find.matchesSelector(c,a))){f.push(c);break}return this.pushStack(f.length>1?r.uniqueSort(f):f)},index:function(a){return a?"string"==typeof a?i.call(r(a),this[0]):i.call(this,a.jquery?a[0]:a):this[0]&&this[0].parentNode?this.first().prevAll().length:-1},add:function(a,b){return this.pushStack(r.uniqueSort(r.merge(this.get(),r(a,b))))},addBack:function(a){return this.add(null==a?this.prevObject:this.prevObject.filter(a))}});function K(a,b){while((a=a[b])&&1!==a.nodeType);return a}r.each({parent:function(a){var b=a.parentNode;return b&&11!==b.nodeType?b:null},parents:function(a){return y(a,"parentNode")},parentsUntil:function(a,b,c){return y(a,"parentNode",c)},next:function(a){return K(a,"nextSibling")},prev:function(a){return K(a,"previousSibling")},nextAll:function(a){return y(a,"nextSibling")},prevAll:function(a){return y(a,"previousSibling")},nextUntil:function(a,b,c){return y(a,"nextSibling",c)},prevUntil:function(a,b,c){return y(a,"previousSibling",c)},siblings:function(a){return z((a.parentNode||{}).firstChild,a)},children:function(a){return z(a.firstChild)},contents:function(a){return B(a,"iframe")?a.contentDocument:(B(a,"template")&&(a=a.content||a),r.merge([],a.childNodes))}},function(a,b){r.fn[a]=function(c,d){var e=r.map(this,b,c);return"Until"!==a.slice(-5)&&(d=c),d&&"string"==typeof d&&(e=r.filter(d,e)),this.length>1&&(J[a]||r.uniqueSort(e),I.test(a)&&e.reverse()),this.pushStack(e)}});var L=/[^\x20\t\r\n\f]+/g;function M(a){var b={};return r.each(a.match(L)||[],function(a,c){b[c]=!0}),b}r.Callbacks=function(a){a="string"==typeof a?M(a):r.extend({},a);var b,c,d,e,f=[],g=[],h=-1,i=function(){for(e=e||a.once,d=b=!0;g.length;h=-1){c=g.shift();while(++h<f.length)f[h].apply(c[0],c[1])===!1&&a.stopOnFalse&&(h=f.length,c=!1)}a.memory||(c=!1),b=!1,e&&(f=c?[]:"")},j={add:function(){return f&&(c&&!b&&(h=f.length-1,g.push(c)),function d(b){r.each(b,function(b,c){r.isFunction(c)?a.unique&&j.has(c)||f.push(c):c&&c.length&&"string"!==r.type(c)&&d(c)})}(arguments),c&&!b&&i()),this},remove:function(){return r.each(arguments,function(a,b){var c;while((c=r.inArray(b,f,c))>-1)f.splice(c,1),c<=h&&h--}),this},has:function(a){return a?r.inArray(a,f)>-1:f.length>0},empty:function(){return f&&(f=[]),this},disable:function(){return e=g=[],f=c="",this},disabled:function(){return!f},lock:function(){return e=g=[],c||b||(f=c=""),this},locked:function(){return!!e},fireWith:function(a,c){return e||(c=c||[],c=[a,c.slice?c.slice():c],g.push(c),b||i()),this},fire:function(){return j.fireWith(this,arguments),this},fired:function(){return!!d}};return j};function N(a){return a}function O(a){throw a}function P(a,b,c,d){var e;try{a&&r.isFunction(e=a.promise)?e.call(a).done(b).fail(c):a&&r.isFunction(e=a.then)?e.call(a,b,c):b.apply(void 0,[a].slice(d))}catch(a){c.apply(void 0,[a])}}r.extend({Deferred:function(b){var c=[["notify","progress",r.Callbacks("memory"),r.Callbacks("memory"),2],["resolve","done",r.Callbacks("once memory"),r.Callbacks("once memory"),0,"resolved"],["reject","fail",r.Callbacks("once memory"),r.Callbacks("once memory"),1,"rejected"]],d="pending",e={state:function(){return d},always:function(){return f.done(arguments).fail(arguments),this},"catch":function(a){return e.then(null,a)},pipe:function(){var a=arguments;return r.Deferred(function(b){r.each(c,function(c,d){var e=r.isFunction(a[d[4]])&&a[d[4]];f[d[1]](function(){var a=e&&e.apply(this,arguments);a&&r.isFunction(a.promise)?a.promise().progress(b.notify).done(b.resolve).fail(b.reject):b[d[0]+"With"](this,e?[a]:arguments)})}),a=null}).promise()},then:function(b,d,e){var f=0;function g(b,c,d,e){return function(){var h=this,i=arguments,j=function(){var a,j;if(!(b<f)){if(a=d.apply(h,i),a===c.promise())throw new TypeError("Thenable self-resolution");j=a&&("object"==typeof a||"function"==typeof a)&&a.then,r.isFunction(j)?e?j.call(a,g(f,c,N,e),g(f,c,O,e)):(f++,j.call(a,g(f,c,N,e),g(f,c,O,e),g(f,c,N,c.notifyWith))):(d!==N&&(h=void 0,i=[a]),(e||c.resolveWith)(h,i))}},k=e?j:function(){try{j()}catch(a){r.Deferred.exceptionHook&&r.Deferred.exceptionHook(a,k.stackTrace),b+1>=f&&(d!==O&&(h=void 0,i=[a]),c.rejectWith(h,i))}};b?k():(r.Deferred.getStackHook&&(k.stackTrace=r.Deferred.getStackHook()),a.setTimeout(k))}}return r.Deferred(function(a){c[0][3].add(g(0,a,r.isFunction(e)?e:N,a.notifyWith)),c[1][3].add(g(0,a,r.isFunction(b)?b:N)),c[2][3].add(g(0,a,r.isFunction(d)?d:O))}).promise()},promise:function(a){return null!=a?r.extend(a,e):e}},f={};return r.each(c,function(a,b){var g=b[2],h=b[5];e[b[1]]=g.add,h&&g.add(function(){d=h},c[3-a][2].disable,c[0][2].lock),g.add(b[3].fire),f[b[0]]=function(){return f[b[0]+"With"](this===f?void 0:this,arguments),this},f[b[0]+"With"]=g.fireWith}),e.promise(f),b&&b.call(f,f),f},when:function(a){var b=arguments.length,c=b,d=Array(c),e=f.call(arguments),g=r.Deferred(),h=function(a){return function(c){d[a]=this,e[a]=arguments.length>1?f.call(arguments):c,--b||g.resolveWith(d,e)}};if(b<=1&&(P(a,g.done(h(c)).resolve,g.reject,!b),"pending"===g.state()||r.isFunction(e[c]&&e[c].then)))return g.then();while(c--)P(e[c],h(c),g.reject);return g.promise()}});var Q=/^(Eval|Internal|Range|Reference|Syntax|Type|URI)Error$/;r.Deferred.exceptionHook=function(b,c){a.console&&a.console.warn&&b&&Q.test(b.name)&&a.console.warn("jQuery.Deferred exception: "+b.message,b.stack,c)},r.readyException=function(b){a.setTimeout(function(){throw b})};var R=r.Deferred();r.fn.ready=function(a){return R.then(a)["catch"](function(a){r.readyException(a)}),this},r.extend({isReady:!1,readyWait:1,ready:function(a){(a===!0?--r.readyWait:r.isReady)||(r.isReady=!0,a!==!0&&--r.readyWait>0||R.resolveWith(d,[r]))}}),r.ready.then=R.then;function S(){d.removeEventListener("DOMContentLoaded",S), 3 - a.removeEventListener("load",S),r.ready()}"complete"===d.readyState||"loading"!==d.readyState&&!d.documentElement.doScroll?a.setTimeout(r.ready):(d.addEventListener("DOMContentLoaded",S),a.addEventListener("load",S));var T=function(a,b,c,d,e,f,g){var h=0,i=a.length,j=null==c;if("object"===r.type(c)){e=!0;for(h in c)T(a,b,h,c[h],!0,f,g)}else if(void 0!==d&&(e=!0,r.isFunction(d)||(g=!0),j&&(g?(b.call(a,d),b=null):(j=b,b=function(a,b,c){return j.call(r(a),c)})),b))for(;h<i;h++)b(a[h],c,g?d:d.call(a[h],h,b(a[h],c)));return e?a:j?b.call(a):i?b(a[0],c):f},U=function(a){return 1===a.nodeType||9===a.nodeType||!+a.nodeType};function V(){this.expando=r.expando+V.uid++}V.uid=1,V.prototype={cache:function(a){var b=a[this.expando];return b||(b={},U(a)&&(a.nodeType?a[this.expando]=b:Object.defineProperty(a,this.expando,{value:b,configurable:!0}))),b},set:function(a,b,c){var d,e=this.cache(a);if("string"==typeof b)e[r.camelCase(b)]=c;else for(d in b)e[r.camelCase(d)]=b[d];return e},get:function(a,b){return void 0===b?this.cache(a):a[this.expando]&&a[this.expando][r.camelCase(b)]},access:function(a,b,c){return void 0===b||b&&"string"==typeof b&&void 0===c?this.get(a,b):(this.set(a,b,c),void 0!==c?c:b)},remove:function(a,b){var c,d=a[this.expando];if(void 0!==d){if(void 0!==b){Array.isArray(b)?b=b.map(r.camelCase):(b=r.camelCase(b),b=b in d?[b]:b.match(L)||[]),c=b.length;while(c--)delete d[b[c]]}(void 0===b||r.isEmptyObject(d))&&(a.nodeType?a[this.expando]=void 0:delete a[this.expando])}},hasData:function(a){var b=a[this.expando];return void 0!==b&&!r.isEmptyObject(b)}};var W=new V,X=new V,Y=/^(?:\{[\w\W]*\}|\[[\w\W]*\])$/,Z=/[A-Z]/g;function $(a){return"true"===a||"false"!==a&&("null"===a?null:a===+a+""?+a:Y.test(a)?JSON.parse(a):a)}function _(a,b,c){var d;if(void 0===c&&1===a.nodeType)if(d="data-"+b.replace(Z,"-$&").toLowerCase(),c=a.getAttribute(d),"string"==typeof c){try{c=$(c)}catch(e){}X.set(a,b,c)}else c=void 0;return c}r.extend({hasData:function(a){return X.hasData(a)||W.hasData(a)},data:function(a,b,c){return X.access(a,b,c)},removeData:function(a,b){X.remove(a,b)},_data:function(a,b,c){return W.access(a,b,c)},_removeData:function(a,b){W.remove(a,b)}}),r.fn.extend({data:function(a,b){var c,d,e,f=this[0],g=f&&f.attributes;if(void 0===a){if(this.length&&(e=X.get(f),1===f.nodeType&&!W.get(f,"hasDataAttrs"))){c=g.length;while(c--)g[c]&&(d=g[c].name,0===d.indexOf("data-")&&(d=r.camelCase(d.slice(5)),_(f,d,e[d])));W.set(f,"hasDataAttrs",!0)}return e}return"object"==typeof a?this.each(function(){X.set(this,a)}):T(this,function(b){var c;if(f&&void 0===b){if(c=X.get(f,a),void 0!==c)return c;if(c=_(f,a),void 0!==c)return c}else this.each(function(){X.set(this,a,b)})},null,b,arguments.length>1,null,!0)},removeData:function(a){return this.each(function(){X.remove(this,a)})}}),r.extend({queue:function(a,b,c){var d;if(a)return b=(b||"fx")+"queue",d=W.get(a,b),c&&(!d||Array.isArray(c)?d=W.access(a,b,r.makeArray(c)):d.push(c)),d||[]},dequeue:function(a,b){b=b||"fx";var c=r.queue(a,b),d=c.length,e=c.shift(),f=r._queueHooks(a,b),g=function(){r.dequeue(a,b)};"inprogress"===e&&(e=c.shift(),d--),e&&("fx"===b&&c.unshift("inprogress"),delete f.stop,e.call(a,g,f)),!d&&f&&f.empty.fire()},_queueHooks:function(a,b){var c=b+"queueHooks";return W.get(a,c)||W.access(a,c,{empty:r.Callbacks("once memory").add(function(){W.remove(a,[b+"queue",c])})})}}),r.fn.extend({queue:function(a,b){var c=2;return"string"!=typeof a&&(b=a,a="fx",c--),arguments.length<c?r.queue(this[0],a):void 0===b?this:this.each(function(){var c=r.queue(this,a,b);r._queueHooks(this,a),"fx"===a&&"inprogress"!==c[0]&&r.dequeue(this,a)})},dequeue:function(a){return this.each(function(){r.dequeue(this,a)})},clearQueue:function(a){return this.queue(a||"fx",[])},promise:function(a,b){var c,d=1,e=r.Deferred(),f=this,g=this.length,h=function(){--d||e.resolveWith(f,[f])};"string"!=typeof a&&(b=a,a=void 0),a=a||"fx";while(g--)c=W.get(f[g],a+"queueHooks"),c&&c.empty&&(d++,c.empty.add(h));return h(),e.promise(b)}});var aa=/[+-]?(?:\d*\.|)\d+(?:[eE][+-]?\d+|)/.source,ba=new RegExp("^(?:([+-])=|)("+aa+")([a-z%]*)$","i"),ca=["Top","Right","Bottom","Left"],da=function(a,b){return a=b||a,"none"===a.style.display||""===a.style.display&&r.contains(a.ownerDocument,a)&&"none"===r.css(a,"display")},ea=function(a,b,c,d){var e,f,g={};for(f in b)g[f]=a.style[f],a.style[f]=b[f];e=c.apply(a,d||[]);for(f in b)a.style[f]=g[f];return e};function fa(a,b,c,d){var e,f=1,g=20,h=d?function(){return d.cur()}:function(){return r.css(a,b,"")},i=h(),j=c&&c[3]||(r.cssNumber[b]?"":"px"),k=(r.cssNumber[b]||"px"!==j&&+i)&&ba.exec(r.css(a,b));if(k&&k[3]!==j){j=j||k[3],c=c||[],k=+i||1;do f=f||".5",k/=f,r.style(a,b,k+j);while(f!==(f=h()/i)&&1!==f&&--g)}return c&&(k=+k||+i||0,e=c[1]?k+(c[1]+1)*c[2]:+c[2],d&&(d.unit=j,d.start=k,d.end=e)),e}var ga={};function ha(a){var b,c=a.ownerDocument,d=a.nodeName,e=ga[d];return e?e:(b=c.body.appendChild(c.createElement(d)),e=r.css(b,"display"),b.parentNode.removeChild(b),"none"===e&&(e="block"),ga[d]=e,e)}function ia(a,b){for(var c,d,e=[],f=0,g=a.length;f<g;f++)d=a[f],d.style&&(c=d.style.display,b?("none"===c&&(e[f]=W.get(d,"display")||null,e[f]||(d.style.display="")),""===d.style.display&&da(d)&&(e[f]=ha(d))):"none"!==c&&(e[f]="none",W.set(d,"display",c)));for(f=0;f<g;f++)null!=e[f]&&(a[f].style.display=e[f]);return a}r.fn.extend({show:function(){return ia(this,!0)},hide:function(){return ia(this)},toggle:function(a){return"boolean"==typeof a?a?this.show():this.hide():this.each(function(){da(this)?r(this).show():r(this).hide()})}});var ja=/^(?:checkbox|radio)$/i,ka=/<([a-z][^\/\0>\x20\t\r\n\f]+)/i,la=/^$|\/(?:java|ecma)script/i,ma={option:[1,"<select multiple='multiple'>","</select>"],thead:[1,"<table>","</table>"],col:[2,"<table><colgroup>","</colgroup></table>"],tr:[2,"<table><tbody>","</tbody></table>"],td:[3,"<table><tbody><tr>","</tr></tbody></table>"],_default:[0,"",""]};ma.optgroup=ma.option,ma.tbody=ma.tfoot=ma.colgroup=ma.caption=ma.thead,ma.th=ma.td;function na(a,b){var c;return c="undefined"!=typeof a.getElementsByTagName?a.getElementsByTagName(b||"*"):"undefined"!=typeof a.querySelectorAll?a.querySelectorAll(b||"*"):[],void 0===b||b&&B(a,b)?r.merge([a],c):c}function oa(a,b){for(var c=0,d=a.length;c<d;c++)W.set(a[c],"globalEval",!b||W.get(b[c],"globalEval"))}var pa=/<|&#?\w+;/;function qa(a,b,c,d,e){for(var f,g,h,i,j,k,l=b.createDocumentFragment(),m=[],n=0,o=a.length;n<o;n++)if(f=a[n],f||0===f)if("object"===r.type(f))r.merge(m,f.nodeType?[f]:f);else if(pa.test(f)){g=g||l.appendChild(b.createElement("div")),h=(ka.exec(f)||["",""])[1].toLowerCase(),i=ma[h]||ma._default,g.innerHTML=i[1]+r.htmlPrefilter(f)+i[2],k=i[0];while(k--)g=g.lastChild;r.merge(m,g.childNodes),g=l.firstChild,g.textContent=""}else m.push(b.createTextNode(f));l.textContent="",n=0;while(f=m[n++])if(d&&r.inArray(f,d)>-1)e&&e.push(f);else if(j=r.contains(f.ownerDocument,f),g=na(l.appendChild(f),"script"),j&&oa(g),c){k=0;while(f=g[k++])la.test(f.type||"")&&c.push(f)}return l}!function(){var a=d.createDocumentFragment(),b=a.appendChild(d.createElement("div")),c=d.createElement("input");c.setAttribute("type","radio"),c.setAttribute("checked","checked"),c.setAttribute("name","t"),b.appendChild(c),o.checkClone=b.cloneNode(!0).cloneNode(!0).lastChild.checked,b.innerHTML="<textarea>x</textarea>",o.noCloneChecked=!!b.cloneNode(!0).lastChild.defaultValue}();var ra=d.documentElement,sa=/^key/,ta=/^(?:mouse|pointer|contextmenu|drag|drop)|click/,ua=/^([^.]*)(?:\.(.+)|)/;function va(){return!0}function wa(){return!1}function xa(){try{return d.activeElement}catch(a){}}function ya(a,b,c,d,e,f){var g,h;if("object"==typeof b){"string"!=typeof c&&(d=d||c,c=void 0);for(h in b)ya(a,h,c,d,b[h],f);return a}if(null==d&&null==e?(e=c,d=c=void 0):null==e&&("string"==typeof c?(e=d,d=void 0):(e=d,d=c,c=void 0)),e===!1)e=wa;else if(!e)return a;return 1===f&&(g=e,e=function(a){return r().off(a),g.apply(this,arguments)},e.guid=g.guid||(g.guid=r.guid++)),a.each(function(){r.event.add(this,b,e,d,c)})}r.event={global:{},add:function(a,b,c,d,e){var f,g,h,i,j,k,l,m,n,o,p,q=W.get(a);if(q){c.handler&&(f=c,c=f.handler,e=f.selector),e&&r.find.matchesSelector(ra,e),c.guid||(c.guid=r.guid++),(i=q.events)||(i=q.events={}),(g=q.handle)||(g=q.handle=function(b){return"undefined"!=typeof r&&r.event.triggered!==b.type?r.event.dispatch.apply(a,arguments):void 0}),b=(b||"").match(L)||[""],j=b.length;while(j--)h=ua.exec(b[j])||[],n=p=h[1],o=(h[2]||"").split(".").sort(),n&&(l=r.event.special[n]||{},n=(e?l.delegateType:l.bindType)||n,l=r.event.special[n]||{},k=r.extend({type:n,origType:p,data:d,handler:c,guid:c.guid,selector:e,needsContext:e&&r.expr.match.needsContext.test(e),namespace:o.join(".")},f),(m=i[n])||(m=i[n]=[],m.delegateCount=0,l.setup&&l.setup.call(a,d,o,g)!==!1||a.addEventListener&&a.addEventListener(n,g)),l.add&&(l.add.call(a,k),k.handler.guid||(k.handler.guid=c.guid)),e?m.splice(m.delegateCount++,0,k):m.push(k),r.event.global[n]=!0)}},remove:function(a,b,c,d,e){var f,g,h,i,j,k,l,m,n,o,p,q=W.hasData(a)&&W.get(a);if(q&&(i=q.events)){b=(b||"").match(L)||[""],j=b.length;while(j--)if(h=ua.exec(b[j])||[],n=p=h[1],o=(h[2]||"").split(".").sort(),n){l=r.event.special[n]||{},n=(d?l.delegateType:l.bindType)||n,m=i[n]||[],h=h[2]&&new RegExp("(^|\\.)"+o.join("\\.(?:.*\\.|)")+"(\\.|$)"),g=f=m.length;while(f--)k=m[f],!e&&p!==k.origType||c&&c.guid!==k.guid||h&&!h.test(k.namespace)||d&&d!==k.selector&&("**"!==d||!k.selector)||(m.splice(f,1),k.selector&&m.delegateCount--,l.remove&&l.remove.call(a,k));g&&!m.length&&(l.teardown&&l.teardown.call(a,o,q.handle)!==!1||r.removeEvent(a,n,q.handle),delete i[n])}else for(n in i)r.event.remove(a,n+b[j],c,d,!0);r.isEmptyObject(i)&&W.remove(a,"handle events")}},dispatch:function(a){var b=r.event.fix(a),c,d,e,f,g,h,i=new Array(arguments.length),j=(W.get(this,"events")||{})[b.type]||[],k=r.event.special[b.type]||{};for(i[0]=b,c=1;c<arguments.length;c++)i[c]=arguments[c];if(b.delegateTarget=this,!k.preDispatch||k.preDispatch.call(this,b)!==!1){h=r.event.handlers.call(this,b,j),c=0;while((f=h[c++])&&!b.isPropagationStopped()){b.currentTarget=f.elem,d=0;while((g=f.handlers[d++])&&!b.isImmediatePropagationStopped())b.rnamespace&&!b.rnamespace.test(g.namespace)||(b.handleObj=g,b.data=g.data,e=((r.event.special[g.origType]||{}).handle||g.handler).apply(f.elem,i),void 0!==e&&(b.result=e)===!1&&(b.preventDefault(),b.stopPropagation()))}return k.postDispatch&&k.postDispatch.call(this,b),b.result}},handlers:function(a,b){var c,d,e,f,g,h=[],i=b.delegateCount,j=a.target;if(i&&j.nodeType&&!("click"===a.type&&a.button>=1))for(;j!==this;j=j.parentNode||this)if(1===j.nodeType&&("click"!==a.type||j.disabled!==!0)){for(f=[],g={},c=0;c<i;c++)d=b[c],e=d.selector+" ",void 0===g[e]&&(g[e]=d.needsContext?r(e,this).index(j)>-1:r.find(e,this,null,[j]).length),g[e]&&f.push(d);f.length&&h.push({elem:j,handlers:f})}return j=this,i<b.length&&h.push({elem:j,handlers:b.slice(i)}),h},addProp:function(a,b){Object.defineProperty(r.Event.prototype,a,{enumerable:!0,configurable:!0,get:r.isFunction(b)?function(){if(this.originalEvent)return b(this.originalEvent)}:function(){if(this.originalEvent)return this.originalEvent[a]},set:function(b){Object.defineProperty(this,a,{enumerable:!0,configurable:!0,writable:!0,value:b})}})},fix:function(a){return a[r.expando]?a:new r.Event(a)},special:{load:{noBubble:!0},focus:{trigger:function(){if(this!==xa()&&this.focus)return this.focus(),!1},delegateType:"focusin"},blur:{trigger:function(){if(this===xa()&&this.blur)return this.blur(),!1},delegateType:"focusout"},click:{trigger:function(){if("checkbox"===this.type&&this.click&&B(this,"input"))return this.click(),!1},_default:function(a){return B(a.target,"a")}},beforeunload:{postDispatch:function(a){void 0!==a.result&&a.originalEvent&&(a.originalEvent.returnValue=a.result)}}}},r.removeEvent=function(a,b,c){a.removeEventListener&&a.removeEventListener(b,c)},r.Event=function(a,b){return this instanceof r.Event?(a&&a.type?(this.originalEvent=a,this.type=a.type,this.isDefaultPrevented=a.defaultPrevented||void 0===a.defaultPrevented&&a.returnValue===!1?va:wa,this.target=a.target&&3===a.target.nodeType?a.target.parentNode:a.target,this.currentTarget=a.currentTarget,this.relatedTarget=a.relatedTarget):this.type=a,b&&r.extend(this,b),this.timeStamp=a&&a.timeStamp||r.now(),void(this[r.expando]=!0)):new r.Event(a,b)},r.Event.prototype={constructor:r.Event,isDefaultPrevented:wa,isPropagationStopped:wa,isImmediatePropagationStopped:wa,isSimulated:!1,preventDefault:function(){var a=this.originalEvent;this.isDefaultPrevented=va,a&&!this.isSimulated&&a.preventDefault()},stopPropagation:function(){var a=this.originalEvent;this.isPropagationStopped=va,a&&!this.isSimulated&&a.stopPropagation()},stopImmediatePropagation:function(){var a=this.originalEvent;this.isImmediatePropagationStopped=va,a&&!this.isSimulated&&a.stopImmediatePropagation(),this.stopPropagation()}},r.each({altKey:!0,bubbles:!0,cancelable:!0,changedTouches:!0,ctrlKey:!0,detail:!0,eventPhase:!0,metaKey:!0,pageX:!0,pageY:!0,shiftKey:!0,view:!0,"char":!0,charCode:!0,key:!0,keyCode:!0,button:!0,buttons:!0,clientX:!0,clientY:!0,offsetX:!0,offsetY:!0,pointerId:!0,pointerType:!0,screenX:!0,screenY:!0,targetTouches:!0,toElement:!0,touches:!0,which:function(a){var b=a.button;return null==a.which&&sa.test(a.type)?null!=a.charCode?a.charCode:a.keyCode:!a.which&&void 0!==b&&ta.test(a.type)?1&b?1:2&b?3:4&b?2:0:a.which}},r.event.addProp),r.each({mouseenter:"mouseover",mouseleave:"mouseout",pointerenter:"pointerover",pointerleave:"pointerout"},function(a,b){r.event.special[a]={delegateType:b,bindType:b,handle:function(a){var c,d=this,e=a.relatedTarget,f=a.handleObj;return e&&(e===d||r.contains(d,e))||(a.type=f.origType,c=f.handler.apply(this,arguments),a.type=b),c}}}),r.fn.extend({on:function(a,b,c,d){return ya(this,a,b,c,d)},one:function(a,b,c,d){return ya(this,a,b,c,d,1)},off:function(a,b,c){var d,e;if(a&&a.preventDefault&&a.handleObj)return d=a.handleObj,r(a.delegateTarget).off(d.namespace?d.origType+"."+d.namespace:d.origType,d.selector,d.handler),this;if("object"==typeof a){for(e in a)this.off(e,b,a[e]);return this}return b!==!1&&"function"!=typeof b||(c=b,b=void 0),c===!1&&(c=wa),this.each(function(){r.event.remove(this,a,c,b)})}});var za=/<(?!area|br|col|embed|hr|img|input|link|meta|param)(([a-z][^\/\0>\x20\t\r\n\f]*)[^>]*)\/>/gi,Aa=/<script|<style|<link/i,Ba=/checked\s*(?:[^=]|=\s*.checked.)/i,Ca=/^true\/(.*)/,Da=/^\s*<!(?:\[CDATA\[|--)|(?:\]\]|--)>\s*$/g;function Ea(a,b){return B(a,"table")&&B(11!==b.nodeType?b:b.firstChild,"tr")?r(">tbody",a)[0]||a:a}function Fa(a){return a.type=(null!==a.getAttribute("type"))+"/"+a.type,a}function Ga(a){var b=Ca.exec(a.type);return b?a.type=b[1]:a.removeAttribute("type"),a}function Ha(a,b){var c,d,e,f,g,h,i,j;if(1===b.nodeType){if(W.hasData(a)&&(f=W.access(a),g=W.set(b,f),j=f.events)){delete g.handle,g.events={};for(e in j)for(c=0,d=j[e].length;c<d;c++)r.event.add(b,e,j[e][c])}X.hasData(a)&&(h=X.access(a),i=r.extend({},h),X.set(b,i))}}function Ia(a,b){var c=b.nodeName.toLowerCase();"input"===c&&ja.test(a.type)?b.checked=a.checked:"input"!==c&&"textarea"!==c||(b.defaultValue=a.defaultValue)}function Ja(a,b,c,d){b=g.apply([],b);var e,f,h,i,j,k,l=0,m=a.length,n=m-1,q=b[0],s=r.isFunction(q);if(s||m>1&&"string"==typeof q&&!o.checkClone&&Ba.test(q))return a.each(function(e){var f=a.eq(e);s&&(b[0]=q.call(this,e,f.html())),Ja(f,b,c,d)});if(m&&(e=qa(b,a[0].ownerDocument,!1,a,d),f=e.firstChild,1===e.childNodes.length&&(e=f),f||d)){for(h=r.map(na(e,"script"),Fa),i=h.length;l<m;l++)j=e,l!==n&&(j=r.clone(j,!0,!0),i&&r.merge(h,na(j,"script"))),c.call(a[l],j,l);if(i)for(k=h[h.length-1].ownerDocument,r.map(h,Ga),l=0;l<i;l++)j=h[l],la.test(j.type||"")&&!W.access(j,"globalEval")&&r.contains(k,j)&&(j.src?r._evalUrl&&r._evalUrl(j.src):p(j.textContent.replace(Da,""),k))}return a}function Ka(a,b,c){for(var d,e=b?r.filter(b,a):a,f=0;null!=(d=e[f]);f++)c||1!==d.nodeType||r.cleanData(na(d)),d.parentNode&&(c&&r.contains(d.ownerDocument,d)&&oa(na(d,"script")),d.parentNode.removeChild(d));return a}r.extend({htmlPrefilter:function(a){return a.replace(za,"<$1></$2>")},clone:function(a,b,c){var d,e,f,g,h=a.cloneNode(!0),i=r.contains(a.ownerDocument,a);if(!(o.noCloneChecked||1!==a.nodeType&&11!==a.nodeType||r.isXMLDoc(a)))for(g=na(h),f=na(a),d=0,e=f.length;d<e;d++)Ia(f[d],g[d]);if(b)if(c)for(f=f||na(a),g=g||na(h),d=0,e=f.length;d<e;d++)Ha(f[d],g[d]);else Ha(a,h);return g=na(h,"script"),g.length>0&&oa(g,!i&&na(a,"script")),h},cleanData:function(a){for(var b,c,d,e=r.event.special,f=0;void 0!==(c=a[f]);f++)if(U(c)){if(b=c[W.expando]){if(b.events)for(d in b.events)e[d]?r.event.remove(c,d):r.removeEvent(c,d,b.handle);c[W.expando]=void 0}c[X.expando]&&(c[X.expando]=void 0)}}}),r.fn.extend({detach:function(a){return Ka(this,a,!0)},remove:function(a){return Ka(this,a)},text:function(a){return T(this,function(a){return void 0===a?r.text(this):this.empty().each(function(){1!==this.nodeType&&11!==this.nodeType&&9!==this.nodeType||(this.textContent=a)})},null,a,arguments.length)},append:function(){return Ja(this,arguments,function(a){if(1===this.nodeType||11===this.nodeType||9===this.nodeType){var b=Ea(this,a);b.appendChild(a)}})},prepend:function(){return Ja(this,arguments,function(a){if(1===this.nodeType||11===this.nodeType||9===this.nodeType){var b=Ea(this,a);b.insertBefore(a,b.firstChild)}})},before:function(){return Ja(this,arguments,function(a){this.parentNode&&this.parentNode.insertBefore(a,this)})},after:function(){return Ja(this,arguments,function(a){this.parentNode&&this.parentNode.insertBefore(a,this.nextSibling)})},empty:function(){for(var a,b=0;null!=(a=this[b]);b++)1===a.nodeType&&(r.cleanData(na(a,!1)),a.textContent="");return this},clone:function(a,b){return a=null!=a&&a,b=null==b?a:b,this.map(function(){return r.clone(this,a,b)})},html:function(a){return T(this,function(a){var b=this[0]||{},c=0,d=this.length;if(void 0===a&&1===b.nodeType)return b.innerHTML;if("string"==typeof a&&!Aa.test(a)&&!ma[(ka.exec(a)||["",""])[1].toLowerCase()]){a=r.htmlPrefilter(a);try{for(;c<d;c++)b=this[c]||{},1===b.nodeType&&(r.cleanData(na(b,!1)),b.innerHTML=a);b=0}catch(e){}}b&&this.empty().append(a)},null,a,arguments.length)},replaceWith:function(){var a=[];return Ja(this,arguments,function(b){var c=this.parentNode;r.inArray(this,a)<0&&(r.cleanData(na(this)),c&&c.replaceChild(b,this))},a)}}),r.each({appendTo:"append",prependTo:"prepend",insertBefore:"before",insertAfter:"after",replaceAll:"replaceWith"},function(a,b){r.fn[a]=function(a){for(var c,d=[],e=r(a),f=e.length-1,g=0;g<=f;g++)c=g===f?this:this.clone(!0),r(e[g])[b](c),h.apply(d,c.get());return this.pushStack(d)}});var La=/^margin/,Ma=new RegExp("^("+aa+")(?!px)[a-z%]+$","i"),Na=function(b){var c=b.ownerDocument.defaultView;return c&&c.opener||(c=a),c.getComputedStyle(b)};!function(){function b(){if(i){i.style.cssText="box-sizing:border-box;position:relative;display:block;margin:auto;border:1px;padding:1px;top:1%;width:50%",i.innerHTML="",ra.appendChild(h);var b=a.getComputedStyle(i);c="1%"!==b.top,g="2px"===b.marginLeft,e="4px"===b.width,i.style.marginRight="50%",f="4px"===b.marginRight,ra.removeChild(h),i=null}}var c,e,f,g,h=d.createElement("div"),i=d.createElement("div");i.style&&(i.style.backgroundClip="content-box",i.cloneNode(!0).style.backgroundClip="",o.clearCloneStyle="content-box"===i.style.backgroundClip,h.style.cssText="border:0;width:8px;height:0;top:0;left:-9999px;padding:0;margin-top:1px;position:absolute",h.appendChild(i),r.extend(o,{pixelPosition:function(){return b(),c},boxSizingReliable:function(){return b(),e},pixelMarginRight:function(){return b(),f},reliableMarginLeft:function(){return b(),g}}))}();function Oa(a,b,c){var d,e,f,g,h=a.style;return c=c||Na(a),c&&(g=c.getPropertyValue(b)||c[b],""!==g||r.contains(a.ownerDocument,a)||(g=r.style(a,b)),!o.pixelMarginRight()&&Ma.test(g)&&La.test(b)&&(d=h.width,e=h.minWidth,f=h.maxWidth,h.minWidth=h.maxWidth=h.width=g,g=c.width,h.width=d,h.minWidth=e,h.maxWidth=f)),void 0!==g?g+"":g}function Pa(a,b){return{get:function(){return a()?void delete this.get:(this.get=b).apply(this,arguments)}}}var Qa=/^(none|table(?!-c[ea]).+)/,Ra=/^--/,Sa={position:"absolute",visibility:"hidden",display:"block"},Ta={letterSpacing:"0",fontWeight:"400"},Ua=["Webkit","Moz","ms"],Va=d.createElement("div").style;function Wa(a){if(a in Va)return a;var b=a[0].toUpperCase()+a.slice(1),c=Ua.length;while(c--)if(a=Ua[c]+b,a in Va)return a}function Xa(a){var b=r.cssProps[a];return b||(b=r.cssProps[a]=Wa(a)||a),b}function Ya(a,b,c){var d=ba.exec(b);return d?Math.max(0,d[2]-(c||0))+(d[3]||"px"):b}function Za(a,b,c,d,e){var f,g=0;for(f=c===(d?"border":"content")?4:"width"===b?1:0;f<4;f+=2)"margin"===c&&(g+=r.css(a,c+ca[f],!0,e)),d?("content"===c&&(g-=r.css(a,"padding"+ca[f],!0,e)),"margin"!==c&&(g-=r.css(a,"border"+ca[f]+"Width",!0,e))):(g+=r.css(a,"padding"+ca[f],!0,e),"padding"!==c&&(g+=r.css(a,"border"+ca[f]+"Width",!0,e)));return g}function $a(a,b,c){var d,e=Na(a),f=Oa(a,b,e),g="border-box"===r.css(a,"boxSizing",!1,e);return Ma.test(f)?f:(d=g&&(o.boxSizingReliable()||f===a.style[b]),"auto"===f&&(f=a["offset"+b[0].toUpperCase()+b.slice(1)]),f=parseFloat(f)||0,f+Za(a,b,c||(g?"border":"content"),d,e)+"px")}r.extend({cssHooks:{opacity:{get:function(a,b){if(b){var c=Oa(a,"opacity");return""===c?"1":c}}}},cssNumber:{animationIterationCount:!0,columnCount:!0,fillOpacity:!0,flexGrow:!0,flexShrink:!0,fontWeight:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,widows:!0,zIndex:!0,zoom:!0},cssProps:{"float":"cssFloat"},style:function(a,b,c,d){if(a&&3!==a.nodeType&&8!==a.nodeType&&a.style){var e,f,g,h=r.camelCase(b),i=Ra.test(b),j=a.style;return i||(b=Xa(h)),g=r.cssHooks[b]||r.cssHooks[h],void 0===c?g&&"get"in g&&void 0!==(e=g.get(a,!1,d))?e:j[b]:(f=typeof c,"string"===f&&(e=ba.exec(c))&&e[1]&&(c=fa(a,b,e),f="number"),null!=c&&c===c&&("number"===f&&(c+=e&&e[3]||(r.cssNumber[h]?"":"px")),o.clearCloneStyle||""!==c||0!==b.indexOf("background")||(j[b]="inherit"),g&&"set"in g&&void 0===(c=g.set(a,c,d))||(i?j.setProperty(b,c):j[b]=c)),void 0)}},css:function(a,b,c,d){var e,f,g,h=r.camelCase(b),i=Ra.test(b);return i||(b=Xa(h)),g=r.cssHooks[b]||r.cssHooks[h],g&&"get"in g&&(e=g.get(a,!0,c)),void 0===e&&(e=Oa(a,b,d)),"normal"===e&&b in Ta&&(e=Ta[b]),""===c||c?(f=parseFloat(e),c===!0||isFinite(f)?f||0:e):e}}),r.each(["height","width"],function(a,b){r.cssHooks[b]={get:function(a,c,d){if(c)return!Qa.test(r.css(a,"display"))||a.getClientRects().length&&a.getBoundingClientRect().width?$a(a,b,d):ea(a,Sa,function(){return $a(a,b,d)})},set:function(a,c,d){var e,f=d&&Na(a),g=d&&Za(a,b,d,"border-box"===r.css(a,"boxSizing",!1,f),f);return g&&(e=ba.exec(c))&&"px"!==(e[3]||"px")&&(a.style[b]=c,c=r.css(a,b)),Ya(a,c,g)}}}),r.cssHooks.marginLeft=Pa(o.reliableMarginLeft,function(a,b){if(b)return(parseFloat(Oa(a,"marginLeft"))||a.getBoundingClientRect().left-ea(a,{marginLeft:0},function(){return a.getBoundingClientRect().left}))+"px"}),r.each({margin:"",padding:"",border:"Width"},function(a,b){r.cssHooks[a+b]={expand:function(c){for(var d=0,e={},f="string"==typeof c?c.split(" "):[c];d<4;d++)e[a+ca[d]+b]=f[d]||f[d-2]||f[0];return e}},La.test(a)||(r.cssHooks[a+b].set=Ya)}),r.fn.extend({css:function(a,b){return T(this,function(a,b,c){var d,e,f={},g=0;if(Array.isArray(b)){for(d=Na(a),e=b.length;g<e;g++)f[b[g]]=r.css(a,b[g],!1,d);return f}return void 0!==c?r.style(a,b,c):r.css(a,b)},a,b,arguments.length>1)}});function _a(a,b,c,d,e){return new _a.prototype.init(a,b,c,d,e)}r.Tween=_a,_a.prototype={constructor:_a,init:function(a,b,c,d,e,f){this.elem=a,this.prop=c,this.easing=e||r.easing._default,this.options=b,this.start=this.now=this.cur(),this.end=d,this.unit=f||(r.cssNumber[c]?"":"px")},cur:function(){var a=_a.propHooks[this.prop];return a&&a.get?a.get(this):_a.propHooks._default.get(this)},run:function(a){var b,c=_a.propHooks[this.prop];return this.options.duration?this.pos=b=r.easing[this.easing](a,this.options.duration*a,0,1,this.options.duration):this.pos=b=a,this.now=(this.end-this.start)*b+this.start,this.options.step&&this.options.step.call(this.elem,this.now,this),c&&c.set?c.set(this):_a.propHooks._default.set(this),this}},_a.prototype.init.prototype=_a.prototype,_a.propHooks={_default:{get:function(a){var b;return 1!==a.elem.nodeType||null!=a.elem[a.prop]&&null==a.elem.style[a.prop]?a.elem[a.prop]:(b=r.css(a.elem,a.prop,""),b&&"auto"!==b?b:0)},set:function(a){r.fx.step[a.prop]?r.fx.step[a.prop](a):1!==a.elem.nodeType||null==a.elem.style[r.cssProps[a.prop]]&&!r.cssHooks[a.prop]?a.elem[a.prop]=a.now:r.style(a.elem,a.prop,a.now+a.unit)}}},_a.propHooks.scrollTop=_a.propHooks.scrollLeft={set:function(a){a.elem.nodeType&&a.elem.parentNode&&(a.elem[a.prop]=a.now)}},r.easing={linear:function(a){return a},swing:function(a){return.5-Math.cos(a*Math.PI)/2},_default:"swing"},r.fx=_a.prototype.init,r.fx.step={};var ab,bb,cb=/^(?:toggle|show|hide)$/,db=/queueHooks$/;function eb(){bb&&(d.hidden===!1&&a.requestAnimationFrame?a.requestAnimationFrame(eb):a.setTimeout(eb,r.fx.interval),r.fx.tick())}function fb(){return a.setTimeout(function(){ab=void 0}),ab=r.now()}function gb(a,b){var c,d=0,e={height:a};for(b=b?1:0;d<4;d+=2-b)c=ca[d],e["margin"+c]=e["padding"+c]=a;return b&&(e.opacity=e.width=a),e}function hb(a,b,c){for(var d,e=(kb.tweeners[b]||[]).concat(kb.tweeners["*"]),f=0,g=e.length;f<g;f++)if(d=e[f].call(c,b,a))return d}function ib(a,b,c){var d,e,f,g,h,i,j,k,l="width"in b||"height"in b,m=this,n={},o=a.style,p=a.nodeType&&da(a),q=W.get(a,"fxshow");c.queue||(g=r._queueHooks(a,"fx"),null==g.unqueued&&(g.unqueued=0,h=g.empty.fire,g.empty.fire=function(){g.unqueued||h()}),g.unqueued++,m.always(function(){m.always(function(){g.unqueued--,r.queue(a,"fx").length||g.empty.fire()})}));for(d in b)if(e=b[d],cb.test(e)){if(delete b[d],f=f||"toggle"===e,e===(p?"hide":"show")){if("show"!==e||!q||void 0===q[d])continue;p=!0}n[d]=q&&q[d]||r.style(a,d)}if(i=!r.isEmptyObject(b),i||!r.isEmptyObject(n)){l&&1===a.nodeType&&(c.overflow=[o.overflow,o.overflowX,o.overflowY],j=q&&q.display,null==j&&(j=W.get(a,"display")),k=r.css(a,"display"),"none"===k&&(j?k=j:(ia([a],!0),j=a.style.display||j,k=r.css(a,"display"),ia([a]))),("inline"===k||"inline-block"===k&&null!=j)&&"none"===r.css(a,"float")&&(i||(m.done(function(){o.display=j}),null==j&&(k=o.display,j="none"===k?"":k)),o.display="inline-block")),c.overflow&&(o.overflow="hidden",m.always(function(){o.overflow=c.overflow[0],o.overflowX=c.overflow[1],o.overflowY=c.overflow[2]})),i=!1;for(d in n)i||(q?"hidden"in q&&(p=q.hidden):q=W.access(a,"fxshow",{display:j}),f&&(q.hidden=!p),p&&ia([a],!0),m.done(function(){p||ia([a]),W.remove(a,"fxshow");for(d in n)r.style(a,d,n[d])})),i=hb(p?q[d]:0,d,m),d in q||(q[d]=i.start,p&&(i.end=i.start,i.start=0))}}function jb(a,b){var c,d,e,f,g;for(c in a)if(d=r.camelCase(c),e=b[d],f=a[c],Array.isArray(f)&&(e=f[1],f=a[c]=f[0]),c!==d&&(a[d]=f,delete a[c]),g=r.cssHooks[d],g&&"expand"in g){f=g.expand(f),delete a[d];for(c in f)c in a||(a[c]=f[c],b[c]=e)}else b[d]=e}function kb(a,b,c){var d,e,f=0,g=kb.prefilters.length,h=r.Deferred().always(function(){delete i.elem}),i=function(){if(e)return!1;for(var b=ab||fb(),c=Math.max(0,j.startTime+j.duration-b),d=c/j.duration||0,f=1-d,g=0,i=j.tweens.length;g<i;g++)j.tweens[g].run(f);return h.notifyWith(a,[j,f,c]),f<1&&i?c:(i||h.notifyWith(a,[j,1,0]),h.resolveWith(a,[j]),!1)},j=h.promise({elem:a,props:r.extend({},b),opts:r.extend(!0,{specialEasing:{},easing:r.easing._default},c),originalProperties:b,originalOptions:c,startTime:ab||fb(),duration:c.duration,tweens:[],createTween:function(b,c){var d=r.Tween(a,j.opts,b,c,j.opts.specialEasing[b]||j.opts.easing);return j.tweens.push(d),d},stop:function(b){var c=0,d=b?j.tweens.length:0;if(e)return this;for(e=!0;c<d;c++)j.tweens[c].run(1);return b?(h.notifyWith(a,[j,1,0]),h.resolveWith(a,[j,b])):h.rejectWith(a,[j,b]),this}}),k=j.props;for(jb(k,j.opts.specialEasing);f<g;f++)if(d=kb.prefilters[f].call(j,a,k,j.opts))return r.isFunction(d.stop)&&(r._queueHooks(j.elem,j.opts.queue).stop=r.proxy(d.stop,d)),d;return r.map(k,hb,j),r.isFunction(j.opts.start)&&j.opts.start.call(a,j),j.progress(j.opts.progress).done(j.opts.done,j.opts.complete).fail(j.opts.fail).always(j.opts.always),r.fx.timer(r.extend(i,{elem:a,anim:j,queue:j.opts.queue})),j}r.Animation=r.extend(kb,{tweeners:{"*":[function(a,b){var c=this.createTween(a,b);return fa(c.elem,a,ba.exec(b),c),c}]},tweener:function(a,b){r.isFunction(a)?(b=a,a=["*"]):a=a.match(L);for(var c,d=0,e=a.length;d<e;d++)c=a[d],kb.tweeners[c]=kb.tweeners[c]||[],kb.tweeners[c].unshift(b)},prefilters:[ib],prefilter:function(a,b){b?kb.prefilters.unshift(a):kb.prefilters.push(a)}}),r.speed=function(a,b,c){var d=a&&"object"==typeof a?r.extend({},a):{complete:c||!c&&b||r.isFunction(a)&&a,duration:a,easing:c&&b||b&&!r.isFunction(b)&&b};return r.fx.off?d.duration=0:"number"!=typeof d.duration&&(d.duration in r.fx.speeds?d.duration=r.fx.speeds[d.duration]:d.duration=r.fx.speeds._default),null!=d.queue&&d.queue!==!0||(d.queue="fx"),d.old=d.complete,d.complete=function(){r.isFunction(d.old)&&d.old.call(this),d.queue&&r.dequeue(this,d.queue)},d},r.fn.extend({fadeTo:function(a,b,c,d){return this.filter(da).css("opacity",0).show().end().animate({opacity:b},a,c,d)},animate:function(a,b,c,d){var e=r.isEmptyObject(a),f=r.speed(b,c,d),g=function(){var b=kb(this,r.extend({},a),f);(e||W.get(this,"finish"))&&b.stop(!0)};return g.finish=g,e||f.queue===!1?this.each(g):this.queue(f.queue,g)},stop:function(a,b,c){var d=function(a){var b=a.stop;delete a.stop,b(c)};return"string"!=typeof a&&(c=b,b=a,a=void 0),b&&a!==!1&&this.queue(a||"fx",[]),this.each(function(){var b=!0,e=null!=a&&a+"queueHooks",f=r.timers,g=W.get(this);if(e)g[e]&&g[e].stop&&d(g[e]);else for(e in g)g[e]&&g[e].stop&&db.test(e)&&d(g[e]);for(e=f.length;e--;)f[e].elem!==this||null!=a&&f[e].queue!==a||(f[e].anim.stop(c),b=!1,f.splice(e,1));!b&&c||r.dequeue(this,a)})},finish:function(a){return a!==!1&&(a=a||"fx"),this.each(function(){var b,c=W.get(this),d=c[a+"queue"],e=c[a+"queueHooks"],f=r.timers,g=d?d.length:0;for(c.finish=!0,r.queue(this,a,[]),e&&e.stop&&e.stop.call(this,!0),b=f.length;b--;)f[b].elem===this&&f[b].queue===a&&(f[b].anim.stop(!0),f.splice(b,1));for(b=0;b<g;b++)d[b]&&d[b].finish&&d[b].finish.call(this);delete c.finish})}}),r.each(["toggle","show","hide"],function(a,b){var c=r.fn[b];r.fn[b]=function(a,d,e){return null==a||"boolean"==typeof a?c.apply(this,arguments):this.animate(gb(b,!0),a,d,e)}}),r.each({slideDown:gb("show"),slideUp:gb("hide"),slideToggle:gb("toggle"),fadeIn:{opacity:"show"},fadeOut:{opacity:"hide"},fadeToggle:{opacity:"toggle"}},function(a,b){r.fn[a]=function(a,c,d){return this.animate(b,a,c,d)}}),r.timers=[],r.fx.tick=function(){var a,b=0,c=r.timers;for(ab=r.now();b<c.length;b++)a=c[b],a()||c[b]!==a||c.splice(b--,1);c.length||r.fx.stop(),ab=void 0},r.fx.timer=function(a){r.timers.push(a),r.fx.start()},r.fx.interval=13,r.fx.start=function(){bb||(bb=!0,eb())},r.fx.stop=function(){bb=null},r.fx.speeds={slow:600,fast:200,_default:400},r.fn.delay=function(b,c){return b=r.fx?r.fx.speeds[b]||b:b,c=c||"fx",this.queue(c,function(c,d){var e=a.setTimeout(c,b);d.stop=function(){a.clearTimeout(e)}})},function(){var a=d.createElement("input"),b=d.createElement("select"),c=b.appendChild(d.createElement("option"));a.type="checkbox",o.checkOn=""!==a.value,o.optSelected=c.selected,a=d.createElement("input"),a.value="t",a.type="radio",o.radioValue="t"===a.value}();var lb,mb=r.expr.attrHandle;r.fn.extend({attr:function(a,b){return T(this,r.attr,a,b,arguments.length>1)},removeAttr:function(a){return this.each(function(){r.removeAttr(this,a)})}}),r.extend({attr:function(a,b,c){var d,e,f=a.nodeType;if(3!==f&&8!==f&&2!==f)return"undefined"==typeof a.getAttribute?r.prop(a,b,c):(1===f&&r.isXMLDoc(a)||(e=r.attrHooks[b.toLowerCase()]||(r.expr.match.bool.test(b)?lb:void 0)),void 0!==c?null===c?void r.removeAttr(a,b):e&&"set"in e&&void 0!==(d=e.set(a,c,b))?d:(a.setAttribute(b,c+""),c):e&&"get"in e&&null!==(d=e.get(a,b))?d:(d=r.find.attr(a,b), 4 - null==d?void 0:d))},attrHooks:{type:{set:function(a,b){if(!o.radioValue&&"radio"===b&&B(a,"input")){var c=a.value;return a.setAttribute("type",b),c&&(a.value=c),b}}}},removeAttr:function(a,b){var c,d=0,e=b&&b.match(L);if(e&&1===a.nodeType)while(c=e[d++])a.removeAttribute(c)}}),lb={set:function(a,b,c){return b===!1?r.removeAttr(a,c):a.setAttribute(c,c),c}},r.each(r.expr.match.bool.source.match(/\w+/g),function(a,b){var c=mb[b]||r.find.attr;mb[b]=function(a,b,d){var e,f,g=b.toLowerCase();return d||(f=mb[g],mb[g]=e,e=null!=c(a,b,d)?g:null,mb[g]=f),e}});var nb=/^(?:input|select|textarea|button)$/i,ob=/^(?:a|area)$/i;r.fn.extend({prop:function(a,b){return T(this,r.prop,a,b,arguments.length>1)},removeProp:function(a){return this.each(function(){delete this[r.propFix[a]||a]})}}),r.extend({prop:function(a,b,c){var d,e,f=a.nodeType;if(3!==f&&8!==f&&2!==f)return 1===f&&r.isXMLDoc(a)||(b=r.propFix[b]||b,e=r.propHooks[b]),void 0!==c?e&&"set"in e&&void 0!==(d=e.set(a,c,b))?d:a[b]=c:e&&"get"in e&&null!==(d=e.get(a,b))?d:a[b]},propHooks:{tabIndex:{get:function(a){var b=r.find.attr(a,"tabindex");return b?parseInt(b,10):nb.test(a.nodeName)||ob.test(a.nodeName)&&a.href?0:-1}}},propFix:{"for":"htmlFor","class":"className"}}),o.optSelected||(r.propHooks.selected={get:function(a){var b=a.parentNode;return b&&b.parentNode&&b.parentNode.selectedIndex,null},set:function(a){var b=a.parentNode;b&&(b.selectedIndex,b.parentNode&&b.parentNode.selectedIndex)}}),r.each(["tabIndex","readOnly","maxLength","cellSpacing","cellPadding","rowSpan","colSpan","useMap","frameBorder","contentEditable"],function(){r.propFix[this.toLowerCase()]=this});function pb(a){var b=a.match(L)||[];return b.join(" ")}function qb(a){return a.getAttribute&&a.getAttribute("class")||""}r.fn.extend({addClass:function(a){var b,c,d,e,f,g,h,i=0;if(r.isFunction(a))return this.each(function(b){r(this).addClass(a.call(this,b,qb(this)))});if("string"==typeof a&&a){b=a.match(L)||[];while(c=this[i++])if(e=qb(c),d=1===c.nodeType&&" "+pb(e)+" "){g=0;while(f=b[g++])d.indexOf(" "+f+" ")<0&&(d+=f+" ");h=pb(d),e!==h&&c.setAttribute("class",h)}}return this},removeClass:function(a){var b,c,d,e,f,g,h,i=0;if(r.isFunction(a))return this.each(function(b){r(this).removeClass(a.call(this,b,qb(this)))});if(!arguments.length)return this.attr("class","");if("string"==typeof a&&a){b=a.match(L)||[];while(c=this[i++])if(e=qb(c),d=1===c.nodeType&&" "+pb(e)+" "){g=0;while(f=b[g++])while(d.indexOf(" "+f+" ")>-1)d=d.replace(" "+f+" "," ");h=pb(d),e!==h&&c.setAttribute("class",h)}}return this},toggleClass:function(a,b){var c=typeof a;return"boolean"==typeof b&&"string"===c?b?this.addClass(a):this.removeClass(a):r.isFunction(a)?this.each(function(c){r(this).toggleClass(a.call(this,c,qb(this),b),b)}):this.each(function(){var b,d,e,f;if("string"===c){d=0,e=r(this),f=a.match(L)||[];while(b=f[d++])e.hasClass(b)?e.removeClass(b):e.addClass(b)}else void 0!==a&&"boolean"!==c||(b=qb(this),b&&W.set(this,"__className__",b),this.setAttribute&&this.setAttribute("class",b||a===!1?"":W.get(this,"__className__")||""))})},hasClass:function(a){var b,c,d=0;b=" "+a+" ";while(c=this[d++])if(1===c.nodeType&&(" "+pb(qb(c))+" ").indexOf(b)>-1)return!0;return!1}});var rb=/\r/g;r.fn.extend({val:function(a){var b,c,d,e=this[0];{if(arguments.length)return d=r.isFunction(a),this.each(function(c){var e;1===this.nodeType&&(e=d?a.call(this,c,r(this).val()):a,null==e?e="":"number"==typeof e?e+="":Array.isArray(e)&&(e=r.map(e,function(a){return null==a?"":a+""})),b=r.valHooks[this.type]||r.valHooks[this.nodeName.toLowerCase()],b&&"set"in b&&void 0!==b.set(this,e,"value")||(this.value=e))});if(e)return b=r.valHooks[e.type]||r.valHooks[e.nodeName.toLowerCase()],b&&"get"in b&&void 0!==(c=b.get(e,"value"))?c:(c=e.value,"string"==typeof c?c.replace(rb,""):null==c?"":c)}}}),r.extend({valHooks:{option:{get:function(a){var b=r.find.attr(a,"value");return null!=b?b:pb(r.text(a))}},select:{get:function(a){var b,c,d,e=a.options,f=a.selectedIndex,g="select-one"===a.type,h=g?null:[],i=g?f+1:e.length;for(d=f<0?i:g?f:0;d<i;d++)if(c=e[d],(c.selected||d===f)&&!c.disabled&&(!c.parentNode.disabled||!B(c.parentNode,"optgroup"))){if(b=r(c).val(),g)return b;h.push(b)}return h},set:function(a,b){var c,d,e=a.options,f=r.makeArray(b),g=e.length;while(g--)d=e[g],(d.selected=r.inArray(r.valHooks.option.get(d),f)>-1)&&(c=!0);return c||(a.selectedIndex=-1),f}}}}),r.each(["radio","checkbox"],function(){r.valHooks[this]={set:function(a,b){if(Array.isArray(b))return a.checked=r.inArray(r(a).val(),b)>-1}},o.checkOn||(r.valHooks[this].get=function(a){return null===a.getAttribute("value")?"on":a.value})});var sb=/^(?:focusinfocus|focusoutblur)$/;r.extend(r.event,{trigger:function(b,c,e,f){var g,h,i,j,k,m,n,o=[e||d],p=l.call(b,"type")?b.type:b,q=l.call(b,"namespace")?b.namespace.split("."):[];if(h=i=e=e||d,3!==e.nodeType&&8!==e.nodeType&&!sb.test(p+r.event.triggered)&&(p.indexOf(".")>-1&&(q=p.split("."),p=q.shift(),q.sort()),k=p.indexOf(":")<0&&"on"+p,b=b[r.expando]?b:new r.Event(p,"object"==typeof b&&b),b.isTrigger=f?2:3,b.namespace=q.join("."),b.rnamespace=b.namespace?new RegExp("(^|\\.)"+q.join("\\.(?:.*\\.|)")+"(\\.|$)"):null,b.result=void 0,b.target||(b.target=e),c=null==c?[b]:r.makeArray(c,[b]),n=r.event.special[p]||{},f||!n.trigger||n.trigger.apply(e,c)!==!1)){if(!f&&!n.noBubble&&!r.isWindow(e)){for(j=n.delegateType||p,sb.test(j+p)||(h=h.parentNode);h;h=h.parentNode)o.push(h),i=h;i===(e.ownerDocument||d)&&o.push(i.defaultView||i.parentWindow||a)}g=0;while((h=o[g++])&&!b.isPropagationStopped())b.type=g>1?j:n.bindType||p,m=(W.get(h,"events")||{})[b.type]&&W.get(h,"handle"),m&&m.apply(h,c),m=k&&h[k],m&&m.apply&&U(h)&&(b.result=m.apply(h,c),b.result===!1&&b.preventDefault());return b.type=p,f||b.isDefaultPrevented()||n._default&&n._default.apply(o.pop(),c)!==!1||!U(e)||k&&r.isFunction(e[p])&&!r.isWindow(e)&&(i=e[k],i&&(e[k]=null),r.event.triggered=p,e[p](),r.event.triggered=void 0,i&&(e[k]=i)),b.result}},simulate:function(a,b,c){var d=r.extend(new r.Event,c,{type:a,isSimulated:!0});r.event.trigger(d,null,b)}}),r.fn.extend({trigger:function(a,b){return this.each(function(){r.event.trigger(a,b,this)})},triggerHandler:function(a,b){var c=this[0];if(c)return r.event.trigger(a,b,c,!0)}}),r.each("blur focus focusin focusout resize scroll click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup contextmenu".split(" "),function(a,b){r.fn[b]=function(a,c){return arguments.length>0?this.on(b,null,a,c):this.trigger(b)}}),r.fn.extend({hover:function(a,b){return this.mouseenter(a).mouseleave(b||a)}}),o.focusin="onfocusin"in a,o.focusin||r.each({focus:"focusin",blur:"focusout"},function(a,b){var c=function(a){r.event.simulate(b,a.target,r.event.fix(a))};r.event.special[b]={setup:function(){var d=this.ownerDocument||this,e=W.access(d,b);e||d.addEventListener(a,c,!0),W.access(d,b,(e||0)+1)},teardown:function(){var d=this.ownerDocument||this,e=W.access(d,b)-1;e?W.access(d,b,e):(d.removeEventListener(a,c,!0),W.remove(d,b))}}});var tb=a.location,ub=r.now(),vb=/\?/;r.parseXML=function(b){var c;if(!b||"string"!=typeof b)return null;try{c=(new a.DOMParser).parseFromString(b,"text/xml")}catch(d){c=void 0}return c&&!c.getElementsByTagName("parsererror").length||r.error("Invalid XML: "+b),c};var wb=/\[\]$/,xb=/\r?\n/g,yb=/^(?:submit|button|image|reset|file)$/i,zb=/^(?:input|select|textarea|keygen)/i;function Ab(a,b,c,d){var e;if(Array.isArray(b))r.each(b,function(b,e){c||wb.test(a)?d(a,e):Ab(a+"["+("object"==typeof e&&null!=e?b:"")+"]",e,c,d)});else if(c||"object"!==r.type(b))d(a,b);else for(e in b)Ab(a+"["+e+"]",b[e],c,d)}r.param=function(a,b){var c,d=[],e=function(a,b){var c=r.isFunction(b)?b():b;d[d.length]=encodeURIComponent(a)+"="+encodeURIComponent(null==c?"":c)};if(Array.isArray(a)||a.jquery&&!r.isPlainObject(a))r.each(a,function(){e(this.name,this.value)});else for(c in a)Ab(c,a[c],b,e);return d.join("&")},r.fn.extend({serialize:function(){return r.param(this.serializeArray())},serializeArray:function(){return this.map(function(){var a=r.prop(this,"elements");return a?r.makeArray(a):this}).filter(function(){var a=this.type;return this.name&&!r(this).is(":disabled")&&zb.test(this.nodeName)&&!yb.test(a)&&(this.checked||!ja.test(a))}).map(function(a,b){var c=r(this).val();return null==c?null:Array.isArray(c)?r.map(c,function(a){return{name:b.name,value:a.replace(xb,"\r\n")}}):{name:b.name,value:c.replace(xb,"\r\n")}}).get()}});var Bb=/%20/g,Cb=/#.*$/,Db=/([?&])_=[^&]*/,Eb=/^(.*?):[ \t]*([^\r\n]*)$/gm,Fb=/^(?:about|app|app-storage|.+-extension|file|res|widget):$/,Gb=/^(?:GET|HEAD)$/,Hb=/^\/\//,Ib={},Jb={},Kb="*/".concat("*"),Lb=d.createElement("a");Lb.href=tb.href;function Mb(a){return function(b,c){"string"!=typeof b&&(c=b,b="*");var d,e=0,f=b.toLowerCase().match(L)||[];if(r.isFunction(c))while(d=f[e++])"+"===d[0]?(d=d.slice(1)||"*",(a[d]=a[d]||[]).unshift(c)):(a[d]=a[d]||[]).push(c)}}function Nb(a,b,c,d){var e={},f=a===Jb;function g(h){var i;return e[h]=!0,r.each(a[h]||[],function(a,h){var j=h(b,c,d);return"string"!=typeof j||f||e[j]?f?!(i=j):void 0:(b.dataTypes.unshift(j),g(j),!1)}),i}return g(b.dataTypes[0])||!e["*"]&&g("*")}function Ob(a,b){var c,d,e=r.ajaxSettings.flatOptions||{};for(c in b)void 0!==b[c]&&((e[c]?a:d||(d={}))[c]=b[c]);return d&&r.extend(!0,a,d),a}function Pb(a,b,c){var d,e,f,g,h=a.contents,i=a.dataTypes;while("*"===i[0])i.shift(),void 0===d&&(d=a.mimeType||b.getResponseHeader("Content-Type"));if(d)for(e in h)if(h[e]&&h[e].test(d)){i.unshift(e);break}if(i[0]in c)f=i[0];else{for(e in c){if(!i[0]||a.converters[e+" "+i[0]]){f=e;break}g||(g=e)}f=f||g}if(f)return f!==i[0]&&i.unshift(f),c[f]}function Qb(a,b,c,d){var e,f,g,h,i,j={},k=a.dataTypes.slice();if(k[1])for(g in a.converters)j[g.toLowerCase()]=a.converters[g];f=k.shift();while(f)if(a.responseFields[f]&&(c[a.responseFields[f]]=b),!i&&d&&a.dataFilter&&(b=a.dataFilter(b,a.dataType)),i=f,f=k.shift())if("*"===f)f=i;else if("*"!==i&&i!==f){if(g=j[i+" "+f]||j["* "+f],!g)for(e in j)if(h=e.split(" "),h[1]===f&&(g=j[i+" "+h[0]]||j["* "+h[0]])){g===!0?g=j[e]:j[e]!==!0&&(f=h[0],k.unshift(h[1]));break}if(g!==!0)if(g&&a["throws"])b=g(b);else try{b=g(b)}catch(l){return{state:"parsererror",error:g?l:"No conversion from "+i+" to "+f}}}return{state:"success",data:b}}r.extend({active:0,lastModified:{},etag:{},ajaxSettings:{url:tb.href,type:"GET",isLocal:Fb.test(tb.protocol),global:!0,processData:!0,async:!0,contentType:"application/x-www-form-urlencoded; charset=UTF-8",accepts:{"*":Kb,text:"text/plain",html:"text/html",xml:"application/xml, text/xml",json:"application/json, text/javascript"},contents:{xml:/\bxml\b/,html:/\bhtml/,json:/\bjson\b/},responseFields:{xml:"responseXML",text:"responseText",json:"responseJSON"},converters:{"* text":String,"text html":!0,"text json":JSON.parse,"text xml":r.parseXML},flatOptions:{url:!0,context:!0}},ajaxSetup:function(a,b){return b?Ob(Ob(a,r.ajaxSettings),b):Ob(r.ajaxSettings,a)},ajaxPrefilter:Mb(Ib),ajaxTransport:Mb(Jb),ajax:function(b,c){"object"==typeof b&&(c=b,b=void 0),c=c||{};var e,f,g,h,i,j,k,l,m,n,o=r.ajaxSetup({},c),p=o.context||o,q=o.context&&(p.nodeType||p.jquery)?r(p):r.event,s=r.Deferred(),t=r.Callbacks("once memory"),u=o.statusCode||{},v={},w={},x="canceled",y={readyState:0,getResponseHeader:function(a){var b;if(k){if(!h){h={};while(b=Eb.exec(g))h[b[1].toLowerCase()]=b[2]}b=h[a.toLowerCase()]}return null==b?null:b},getAllResponseHeaders:function(){return k?g:null},setRequestHeader:function(a,b){return null==k&&(a=w[a.toLowerCase()]=w[a.toLowerCase()]||a,v[a]=b),this},overrideMimeType:function(a){return null==k&&(o.mimeType=a),this},statusCode:function(a){var b;if(a)if(k)y.always(a[y.status]);else for(b in a)u[b]=[u[b],a[b]];return this},abort:function(a){var b=a||x;return e&&e.abort(b),A(0,b),this}};if(s.promise(y),o.url=((b||o.url||tb.href)+"").replace(Hb,tb.protocol+"//"),o.type=c.method||c.type||o.method||o.type,o.dataTypes=(o.dataType||"*").toLowerCase().match(L)||[""],null==o.crossDomain){j=d.createElement("a");try{j.href=o.url,j.href=j.href,o.crossDomain=Lb.protocol+"//"+Lb.host!=j.protocol+"//"+j.host}catch(z){o.crossDomain=!0}}if(o.data&&o.processData&&"string"!=typeof o.data&&(o.data=r.param(o.data,o.traditional)),Nb(Ib,o,c,y),k)return y;l=r.event&&o.global,l&&0===r.active++&&r.event.trigger("ajaxStart"),o.type=o.type.toUpperCase(),o.hasContent=!Gb.test(o.type),f=o.url.replace(Cb,""),o.hasContent?o.data&&o.processData&&0===(o.contentType||"").indexOf("application/x-www-form-urlencoded")&&(o.data=o.data.replace(Bb,"+")):(n=o.url.slice(f.length),o.data&&(f+=(vb.test(f)?"&":"?")+o.data,delete o.data),o.cache===!1&&(f=f.replace(Db,"$1"),n=(vb.test(f)?"&":"?")+"_="+ub++ +n),o.url=f+n),o.ifModified&&(r.lastModified[f]&&y.setRequestHeader("If-Modified-Since",r.lastModified[f]),r.etag[f]&&y.setRequestHeader("If-None-Match",r.etag[f])),(o.data&&o.hasContent&&o.contentType!==!1||c.contentType)&&y.setRequestHeader("Content-Type",o.contentType),y.setRequestHeader("Accept",o.dataTypes[0]&&o.accepts[o.dataTypes[0]]?o.accepts[o.dataTypes[0]]+("*"!==o.dataTypes[0]?", "+Kb+"; q=0.01":""):o.accepts["*"]);for(m in o.headers)y.setRequestHeader(m,o.headers[m]);if(o.beforeSend&&(o.beforeSend.call(p,y,o)===!1||k))return y.abort();if(x="abort",t.add(o.complete),y.done(o.success),y.fail(o.error),e=Nb(Jb,o,c,y)){if(y.readyState=1,l&&q.trigger("ajaxSend",[y,o]),k)return y;o.async&&o.timeout>0&&(i=a.setTimeout(function(){y.abort("timeout")},o.timeout));try{k=!1,e.send(v,A)}catch(z){if(k)throw z;A(-1,z)}}else A(-1,"No Transport");function A(b,c,d,h){var j,m,n,v,w,x=c;k||(k=!0,i&&a.clearTimeout(i),e=void 0,g=h||"",y.readyState=b>0?4:0,j=b>=200&&b<300||304===b,d&&(v=Pb(o,y,d)),v=Qb(o,v,y,j),j?(o.ifModified&&(w=y.getResponseHeader("Last-Modified"),w&&(r.lastModified[f]=w),w=y.getResponseHeader("etag"),w&&(r.etag[f]=w)),204===b||"HEAD"===o.type?x="nocontent":304===b?x="notmodified":(x=v.state,m=v.data,n=v.error,j=!n)):(n=x,!b&&x||(x="error",b<0&&(b=0))),y.status=b,y.statusText=(c||x)+"",j?s.resolveWith(p,[m,x,y]):s.rejectWith(p,[y,x,n]),y.statusCode(u),u=void 0,l&&q.trigger(j?"ajaxSuccess":"ajaxError",[y,o,j?m:n]),t.fireWith(p,[y,x]),l&&(q.trigger("ajaxComplete",[y,o]),--r.active||r.event.trigger("ajaxStop")))}return y},getJSON:function(a,b,c){return r.get(a,b,c,"json")},getScript:function(a,b){return r.get(a,void 0,b,"script")}}),r.each(["get","post"],function(a,b){r[b]=function(a,c,d,e){return r.isFunction(c)&&(e=e||d,d=c,c=void 0),r.ajax(r.extend({url:a,type:b,dataType:e,data:c,success:d},r.isPlainObject(a)&&a))}}),r._evalUrl=function(a){return r.ajax({url:a,type:"GET",dataType:"script",cache:!0,async:!1,global:!1,"throws":!0})},r.fn.extend({wrapAll:function(a){var b;return this[0]&&(r.isFunction(a)&&(a=a.call(this[0])),b=r(a,this[0].ownerDocument).eq(0).clone(!0),this[0].parentNode&&b.insertBefore(this[0]),b.map(function(){var a=this;while(a.firstElementChild)a=a.firstElementChild;return a}).append(this)),this},wrapInner:function(a){return r.isFunction(a)?this.each(function(b){r(this).wrapInner(a.call(this,b))}):this.each(function(){var b=r(this),c=b.contents();c.length?c.wrapAll(a):b.append(a)})},wrap:function(a){var b=r.isFunction(a);return this.each(function(c){r(this).wrapAll(b?a.call(this,c):a)})},unwrap:function(a){return this.parent(a).not("body").each(function(){r(this).replaceWith(this.childNodes)}),this}}),r.expr.pseudos.hidden=function(a){return!r.expr.pseudos.visible(a)},r.expr.pseudos.visible=function(a){return!!(a.offsetWidth||a.offsetHeight||a.getClientRects().length)},r.ajaxSettings.xhr=function(){try{return new a.XMLHttpRequest}catch(b){}};var Rb={0:200,1223:204},Sb=r.ajaxSettings.xhr();o.cors=!!Sb&&"withCredentials"in Sb,o.ajax=Sb=!!Sb,r.ajaxTransport(function(b){var c,d;if(o.cors||Sb&&!b.crossDomain)return{send:function(e,f){var g,h=b.xhr();if(h.open(b.type,b.url,b.async,b.username,b.password),b.xhrFields)for(g in b.xhrFields)h[g]=b.xhrFields[g];b.mimeType&&h.overrideMimeType&&h.overrideMimeType(b.mimeType),b.crossDomain||e["X-Requested-With"]||(e["X-Requested-With"]="XMLHttpRequest");for(g in e)h.setRequestHeader(g,e[g]);c=function(a){return function(){c&&(c=d=h.onload=h.onerror=h.onabort=h.onreadystatechange=null,"abort"===a?h.abort():"error"===a?"number"!=typeof h.status?f(0,"error"):f(h.status,h.statusText):f(Rb[h.status]||h.status,h.statusText,"text"!==(h.responseType||"text")||"string"!=typeof h.responseText?{binary:h.response}:{text:h.responseText},h.getAllResponseHeaders()))}},h.onload=c(),d=h.onerror=c("error"),void 0!==h.onabort?h.onabort=d:h.onreadystatechange=function(){4===h.readyState&&a.setTimeout(function(){c&&d()})},c=c("abort");try{h.send(b.hasContent&&b.data||null)}catch(i){if(c)throw i}},abort:function(){c&&c()}}}),r.ajaxPrefilter(function(a){a.crossDomain&&(a.contents.script=!1)}),r.ajaxSetup({accepts:{script:"text/javascript, application/javascript, application/ecmascript, application/x-ecmascript"},contents:{script:/\b(?:java|ecma)script\b/},converters:{"text script":function(a){return r.globalEval(a),a}}}),r.ajaxPrefilter("script",function(a){void 0===a.cache&&(a.cache=!1),a.crossDomain&&(a.type="GET")}),r.ajaxTransport("script",function(a){if(a.crossDomain){var b,c;return{send:function(e,f){b=r("<script>").prop({charset:a.scriptCharset,src:a.url}).on("load error",c=function(a){b.remove(),c=null,a&&f("error"===a.type?404:200,a.type)}),d.head.appendChild(b[0])},abort:function(){c&&c()}}}});var Tb=[],Ub=/(=)\?(?=&|$)|\?\?/;r.ajaxSetup({jsonp:"callback",jsonpCallback:function(){var a=Tb.pop()||r.expando+"_"+ub++;return this[a]=!0,a}}),r.ajaxPrefilter("json jsonp",function(b,c,d){var e,f,g,h=b.jsonp!==!1&&(Ub.test(b.url)?"url":"string"==typeof b.data&&0===(b.contentType||"").indexOf("application/x-www-form-urlencoded")&&Ub.test(b.data)&&"data");if(h||"jsonp"===b.dataTypes[0])return e=b.jsonpCallback=r.isFunction(b.jsonpCallback)?b.jsonpCallback():b.jsonpCallback,h?b[h]=b[h].replace(Ub,"$1"+e):b.jsonp!==!1&&(b.url+=(vb.test(b.url)?"&":"?")+b.jsonp+"="+e),b.converters["script json"]=function(){return g||r.error(e+" was not called"),g[0]},b.dataTypes[0]="json",f=a[e],a[e]=function(){g=arguments},d.always(function(){void 0===f?r(a).removeProp(e):a[e]=f,b[e]&&(b.jsonpCallback=c.jsonpCallback,Tb.push(e)),g&&r.isFunction(f)&&f(g[0]),g=f=void 0}),"script"}),o.createHTMLDocument=function(){var a=d.implementation.createHTMLDocument("").body;return a.innerHTML="<form></form><form></form>",2===a.childNodes.length}(),r.parseHTML=function(a,b,c){if("string"!=typeof a)return[];"boolean"==typeof b&&(c=b,b=!1);var e,f,g;return b||(o.createHTMLDocument?(b=d.implementation.createHTMLDocument(""),e=b.createElement("base"),e.href=d.location.href,b.head.appendChild(e)):b=d),f=C.exec(a),g=!c&&[],f?[b.createElement(f[1])]:(f=qa([a],b,g),g&&g.length&&r(g).remove(),r.merge([],f.childNodes))},r.fn.load=function(a,b,c){var d,e,f,g=this,h=a.indexOf(" ");return h>-1&&(d=pb(a.slice(h)),a=a.slice(0,h)),r.isFunction(b)?(c=b,b=void 0):b&&"object"==typeof b&&(e="POST"),g.length>0&&r.ajax({url:a,type:e||"GET",dataType:"html",data:b}).done(function(a){f=arguments,g.html(d?r("<div>").append(r.parseHTML(a)).find(d):a)}).always(c&&function(a,b){g.each(function(){c.apply(this,f||[a.responseText,b,a])})}),this},r.each(["ajaxStart","ajaxStop","ajaxComplete","ajaxError","ajaxSuccess","ajaxSend"],function(a,b){r.fn[b]=function(a){return this.on(b,a)}}),r.expr.pseudos.animated=function(a){return r.grep(r.timers,function(b){return a===b.elem}).length},r.offset={setOffset:function(a,b,c){var d,e,f,g,h,i,j,k=r.css(a,"position"),l=r(a),m={};"static"===k&&(a.style.position="relative"),h=l.offset(),f=r.css(a,"top"),i=r.css(a,"left"),j=("absolute"===k||"fixed"===k)&&(f+i).indexOf("auto")>-1,j?(d=l.position(),g=d.top,e=d.left):(g=parseFloat(f)||0,e=parseFloat(i)||0),r.isFunction(b)&&(b=b.call(a,c,r.extend({},h))),null!=b.top&&(m.top=b.top-h.top+g),null!=b.left&&(m.left=b.left-h.left+e),"using"in b?b.using.call(a,m):l.css(m)}},r.fn.extend({offset:function(a){if(arguments.length)return void 0===a?this:this.each(function(b){r.offset.setOffset(this,a,b)});var b,c,d,e,f=this[0];if(f)return f.getClientRects().length?(d=f.getBoundingClientRect(),b=f.ownerDocument,c=b.documentElement,e=b.defaultView,{top:d.top+e.pageYOffset-c.clientTop,left:d.left+e.pageXOffset-c.clientLeft}):{top:0,left:0}},position:function(){if(this[0]){var a,b,c=this[0],d={top:0,left:0};return"fixed"===r.css(c,"position")?b=c.getBoundingClientRect():(a=this.offsetParent(),b=this.offset(),B(a[0],"html")||(d=a.offset()),d={top:d.top+r.css(a[0],"borderTopWidth",!0),left:d.left+r.css(a[0],"borderLeftWidth",!0)}),{top:b.top-d.top-r.css(c,"marginTop",!0),left:b.left-d.left-r.css(c,"marginLeft",!0)}}},offsetParent:function(){return this.map(function(){var a=this.offsetParent;while(a&&"static"===r.css(a,"position"))a=a.offsetParent;return a||ra})}}),r.each({scrollLeft:"pageXOffset",scrollTop:"pageYOffset"},function(a,b){var c="pageYOffset"===b;r.fn[a]=function(d){return T(this,function(a,d,e){var f;return r.isWindow(a)?f=a:9===a.nodeType&&(f=a.defaultView),void 0===e?f?f[b]:a[d]:void(f?f.scrollTo(c?f.pageXOffset:e,c?e:f.pageYOffset):a[d]=e)},a,d,arguments.length)}}),r.each(["top","left"],function(a,b){r.cssHooks[b]=Pa(o.pixelPosition,function(a,c){if(c)return c=Oa(a,b),Ma.test(c)?r(a).position()[b]+"px":c})}),r.each({Height:"height",Width:"width"},function(a,b){r.each({padding:"inner"+a,content:b,"":"outer"+a},function(c,d){r.fn[d]=function(e,f){var g=arguments.length&&(c||"boolean"!=typeof e),h=c||(e===!0||f===!0?"margin":"border");return T(this,function(b,c,e){var f;return r.isWindow(b)?0===d.indexOf("outer")?b["inner"+a]:b.document.documentElement["client"+a]:9===b.nodeType?(f=b.documentElement,Math.max(b.body["scroll"+a],f["scroll"+a],b.body["offset"+a],f["offset"+a],f["client"+a])):void 0===e?r.css(b,c,h):r.style(b,c,e,h)},b,g?e:void 0,g)}})}),r.fn.extend({bind:function(a,b,c){return this.on(a,null,b,c)},unbind:function(a,b){return this.off(a,null,b)},delegate:function(a,b,c,d){return this.on(b,a,c,d)},undelegate:function(a,b,c){return 1===arguments.length?this.off(a,"**"):this.off(b,a||"**",c)}}),r.holdReady=function(a){a?r.readyWait++:r.ready(!0)},r.isArray=Array.isArray,r.parseJSON=JSON.parse,r.nodeName=B,"function"==typeof define&&define.amd&&define("jquery",[],function(){return r});var Vb=a.jQuery,Wb=a.$;return r.noConflict=function(b){return a.$===r&&(a.$=Wb),b&&a.jQuery===r&&(a.jQuery=Vb),r},b||(a.jQuery=a.$=r),r});
+2 -2
src/manifest.json
··· 6 6 { 7 7 "sizes": "800x800", 8 8 "type": "image/png", 9 - "src": "https://cdn.glitch.global/2bc3df24-5bca-426a-9445-f1f6dbdd528e/make8bitart-800.png", 9 + "src": "/assets/make8bitart-800.png", 10 10 "purpose": "any" 11 11 }, 12 12 { 13 13 "sizes": "180x180", 14 14 "type": "image/png", 15 - "src": "https://cdn.glitch.global/2bc3df24-5bca-426a-9445-f1f6dbdd528e/make8bitart-180.png", 15 + "src": "/assets/make8bitart-180.png", 16 16 "purpose": "maskable" 17 17 } 18 18 ],
+2 -3
src/service-worker.js
··· 15 15 "/index.html", 16 16 "/app.min.js", 17 17 "/make8bitart.min.css", 18 - "/draggybits.min.css", 19 18 "/assets/bg.png", 20 19 "/assets/brighton.png", 21 20 "/assets/hsl-palette.png", 22 21 "/assets/example.csv", 23 - "/assets/draggybits/dragger.png", 24 - "/assets/draggybits/hider.png", 22 + "/assets/draggydivs/dragger.png", 23 + "/assets/draggydivs/hider.png", 25 24 "/assets/icons/copy.png", 26 25 "/assets/icons/cut.png", 27 26 "/assets/icons/dropper.png",