1<!DOCTYPE html> 2<html> 3<head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1"> 6 <!-- Cloudflare Web Analytics -->
vendor: 99 bytes, line 6
6<script defer src='https://static.cloudflareinsights.com/beacon.min.js' data-cf-beacon='{"token": "
6ba6256a2038e4c9ea699415b28a2596f
vendor: 13 bytes, line 6
6"}'></script>
6<!-- End Cloudflare Web Analytics --> 7 <!-- Google tag (gtag.js) -->
vendor: 66 bytes, lines 7-8
7 8 <script async src="https://www.googletagmanager.com/gtag/js?id=
8G-CSP40BPMWE
vendor: 14 bytes, lines 8-9
8"></script> 9
9<script> 10
vendor: 140 bytes, lines 10-14
10window.dataLayer = window.dataLayer || []; 11 function gtag(){dataLayer.push(arguments);} 12 gtag('js', new Date()); 13 14 gtag('config', '
14G-CSP40BPMWE
vendor: 6 bytes, lines 14-15
14'); 15
15</script>
15 16 <link href="css/style.css?ts=0.5.0" rel="stylesheet" type="text/css"> 17 <link href="css/spin.css" rel="stylesheet" type="text/css"> 18 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" 19 integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 20 <!-- <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">--> 21 22 <style> 23 24 25 </style> 26 <title>chibi-deco-3-3 0.5.0 åãæ¢ãããªãªã¼ã¹</title> 27
27<script> 28 var test_PMA_base = true; 29 var test_PMA_Texture = false; 30 var test_PMA_glstore = true; 31 32 </script>
32 33
33<script src="js/pixi.js?ts=0.5.0"></script>
33 34 35
35<script src="js2/pixi-spine-3.5-6.js?ts=0.1.25.0"></script>
35 36 37
37<script src="js2/skb3.3-6.js?ts=0.1.25.0"></script>
37 38
38<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/pixi-filters.js" 39 integrity="sha256-glKKYYqZKNetXzDxJX+1rWdQw6ou/JBBXRWj2I1nNew=" crossorigin="anonymous"></script>
39 40 41 <!--
41<script src="js/pixi-spine-sjzs.js?ts=0.5.0"></script>
41<!– 1.0.10 –>--> 42 <!--
42<script src="js/pixi-filters-v2.7.1.js"></script>
42--> 43 44 <!--
44<script src="js/skb.js"></script>
44--> 45
45<script src="js/TDoll.js"></script>
45 46
46<script src="js/gif.js"></script>
46 47
47<script src="js/FileSaver.js"></script>
47 48
48<script src="js/apngbuilder.js"></script>
48 49 50 51
51<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
51 52 <!--
52<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
52--> 53 <!--
53<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
53--> 54
54<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" 55 integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" 56 crossorigin="anonymous"></script>
56 57 58
58<script src="js/spin.js"></script>
58 59
59<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.2.2/jszip.min.js"></script>
59 60
60<script src="js/w3.js"></script>
60 61
61<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/maxrects-packer.js" 62 integrity="sha256-zVqnNM0DoD4i+y7zwb6RmSv1YoyrXev4VNvhg6sbMGk=" crossorigin="anonymous"></script>
62 63 64</head> 65<body> 66 67 68<div id="main" style="text-align: center;"> 69 <h3> 70 (chibi-deco-3 sp m opts) ; 0.5.0 71 åãæ¢ãããªãªã¼ã¹ 72<!-- !!!!!!! TEST TEST TEST !!!!!!!!!!!!!!--> 73 </h3> 74 75 <div style="text-align: center;display: inline-block;font-size:70%;"> 76 <div>NOTICE ãç¥ãã</div> 77 <div style=""> 78 Do not ask me how to get Spine data. Spineãã¼ã¿ã®åå¾ã«é¢ãã¦ã®ãååããã¯æ¿ãã¾ããã<br/> 79 <b>This website is made for personal hobby use. This website are provided 'as is' 80 and your use of this website is entirely at your own risk. <br/> 81 æ¬ã¦ã§ããµã¤ãã¯å人ã®ããã¼ç¨ã§ãããä½ãä¿è¨¼ã§ãã¾ãããæ¬ã¦ã§ããµã¤ãã®å©ç¨ã«èµ·å ãããããããªãå¦ä½ãªãæå®³ãä¸å ·åçã¯å©ç¨è ã®è²¬ä»»ã§ãã 82 </b> 83 </div> 84 </div> 85 86 <table align="center" cellspacing="5" cellpadding="5" 87 border="1" 88 > 89 90 <tr> 91 <td>Spine 2D</td> 92 <td>ìì</td> 93 <td>Decorations / Animated Image</td> 94 </tr> 95 <tr valign="middle"> 96 <td class="sagyoudai"> 97 <div class="file-drop-area" title="drag and drop a chibi file set"> 98 <div id="content" style="display:inline-block"></div> 99 </div> 100 101 </td> 102 <td width="40" id="work2"> 103 íí 104 <div style="display: none;"> 105 <canvas id='cvs_shot' width='10' height='10' style="display: none;"></canvas> 106 <img src="img/blank.png" id="png_holder" width="32" height="32" style="display: none;"/> 107 </div> 108 </td> 109 110 <td valign="middle" align="center" class="sagyoudai" nowrap> 111 <div> 112 <div Zstyle="display: none;"> 113 <canvas id='cvs_shot2' width='1' height='1' Zstyle="display: none;"></canvas> 114 </div> 115 </div> 116 <div> 117 <div> 118 <span class="file-drop-area-2" title="Drag & Drop here"> 119 Open Deco files 120 </span> 121 122 Master Scale: 123 <input style="width: 10%;" type="number" value="1" id="kazari_master_sc" min="0.1" max="4" step="0.01"> 124 <!-- <input type="file" name="kazari_file" id="kazari_file">--> 125 </div> 126 <table border="1"> 127 <tr> 128 <td style="padding: 5px;margin:3px;display: none;" width="100"> 129 <div id="slot-list" class="tdoll-parts-list list-group"> 130 <!-- <button type="button" class="list-group-item list-group-item-action">--> 131 <!-- </button>--> 132 </div> 133 </td> 134 <td style="padding: 5px;margin:3px;" width="200"> 135 <div id="kazari-list" class="tdoll-parts-list list-group"> 136 137 </div> 138 </td> 139 <td style="padding: 5px;" width="400"> 140 141 <div style="font-size:120%;"> 142 143 <!-- <div class="gifex-input">--> 144 <!-- width :--> 145 <!-- <input style="width: 40%;" type="number" id="kazari_w" min="10" max="1000" step="1">--> 146 <!-- </div>--> 147 <!-- <div class="gifex-input">--> 148 <!-- height :--> 149 <!-- <input readonly style="width: 40%;" type="number" id="kazari_h" min="" max="1000" step="1">--> 150 <!-- </div>--> 151 152 <div class="gifex-input"> 153 selected : 154 <span id="kazari_name"></span> 155 </div> 156 157 <div class="gifex-input"> 158 position : 159 <input style="width: 30%;" type="number" id="kazari_x" min="-1000" max="1000" step="0.001"> 160 <input style="width: 30%;" type="number" id="kazari_y" min="-1000" max="1000" step="0.001"> 161 </div> 162 163 <div class="gifex-input"> 164 rotation : 165 <!-- <input style="width: 30%;" type="number" id="kazari_r" min="-1000" max="1000" step="0.001">--> 166 <input style="width: 30%;" type="number" id="kazari_r" min="-360" max="360" step="0.5"> 167 </div> 168 <div class="gifex-input"> 169 scale : 170 <input style="width: 30%;" type="number" id="kazari_sc" min="0.1" max="100" step="0.01"> 171 </div> 172 173 <div class="gifex-input" title="bone parent"> 174 parent : 175 <select id="doll-bones"> 176 <option value=""> -----------------</option> 177 <option> root</option> 178 <option> body</option> 179 <option> hip</option> 180 </select> 181 </div> 182 183 184 <div class="gifex-input" title="drawing order"> 185 draw order: 186 <select id="slot-draw-order"> 187 <option value=""> ------------</option> 188 <option> root</option> 189 </select> 190 </div> 191 192 <div class="gifex-input"> 193 <button id="remove-kazari-btn">Remove this deco</button> 194 </div> 195 196 </div> 197 198 199 </td> 200 </tr> 201 <tr> 202 <td colspan="3" style="padding:5px;text-align: center;"> 203 204 205 <button id="repackBtn">Repack Texture</button> 206 207 <button id="saveTxtrAtlasBtn">Save txtr .atlas</button> 208 <button id="saveTxtrPngkBtn">Save txtr .png</button> 209 <button id="saveSkelJsonBtn">Save skeleton json</button> 210 211 212 </td> 213 </tr> 214 </table> 215 216 </div> 217 218 219 <div class="" id="gifhere" style="padding:5px;background:darkseagreen;"></div> 220 </td> 221 </tr> 222 <tr> 223 224 <td style="margin:5px;padding:5px;" align="center" class="input-panel"> 225 <div> 226 <input type="file" id="fileElem" multiple accept=".png, .skel, .atlas, .json, .txt, .bytes" 227 style="display:none"> 228 <div class="gifex-input"> 229 <button id="fileSelect"> 230 Open skeleton 231 </button> 232 233 234 <button id="reloadBtn">Reload</button>
235 <span> 236 <input type="checkbox" id="pma_chk" value="true" title="Premultiplied Alpha">PMA 237 </span> 238 239 </div> 240 </div> 241 242 <hr/> 243 244 <div class="gifex-input"> 245 Duration: <span id="duration">0.0</span> seconds 246 247 </div> 248 249 <div class="gifex-input"> 250 <input id="currentTime_r" type="range" min="0" max="0" step="0.001" 251 style="width:70%;display:inline;margin:0px 5px 10px 5px;"/> 252 <input style="width: 20%;" type="number" id="currentTime_t" value="0" min="0" max="0" 253 step="0.001" readonly="readonly"/> 254 255 </div> 256 257 <div class="gifex-input"> 258 <table border="0" cellpadding="0" cellspacing="0" width="100%"> 259 <tr> 260 261 <td width="55%" valign="middle"> 262 263 <select id="dousa" style="text-align: center;width: 100%;"> 264 <option value="">---------</option> 265 </select> 266 </td> 267 <td valign="middle" nowrap=""> 268 269 <button id="playBtn">Play</button> 270 <button id="stopBtn">Stop</button> 271 <button id="flipxBtn">FlipX</button> 272 <!-- <button id="resetPoseBtn" >--> 273 <!-- Reset Pose--> 274 <!-- </button>--> 275 276 </td> 277 </tr> 278 </table> 279 280 </div> 281 282 <div class="gifex-input"> 283 <table border="0" width="100%;"> 284 <tr> 285 <td align="right"> 286 Motion<br/> 287 list: 288 </td> 289 <td width="15%;"> 290 <button id="addMotionBtn" style="text-align: left;">|<br/>|Add<br/> --></button> 291 </td> 292 <td rowspan="2" width="60%;"> 293 <textarea id="motion_list" style="width:100%;" rows="5"></textarea></td> 294 <td rowspan="2"> 295 <!--<button id="addMotionBtn">Add<br/>selected<br/>motion</button>--> 296 <button id="previewBtn">Calc Total<br/>& <br/>Preview</button> 297 </td> 298 </tr> 299 <tr> 300 <td colspan="2" style="text-align: center;"> 301 <button id="resetListBtn">Reset List</button> 302 </td> 303 </tr> 304 </table> 305 Total Duration: <span id="total_duration">0.0</span> seconds 306 </div> 307 308 <div class="gifex-input"> 309 <!--</div>--> 310 <!--<div class="gifex-input">--> 311 Split: 312 <select id="split_by"> 313 <option value="tnof">Total Number of Frames</option> 314 <option value="dpf" selected="selected">Delay per Frame</option> 315 </select> 316 </div> 317 <div class="gifex-input"> 318 <input style="width: 10%;" type="number" id="divide_by" value="30" min="2" max="9999" step="1"> 319 frames 320 <!--<button id="framesBtn">frames</button>--> 321 322 <-> 323 <input style="width: 10%;" type="number" id="step_by" value="25" min="20" max="1000"> 324 ms 325 </div> 326 327 328 <hr/> 329 330 331 <div class="gifex-input"> 332 <button id="splitBtn">Generate frames</button> 333 </div> 334 335 </td> 336 <td> 337 ë ë 338 </td> 339 <td style="margin:5px;padding:5px;" align="center"> 340 341 342 <div style="border:1px solid darkolivegreen; padding: 3px;"> 343 344 345 <div class="gifex-input"> 346 <span style="color:red;font-size:50%;"> 347 Transparent GIF 348 DOES NOT be supported. éæGIFã¯çæã§ãã¾ããã 349 </span> 350 <br/> 351 number of times to loop: <input style="width: 10%;" type="number" min="0" max="999" id="repeat" value="0"> 352 0: infinite 353 </div> 354 <div class="gifex-input"> 355 frame delay: <input style="width: 12%;" type="number" min="1" max="1000" id="delay" value="25"> ms 356 </div> 357 358 <div class="gifex-input"> 359 Type: 360 <select id="aniPicType"> 361 <option value="gif" selected>GIF</option> 362 <option value="png">APNG</option> 363 </select> 364 365 <button id="genGIFbtn">Generate</button> 366 367 <button id="saveGifBtn">Save</button> 368 </div> 369 <!--<div class="gifex-input">--> 370 <!--</div>--> 371 372 </div> 373 <!--<hr/>--> 374 <div class="gifex-input" style="font-size:80%;"> 375 <input type="checkbox" id="shadow_off" value="true"> remove shadow 376 | <input type="checkbox" id="megane_off" value="true"> remove glasses 377 378 | filter 379 <select id="fun_fltrs"> 380 <option value="">none</option> 381 <option value="dot">Dot</option> 382 <option value="crt">CRT</option> 383 </select>
384 | <input type="checkbox" id="enable_heterochromia" Xchecked="checked" value="true"> 385 <!-- <label for="enable_heterochromia">--> 386 heterochromia 387 <!-- </label>--> 388 </div> 389 390 <div class="gifex-input" id="heterochromia_ui" style="font-size:100%;border: 1px dashed darkgrey;display:none;"> 391 adjust hue and saturation of eyes' color 392 <table cellpadding="5" width="100%" border="0"> 393 394 <tr> 395 <td width="20%"> 396 Right Hue 397 </td> 398 <td width="60%"> 399 <input class="range-heterochromia" id="eye_r" 400 value="0" type="range" min="0" max="360" step="1"> 401 </td> 402 <td width="20%"> 403 <input class="number-heterochromia" type="number" id="val_eye_r" 404 value="0" type="range" min="0" max="360" step="1"> 405 </td> 406 </tr> 407 <tr> 408 <td width="20%"> 409 saturation 410 </td> 411 <td width="60%"> 412 <input class="range-heterochromia" id="eye_r-sat" 413 value="0" type="range" min="0" max="2" step="0.1"> 414 </td> 415 <td width="20%"> 416 <input class="number-heterochromia" type="number" id="val_eye_r-sat" 417 value="0" type="range" min="0" max="2" step="0.1"> 418 </td> 419 </tr> 420 <tr> 421 <td> 422 Left 423 </td> 424 <td> 425 <input class="range-heterochromia" id="eye_l" 426 value="0" type="range" min="0" max="360" step="1"> 427 </td> 428 <td> 429 <input class="number-heterochromia" type="number" id="val_eye_l" 430 value="0" type="range" min="0" max="360" step="1"> 431 </td> 432 </tr> 433 <tr> 434 <td> 435 saturation 436 </td> 437 <td> 438 <input class="range-heterochromia" id="eye_l-sat" 439 value="0" type="range" min="0" max="2" step="0.1"> 440 </td> 441 <td> 442 <input class="number-heterochromia" type="number" id="val_eye_l-sat" 443 value="0" type="range" min="0" max="2" step="0.1"> 444 </td> 445 </tr> 446 447 448 </table> 449 450 </div> 451 452 453 <div class="gifex-input" id="adjust_gls_ui" style="font-size:100%;border: 1px dashed #FF3333;display:none;"> 454 Megane 455 R:<input style="width: 12%;" type="number" id="adjust_gls_r" value="0" min="0" max="360" step="1"> 456 A:<input style="width: 12%;" type="number" id="adjust_gls_x" value="0" min="-30" max="30" step="1"> 457 B:<input style="width: 12%;" type="number" id="adjust_gls_y" value="0" min="-30" max="30" step="1"> 458 <br/> 459 SX:<input style="width: 12%;" type="number" id="adjust_gls_sx" value="1" min="-3" max="3" step="0.1"> 460 SY:<input style="width: 12%;" type="number" id="adjust_gls_sy" value="1" min="-3" max="3" step="0.1"> 461 <button id="applyGlsBtn">apply</button> 462 </div> 463 464 <div class="gifex-input"> 465 scale : 466 <input style="width: 15%;" type="number" id="scale_xy" value="1.0" min="0.2" max="4.0" step="0.01"> 467 <!--</div>--> 468 <!--<div class="gifex-input">--> 469 doll position: 470 <input style="width: 10%;" type="number" id="pos_x" value="180" min="0" max="400"> 471 <input style="width: 10%;" type="number" id="pos_y" value="252" min="0" max="400"> 472 </div> 473 <div class="gifex-input"> 474 margin: 475 <input style="width: 10%;" type="number" id="bs_margin" value="15" min="0" max="100"> 476 <button id="calcBoundsBtn">Detect Bounds for GIF</button> 477 </div> 478 <div class="gifex-input"> 479 GIF Bounds x/y : 480 <input style="width: 12%;" type="number" id="waku_x" min="-1000" max="1000"> 481 <input style="width: 12%;" type="number" id="waku_y" min="-1000" max="1000"> 482 483 <button id="centerBoundsBtn">Center</button> 484 485 486 </div> 487 <div class="gifex-input"> 488 GIF Bounds w/h : 489 <input style="width: 12%;
489" type="number" id="waku_w" value="0" max="400"> 490 <input style="width: 12%;" type="number" id="waku_h" value="0" max="400"> 491 492 <!--contraints ratio <input type="checkbox" value="true" id="contrains_radio"/>--> 493 </div> 494 495 496 <div class="gifex-input"> 497 498 BG color(RRGGBB): #<input style="width: 20%;" type="text" id="gif_bg" maxlength="6" value="ffffff" 499 placeholder=""> 500 <input type="checkbox" id="transparent" checked="true" value="true"> transparent 501 </div> 502 503 </td> 504 </tr> 505 </table> 506 507 <hr style="width:80%; "/> 508 <div id="sshot" style="padding:5px;margin:5px;"></div> 509 <div class="gifex-input" style="text-align: center"> 510 511 <progress id="saving_progress" max="100" value="0" style="width:300px;"> 512 </progress> 513 514 <!--</div>--> 515 516 <br/> 517 <button id="saveAllBtn">Save All Pics</button> 518 519 <button id="saveAsZipBtn">Save as a ZIP</button> 520 </div> 521 522 <hr style="width:80%; "/> 523 <div class="gifex-input" style="text-align: center"> 524 <h4>Experimental Utilities</h4> 525 <!-- <button id="saveSkelJsonBtn">Save skeleton json(2.1.x)</button>--> 526 <!-- <button id="export4db">Export Spine3.6(DragonBones)</button>--> 527 <!-- <button id="export4s38">Export Spine3.8.x </button>--> 528 <!-- --> 529 <!-- <button id="saveAtlas4xBtn">Save atlas_4x</button>--> 530 <!-- <button id="unpackTextureBtn">Unpack .atlas Texture</button>--> 531 532 <!-- <br/>--> 533 <!-- <br/>--> 534 <!-- <h5>Hm..interesting Features</h5>--> 535 <!-- <button id="reserveGlassesBtn">Reserve Glasses</button>--> 536 <!-- --> 537 <!-- <input type="checkbox" id="clearFailStepChk" value="true"> Enable Clear-Fail Step--> 538 539 540 </div> 541 542 543 <hr style="width:80%; "/> 544 545 <div class="gifex-input" style="text-align: center"> 546 547 <h4>Settings</h4> 548 549 550 <div> 551 <h6>workspace is too small? Use Settings to change workspace width & height.</h6> 552 553 <div class="gifex-input"> 554 Size of Workspace : 555 width: <input size="5" style="Zwidth: 20%;" type="number" id="input_ws_w" value="" min="400" max="2000"> 556 height: <input size="5" style="Zwidth: 20%;" type="number" id="input_ws_h" value="" min="400" max="2000"> 557 558 559 <button id="regenWSBtn">Regen workspace</button> 560 561 </div> 562 563 564 </div> 565 566 567 </div> 568 569 570 <hr style="width:80%; "/> 571 572 <div w3-include-html="release_notes3.html"></div> 573 574 575 <hr style="width:80%; "/> 576 <h4>Acknowledgements</h4> 577 578 <div style="text-align: left;display: inline-block;font-size:70%;"> 579 Libraries 580 <ul> 581 <li><a target="_blank" href="https://github.com/cullus/gfSpinePiXi">gfSpinePiXi</a></li> 582 <li><a target="_blank" href="https://www.pixijs.com/">pixi.js</a></li> 583 <li><a target="_blank" href="https://github.com/pixijs/pixi-spine">pixi-spine</a></li> 584 <li><a target="_blank" href="https://github.com/jnordberg/gif.js">gif.js</a></li> 585 <li><a target="_blank" href="https://github.com/eligrey/FileSaver.js/">FileSaver.js</a></li> 586 <li><a target="_blank" href="https://spin.js.org/">spin.js</a></li> 587 <li><a target="_blank" href="https://github.com/g200kg/apngbuilder">APNGBuilder</a></li> 588 <li><a target="_blank" href="https://github.com/Stuk/jszip">JSZip</a></li> 589 </ul> 590 <!-- </div>--> 591 <!-- <div style="text-align: left;display: inline-block;font-size:70%;">--> 592 Special Thanks to 593 <ul> 594 <li>Chibi Club, The</li> 595 </ul> 596 597 </div> 598 599 <hr style="width:80%; "/> 600 601 <div style=""> 602 <b> 603 Ask, and it shall be given to you. 604 </b> 605 <br/> 606 <br/> 607 <br/> 608 </div> 609 610 611</div> 612
613<script> 614 615 616 var ws_w = localStorage.getItem("ws_w") || 400; 617 var ws_h = localStorage.getItem("ws_h") || 400; 618 var ws_scale = localStorage.getItem("ws_scale") || 1.0; 619 ws_w = parseInt(ws_w); 620 ws_h = parseInt(ws_h); 621 ws_scale = parseFloat(ws_scale); 622 623 let spinner_opts = { 624 lines: 15, // The number of lines to draw 625 length: 20, // The length of each line 626 width: 6, // The line thickness 627 radius: 30, // The radius of the inner circle 628 scale: 0.75, // Scales overall size of the spinner 629 corners: 0.7, // Corner roundness (0..1) 630 color: '#000000', // CSS color or array of colors 631 fadeColor: 'transparent', // CSS color or array of colors 632 speed: 1, // Rounds per second 633 rotate: 0, // The rotation offset 634 animation: 'spinner-line-fade-quick', // The CSS animation name for the lines 635 direction: 1, // 1: clockwise, -1: counterclockwise 636 zIndex: 2e9, // The z-index (defaults to 2000000000) 637 className: 'spinner', // The CSS class to assign to the spinner 638 top: '0%', // Top position relative to parent 639 left: '0%', // Left position relative to parent 640 shadow: '0 0 1px transparent', // Box-shadow for the lines 641 position: 'relative' // Element positioning 642 }; 643 644 var spinner; 645 646 function add_spinner() { 647 var target = document.getElementById('gifhere'); 648 spinner = new Spinner(spinner_opts).spin(target); 649 } 650 651 function remove_spinner() { 652 spinner.stop(); 653 } 654 655 window.URL = window.URL || window.webkitURL; 656 657 function _d() { 658 return chibi_deco.core._h.doll; 659 } 660 661 function _s() { 662 return _d().state; 663 } 664 665 function _sk() { 666 return _d().skeleton; 667 } 668 669 function _fb(n) { 670 return _sk().findBone(n); 671 } 672 673 function _fbi(n) { 674 return _sk().findBoneIndex(n); 675 } 676 677 function _fs(n) { 678 return _sk().findSlot(n); 679 } 680 681 function _fsi(n) { 682 return _sk().findSlotIndex(n); 683 } 684 685 function _bs() { 686 return _d().spineData.bones.map(a => a.name) 687 } 688 689 function _ss() { 690 return _d().spineData.slots.map(a => a.name) 691 } 692 693 function _fa(k) { 694 let d = _d().spineData; 695 return "number" === $.type(k) ? d.animations[k] : d.findAnimation(k); 696 } 697 698 function _lkbntl(idx, n) { 699 var bidx = _sk().findBoneIndex(n); 700 return _fa(idx).timelines.filter(t => t.boneIndex == bidx); 701 } 702 703 function _lksltl(idx, n) { 704 var sidx = _sk().findSlotIndex(n); 705 return _fa(idx).timelines.filter(t => t.slotIndex == sidx); 706 } 707 708 function _dcp(o) { 709 return JSON.parse(JSON.stringify(o)); 710 } 711 712 var megane = null; 713 714 function wear_megane(idx) { 715 megane = chibi_deco.core._h.megane; 716 if (megane) { 717 _d().children[idx].addChild(megane); 718 } 719 } 720 721 var hold_skel_json = true; 722 var clearfail; 723 724 function http_get(url, callback) { 725 $.get(url, function (res) { 726 callback(res); 727 }); 728 } 729 730 // function fn_skeleton_filter(skel, bones, slots, animations, skins) {return skel;} 731 function fn_slots_filter(slots, skel, bones) { 732 } 733 734 function fn_bones_filter(bones, skel) { 735 } 736 737 function fn_animations_filter(animations, skel, bones) { 738 } 739 740 function fn_skins_filter(skins, skel) { 741 } 742 743 function fn_cb_d(d) { 744 // cbx(d); 745 } 746 747 // t_sc = 4.2; 748 t_sc = 1.0; 749 // function t_w() { return parseInt(459/t_sc) } 750 // function t_h() { return parseInt(306/t_sc) } 751 function t_w() { 752 return parseInt(96 / t_sc) 753 } 754 755 function t_h() { 756 return parseInt(96 / t_sc) 757 } 758 759 // function t_w() { return parseInt(250/t_sc) } 760 // function t_h() { return parseInt(176/t_sc) } 761 s_x = 0; 762 s_y = 0; 763 b_x = 0; 764 b_y = 0; 765 s_r = 0; 766 // s_r = -30; 767 s_sx = 1; 768 s_sy = 1; 769 b_p = "armR3"; 770 s_o = "armR3"; 771 772 s_r = -90; 773 s_x = -10; 774 s_y = 20; 775 b_p = "root"; 776 s_o = "armR4"; 777 778 function cbx(d) { 779 return; 780 try { 781 782 _fs("gun").currentSprite.visible = false; 783 let size = 6; 784 _fs("payoen_tube").currentSprite.filters = [new PIXI.filters.PixelateFilter(size)]; 785 _fs("armR3").currentSprite.filters = [new PIXI.filters.PixelateFilter(size)]; 786 _fs("armR2").currentSprite.filters = [new PIXI.filters.PixelateFilter(size)]; 787 // _fs("armR4").currentMesh.filters = [new PIXI.filters.PixelateFilter(10)]; 788 _fs("armL3").currentSprite.filters = [new PIXI.filters.PixelateFilter(size)]; 789 } catch (e) { 790 console.log(e); 791 } 792 } 793 794 Array.prototype.insert = function (index, item) { 795 this.splice(index, 0, item); 796 }; 797 798 var kazari_data = {}; 799 var kazari_txtr_names = []; 800 var kazari_txtr_obj = {}; 801 var current_kazari = null; 802 803 function fn_cb_atlas_after_load(atlas) { 804 // return; 805 // (set! js/tube0 (js/PIXI.Sprite.fromImage. "img/test/commander_30040_0.png"))
806 let core = PIXI.spine.core; 807 // const core = chibi_deco.core.spine_rt;//PIXI.spine.SpineRuntime; 808 809 console.log("spine rt=", core); 810 811 // var name = "txtr2"; 812 // tubeTxtr = PIXI.BaseTexture.fromImage("img/test/commander_30040_0.png"); 813 // tubeTxtr = PIXI.BaseTexture.fromImage("img/honkai.png"); 814 // tubeTxtr = PIXI.BaseTexture.fromImage("img/test/10ga.png"); 815 // tubeTxtr = PIXI.BaseTexture.fromImage("img/test/Commander_1620_0.png"); 816 // tubeTxtr = PIXI.BaseTexture.fromImage("img/test/256px-Back_Scratcher.png"); 817 // tubeTxtr.width = t_w; 818 // tubeTxtr.height = t_h; 819 // var master_sc = parseFloat($("#kazari_master_sc").val()); 820 // if (isNaN(master_sc)) { master_sc = 1.0 } 821 822 console.log("atlas", atlas); 823 824 console.log("kazari_txtr_names", kazari_txtr_names); 825 826 for (var i = 0; i < kazari_txtr_names.length; i++) { 827 828 var name = kazari_txtr_names[i]; 829 // var name = name0.replace(/\.png$/, ""); 830 831 var tubeTxtr = kazari_txtr_obj[name]; 832 var master_sc = tubeTxtr._deco_msc || 1.0; 833 834 console.log("kazari n=", name, tubeTxtr); 835 // tubeTxtr.setR 836 837 var page = new core.TextureAtlasPage(); 838 page.name = name; 839 var w0 = tubeTxtr.width; 840 var h0 = tubeTxtr.height; 841 var w = w0 * master_sc; 842 var h = h0 * master_sc; 843 tubeTxtr._deco_w = w; 844 tubeTxtr._deco_h = h; 845 page.width = w0; 846 page.height = h0; 847 page.uWrap = page.vWrap = core.TextureWrap.ClampToEdge; 848 page.minFilter = page.magFilter = core.TextureFilter.Nearest; 849 // page.rendererObject = tubeTxtr; 850 page.baseTexture = tubeTxtr; 851 atlas.pages.push(page); 852 853 console.log("page", page); 854 855 // var region = new core.AtlasRegion(); 856 var region = new core.TextureAtlasRegion(); 857 region.name = name; //"payoen_tube"; 858 region.page = page; 859 region.rotate = false; 860 region.width = w0; 861 region.height = h0; 862 region.u = region.v = 0; 863 region.u2 = region.v2 = 1; 864 region.x = region.y = 0; 865 region.originalWidth = w0; 866 region.originalHeight = h0; 867 region.offsetX = region.offsetY = 0; 868 region.index = -1; 869 region._deco_w = w; 870 region._deco_h = h; 871 872 var rotate = false; 873 var orig = new PIXI.Rectangle(0, 0, w0, h0); 874 var trim = new PIXI.Rectangle(0, h0 - h0 - 0, w0, h0); 875 var frame = new PIXI.Rectangle(0, 0, w0, h0); 876 region.texture = 877 new PIXI.Texture(region.page.baseTexture, frame, orig, trim, rotate); 878 879 atlas.regions.push(region); 880 881 console.log("region", region); 882 883 } 884 885 886 console.log("atlas", atlas); 887 888 889 } 890 891 // var base_w = 95; 892 893 function fn_skeleton_filter(skel, bones, slots, animations, skins) { 894 895 var skin = skins.default; 896 897 var kzr_names = {}; 898 kazari_txtr_names.forEach(n => kzr_names[n] = true); 899 900 for (var i = 0; i < kazari_txtr_names.length; i++) { 901 902 var name = kazari_txtr_names[i]; 903 // name = name.replace(/\.png$/, ""); 904 var tubeTxtr = kazari_txtr_obj[name]; 905 var master_sc = tubeTxtr._deco_msc || 1.0; 906 907 var width = tubeTxtr.width * master_sc; 908 var height = tubeTxtr.height * master_sc; 909 var ratio = height / width; 910 911 // console.log(skel); 912 // console.log(name, "msc=", master_sc, width, height); 913 // console.log(name, "msc=", master_sc, width, height, tubeTxtr); 914 915 var d = kazari_data[name] || 916 { 917 "s_x": 0//-3 //18, //22, 918 , "s_y": 0//-10//-14, 919 , "s_r": 0 //-94, 920 , "s_sx": 1, 921 "s_sy": 1, 922 "s_sc": 1, 923 "b_x": 0, 924 "b_y": 0, 925 "b_r": 0, 926 "w": width, //128, 927 "h": height, //128 * ratio, 928 // "b_p": "body", // "BodyBinder1" 929 // "b_p": "BodyBinder1", 930 // "s_o": "RHandLayer" 931 } 932 ; 933 934 d.w = width; 935 d.h = height; 936 937 kazari_data[name] = d; 938 939 // console.log("k", d); 940 941 var o = {}; 942 o[name] = { 943 "type": "region", 944 "name": name, //"payoen_tube", 945 "path": name, //"payoen_tube", 946 "x": d.s_x || 0, 947 "y": d.s_y || 0, 948 "scaleX": d.s_sx || d.s_sc || 1, 949 "scaleY": d.s_sy || d.s_sc || 1, 950 "rotation": d.s_r || 0, 951 "width": d.w || width, 952 "height": d.h || height, 953 "color": "ffffffff" 954 } 955 ; 956 skin[name] = o; 957 958 var idx = 0; 959 var found = false;
960 for (idx = 0; idx < slots.length; idx++) { 961 var sl = slots[idx]; 962 if (sl.name == d.s_o) { 963 found = true; 964 break; 965 } 966 } 967 // if (!found) { 968 // for (idx = 0; idx < slots.length; idx++) { 969 // var sl = slots[idx]; 970 // if (sl.name == "body") { 971 // break; 972 // } 973 // } 974 // } 975 if (!found) { 976 idx = slots.length; 977 } 978 979 slots.insert(idx, 980 { 981 "name": name, 982 "bone": name, 983 "color": "ffffffff", 984 "attachment": name, //"payoen_tube", 985 "blend": "normal" 986 }); 987 988 var pbn = d.b_p; 989 990 found = false; 991 for (idx = 0; idx < bones.length; idx++) { 992 var bn = bones[idx]; 993 if (bn.name == pbn) { 994 found = true; 995 break; 996 } 997 } 998 if (!found && kzr_names[pbn]) { 999 found = true; 1000 } 1001 if (!found) { 1002 pbn = "root"; 1003 } 1004 bones.push({ 1005 "name": name, //"payoen_tube", 1006 "parent": pbn, 1007 "x": d.b_x || 0, 1008 "y": d.b_y || 0, 1009 "scaleX": d.b_sc || d.s_sx || d.s_sc || 1, 1010 "scaleY": d.b_sc || d.s_sy || d.s_sc || 1, 1011 "rotation": d.b_r || 0, 1012 "length": 30, 1013 "flipX": false, 1014 "flipY": false, 1015 "inheritScale": false, 1016 "inheritRotation": true, 1017 "color": "9b9b9bff" 1018 }); 1019 1020 } 1021 1022 if (kazari_txtr_names.length > 0) { 1023 fix_draw_order( 1024 kazari_txtr_names, slots, animations 1025 ); 1026 } 1027 1028 return skel; 1029 } 1030 1031 function debugGeo(n) { 1032 var bone = _fb(n); 1033 1034 function ff(bn) { 1035 var p = bn.parent; 1036 // if (!p) { 1037 // return; 1038 // } 1039 // console.log(bn.data.name 1040 // , bn.worldX, bn.worldY 1041 // , bn.worldX - p.worldX, bn.worldY - p.worldY 1042 // , bn.worldRotation , bn.worldRotation - p.worldRotation 1043 // ) 1044 console.log(bn.data.name, bn.x, bn.worldX 1045 , bn.y, bn.worldY 1046 , bn.rotation, bn.worldRotation 1047 ) 1048 if (!p) { 1049 return; 1050 } 1051 ff(p); 1052 } 1053 1054 ff(bone); 1055 } 1056 1057 var last_files = null; 1058 1059 1060 // let spine_gif_version = "0.1.23.0-test"; 1061 let spine_gif_version = "deco3_0.5.0"; 1062 1063 function fix_draw_order() { 1064 } 1065 1066</script>
1066 1067
1068<script src="js/compiled/chibi_deco.js?ts=deco3_0.5.0" 1069 type="text/javascript"></script>
1069 1070
1071<script> 1072 1073 // PIXI.spine.SpineRuntime.Bone.yDown = false; 1074 /* 1075 bat0.anchor.set(0.38, 0.65); 1076 bat0.scale.set(0.28) 1077 bat0.rotation = Math.PI/180*-38 ; 1078 _fs("armR4").currentSprite.parent.addChildAt(bat0,0); 1079 axe0.scale.set(0.22); 1080 axe0.rotation = 1.4660765716752366; 1081 axe0.anchor.set ( 0.58, 0.58 ); 1082 _fs("face").currentSprite.parent.addChild(axe0); 1083 1084 */ 1085 1086 1087 w3.includeHTML(); 1088 1089 $(function () { 1090 // $(".tdoll-parts-list").css("height", ws_h + "px"); 1091 1092 }); 1093 1094 function round(n) { 1095 return Math.round(n * 10000) / 10000; 1096 } 1097 1098 function l2w(b, x, y) { 1099 b.localToWorld(xy = [x, y]); 1100 xy = xy.map(n => round(n)); 1101 return xy; 1102 } 1103 1104 function w2l(b, x, y) { 1105 b.worldToLocal(xy = [x, y]); 1106 xy = xy.map(n => round(n)); 1107 return xy; 1108 } 1109 1110 packer = new MaxRectsPacker.MaxRectsPacker(4096, 4096, 2, {allowRotation: false, smart: true, square: false}); 1111 1112</script>
1112 1113 1114<a href="https://github.com/naganeko/naganeko-tools"><img decoding="async" width="149" height="149" src="https://github.blog/wp-content/uploads/2008/12/forkme_right_red_aa0000.png?resize=149%2C149" style="position: absolute;top:0px;right:0px;" alt="Fork me on GitHub" loading="lazy" data-recalc-dims="1"></a> 1115 1116<!-- Cloudflare Pages Analytics -->
vendor: 99 bytes, line 1116
1116<script defer src='https://static.cloudflareinsights.com/beacon.min.js' data-cf-beacon='{"token": "
1116ba6256a2038e4c9ea699415b28a2596f
vendor: 13 bytes, line 1116
1116"}'></script>
1116<!-- Cloudflare Pages Analytics --></body> 1117</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.