UnityMirror/spine-runtimes
1
0
Fork 0
mirror of https://github.com/EsotericSoftware/spine-runtimes.git synced 2026-03-26 22:49:01 +08:00
Code Issues Packages Projects Releases Wiki Activity

[ts] Refactor build, don't commit artifacts

Browse Source 
npm install will automatically build everything necessary for local development and viewing the examples.
This commit is contained in:
Mario Zechner 2021-09-01 11:09:31 +02:00
parent a9f6735106
commit 3d3589f265
39 changed files with 960 additions and 9539 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
spine-ts/build.sh
View File

@ -10,13 +10,18 @@ fi
echo "Building spine-ts $BRANCH artifacts"
npm install
npm run build
ls build/*.js build/*.ts | awk '{print "unexpand -t 4 ", $0, " > /tmp/e; mv /tmp/e ", $0}' | sh
if ! [ -z "$TS_UPDATE_URL" ] && ! [ -z "$BRANCH" ];
then
echo "Deploying spine-ts $BRANCH artifacts"
zip -j spine-ts.zip build/* spine-player/css/spine-player.css spine-player/example/external/*
zip -j spine-ts.zip \
spine-core/dist/iife/* \
spine-canvas/dist/iife/* \
spine-webgl/dist/iife/* \
spine-player/dist/iife/* \
spine-threejs/dist/iife/* \
spine-player/css/spine-player.css \
spine-player/example/external/*
curl -f -F "file=@spine-ts.zip" "$TS_UPDATE_URL$BRANCH"
else
echo "Not deploying artifacts. TS_UPDATE_URL and/or BRANCH not set."

8883
spine-ts/build/spine-canvas.js
View File

File diff suppressed because it is too large Load Diff

7
spine-ts/build/spine-canvas.js.map
View File

File diff suppressed because one or more lines are too long

482
spine-ts/package-lock.json generated
View File

@ -1,12 +1,12 @@
{
"name": "@esotericsoftware/spine-ts",
"version": "4.0.1",
"version": "4.0.2",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "@esotericsoftware/spine-ts",
"version": "4.0.1",
"version": "4.0.2",
"license": "LicenseRef-LICENSE",
"workspaces": [
"spine-core",
@ -17,9 +17,11 @@
],
"devDependencies": {
"concurrently": "^6.2.1",
"copyfiles": "^2.4.1",
"esbuild": "^0.12.22",
"live-server": "^1.2.1",
"npx": "^10.2.2",
"rimraf": "^3.0.2",
"typescript": "^4.3.5"
}
},
@ -229,6 +231,12 @@
"node": ">= 4.5.0"
}
},
"node_modules/balanced-match": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
"dev": true
},
"node_modules/base": {
"version": "0.11.2",
"resolved": "https://registry.npmjs.org/base/-/base-0.11.2.tgz",
@ -302,6 +310,16 @@
"file-uri-to-path": "1.0.0"
}
},
"node_modules/brace-expansion": {
"version": "1.1.11",
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
"integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
"dev": true,
"dependencies": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
}
},
"node_modules/braces": {
"version": "2.3.2",
"resolved": "https://registry.npmjs.org/braces/-/braces-2.3.2.tgz",
@ -527,6 +545,12 @@
"integrity": "sha512-Rd3se6QB+sO1TwqZjscQrurpEPIfO0/yYnSin6Q/rD3mOutHvUrCAhJub3r90uNb+SESBuE0QYoB90YdfatsRg==",
"dev": true
},
"node_modules/concat-map": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
"integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
"dev": true
},
"node_modules/concurrently": {
"version": "6.2.1",
"resolved": "https://registry.npmjs.org/concurrently/-/concurrently-6.2.1.tgz",
@ -659,6 +683,25 @@
"node": ">=0.10.0"
}
},
"node_modules/copyfiles": {
"version": "2.4.1",
"resolved": "https://registry.npmjs.org/copyfiles/-/copyfiles-2.4.1.tgz",
"integrity": "sha512-fereAvAvxDrQDOXybk3Qu3dPbOoKoysFMWtkY3mv5BsL8//OSZVL5DCLYqgRfY5cWirgRzlC+WSrxp6Bo3eNZg==",
"dev": true,
"dependencies": {
"glob": "^7.0.5",
"minimatch": "^3.0.3",
"mkdirp": "^1.0.4",
"noms": "0.0.0",
"through2": "^2.0.1",
"untildify": "^4.0.0",
"yargs": "^16.1.0"
},
"bin": {
"copyfiles": "copyfiles",
"copyup": "copyfiles"
}
},
"node_modules/core-util-is": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
@ -1039,19 +1082,11 @@
"integrity": "sha1-g8YK/Fi5xWmXAH7Rp2izqzA6RP4=",
"dev": true
},
"node_modules/fsevents": {
"version": "2.3.2",
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
"integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
"dev": true,
"hasInstallScript": true,
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": "^8.16.0 || ^10.6.0 || >=11.0.0"
}
"node_modules/fs.realpath": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
"integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
"dev": true
},
"node_modules/function-bind": {
"version": "1.1.1",
@ -1077,6 +1112,26 @@
"node": ">=0.10.0"
}
},
"node_modules/glob": {
"version": "7.1.7",
"resolved": "https://registry.npmjs.org/glob/-/glob-7.1.7.tgz",
"integrity": "sha512-OvD9ENzPLbegENnYP5UUfJIirTg4+XwMWGaQfQTY0JenxNvvIKP3U3/tAQSPIu/lHxXYSZmpXlUHeqAIdKzBLQ==",
"dev": true,
"dependencies": {
"fs.realpath": "^1.0.0",
"inflight": "^1.0.4",
"inherits": "2",
"minimatch": "^3.0.4",
"once": "^1.3.0",
"path-is-absolute": "^1.0.0"
},
"engines": {
"node": "*"
},
"funding": {
"url": "https://github.com/sponsors/isaacs"
}
},
"node_modules/glob-parent": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz",
@ -1217,6 +1272,16 @@
"integrity": "sha512-t7hjvef/5HEK7RWTdUzVUhl8zkEu+LlaE0IYzdMuvbSDipxBRpOn4Uhw8ZyECEa808iVT8XCjzo6xmYt4CiLZg==",
"dev": true
},
"node_modules/inflight": {
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
"integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
"dev": true,
"dependencies": {
"once": "^1.3.0",
"wrappy": "1"
}
},
"node_modules/inherits": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
@ -1483,15 +1548,6 @@
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
"dev": true
},
"node_modules/magic-string": {
"version": "0.25.7",
"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.25.7.tgz",
"integrity": "sha512-4CrMT5DOHTDk4HYDlzmwu4FVCcIYI8gauveasrdCu2IKIFOJ3f0v/8MDGJCDL9oD2ppz/Av1b0Nj345H9M+XIA==",
"dev": true,
"dependencies": {
"sourcemap-codec": "^1.4.4"
}
},
"node_modules/map-cache": {
"version": "0.2.2",
"resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
@ -1610,6 +1666,18 @@
"node": ">= 0.6"
}
},
"node_modules/minimatch": {
"version": "3.0.4",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
"integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
"dev": true,
"dependencies": {
"brace-expansion": "^1.1.7"
},
"engines": {
"node": "*"
}
},
"node_modules/mixin-deep": {
"version": "1.3.2",
"resolved": "https://registry.npmjs.org/mixin-deep/-/mixin-deep-1.3.2.tgz",
@ -1635,6 +1703,18 @@
"node": ">=0.10.0"
}
},
"node_modules/mkdirp": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-1.0.4.tgz",
"integrity": "sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==",
"dev": true,
"bin": {
"mkdirp": "bin/cmd.js"
},
"engines": {
"node": ">=10"
}
},
"node_modules/morgan": {
"version": "1.10.0",
"resolved": "https://registry.npmjs.org/morgan/-/morgan-1.10.0.tgz",
@ -1729,6 +1809,40 @@
"node": ">= 0.6"
}
},
"node_modules/noms": {
"version": "0.0.0",
"resolved": "https://registry.npmjs.org/noms/-/noms-0.0.0.tgz",
"integrity": "sha1-2o69nzr51nYJGbJ9nNyAkqczKFk=",
"dev": true,
"dependencies": {
"inherits": "^2.0.1",
"readable-stream": "~1.0.31"
}
},
"node_modules/noms/node_modules/isarray": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
"integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
"dev": true
},
"node_modules/noms/node_modules/readable-stream": {
"version": "1.0.34",
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
"integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
"dev": true,
"dependencies": {
"core-util-is": "~1.0.0",
"inherits": "~2.0.1",
"isarray": "0.0.1",
"string_decoder": "~0.10.x"
}
},
"node_modules/noms/node_modules/string_decoder": {
"version": "0.10.31",
"resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
"integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
"dev": true
},
"node_modules/normalize-package-data": {
"version": "2.5.0",
"resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.5.0.tgz",
@ -6918,6 +7032,15 @@
"node": ">= 0.8"
}
},
"node_modules/once": {
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
"integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
"dev": true,
"dependencies": {
"wrappy": "1"
}
},
"node_modules/opn": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/opn/-/opn-6.0.0.tgz",
@ -7174,41 +7297,19 @@
"node": ">=0.12"
}
},
"node_modules/rollup": {
"version": "2.56.3",
"resolved": "https://registry.npmjs.org/rollup/-/rollup-2.56.3.tgz",
"integrity": "sha512-Au92NuznFklgQCUcV96iXlxUbHuB1vQMaH76DHl5M11TotjOHwqk9CwcrT78+Tnv4FN9uTBxq6p4EJoYkpyekg==",
"dev": true,
"bin": {
"rollup": "dist/bin/rollup"
},
"engines": {
"node": ">=10.0.0"
},
"optionalDependencies": {
"fsevents": "~2.3.2"
}
},
"node_modules/rollup-plugin-dts": {
"node_modules/rimraf": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/rollup-plugin-dts/-/rollup-plugin-dts-3.0.2.tgz",
"integrity": "sha512-hswlsdWu/x7k5pXzaLP6OvKRKcx8Bzprksz9i9mUe72zvt8LvqAb/AZpzs6FkLgmyRaN8B6rUQOVtzA3yEt9Yw==",
"resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
"integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
"dev": true,
"dependencies": {
"magic-string": "^0.25.7"
"glob": "^7.1.3"
},
"engines": {
"node": ">=v12.22.1"
"bin": {
"rimraf": "bin.js"
},
"funding": {
"url": "https://github.com/sponsors/Swatinem"
},
"optionalDependencies": {
"@babel/code-frame": "^7.12.13"
},
"peerDependencies": {
"rollup": "^2.48.0",
"typescript": "^4.2.4"
"url": "https://github.com/sponsors/isaacs"
}
},
"node_modules/rxjs": {
@ -7511,12 +7612,6 @@
"integrity": "sha512-cPiFOTLUKvJFIg4SKVScy4ilPPW6rFgMgfuZJPNoDuMs3nC1HbMUycBoJw77xFIp6z1UJQJOfx6C9GMH80DiTw==",
"dev": true
},
"node_modules/sourcemap-codec": {
"version": "1.4.8",
"resolved": "https://registry.npmjs.org/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz",
"integrity": "sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==",
"dev": true
},
"node_modules/spawn-command": {
"version": "0.0.2-1",
"resolved": "https://registry.npmjs.org/spawn-command/-/spawn-command-0.0.2-1.tgz",
@ -7752,6 +7847,16 @@
"integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=",
"dev": true
},
"node_modules/through2": {
"version": "2.0.5",
"resolved": "https://registry.npmjs.org/through2/-/through2-2.0.5.tgz",
"integrity": "sha512-/mrRod8xqpA+IHSLyGCQ2s8SPHiCDEeQJSep1jqLYeEUClOFG2Qsh+4FU6G9VeqpZnGW/Su8LQGc4YKni5rYSQ==",
"dev": true,
"dependencies": {
"readable-stream": "~2.3.6",
"xtend": "~4.0.1"
}
},
"node_modules/to-object-path": {
"version": "0.3.0",
"resolved": "https://registry.npmjs.org/to-object-path/-/to-object-path-0.3.0.tgz",
@ -7935,6 +8040,15 @@
"node": ">=0.10.0"
}
},
"node_modules/untildify": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/untildify/-/untildify-4.0.0.tgz",
"integrity": "sha512-KK8xQ1mkzZeg9inewmFVDNkg3l5LUhoq9kN6iWYB/CC9YMG8HA+c1Q8HwDe6dEX7kErrEVNVBO3fWsVq5iDgtw==",
"dev": true,
"engines": {
"node": ">=8"
}
},
"node_modules/upath": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/upath/-/upath-1.2.0.tgz",
@ -8078,6 +8192,21 @@
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
"dev": true
},
"node_modules/wrappy": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
"integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
"dev": true
},
"node_modules/xtend": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
"integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==",
"dev": true,
"engines": {
"node": ">=0.4"
}
},
"node_modules/y18n": {
"version": "5.0.8",
"resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
@ -8116,48 +8245,42 @@
},
"spine-canvas": {
"name": "@esotericsoftware/spine-canvas",
"version": "4.0.1",
"version": "4.0.2",
"license": "LicenseRef-LICENSE",
"dependencies": {
"@esotericsoftware/spine-core": "4.0.1"
"@esotericsoftware/spine-core": "4.0.2"
}
},
"spine-core": {
"name": "@esotericsoftware/spine-core",
"version": "4.0.1",
"version": "4.0.2",
"license": "LicenseRef-LICENSE"
},
"spine-player": {
"name": "@esotericsoftware/spine-player",
"version": "4.0.1",
"version": "4.0.2",
"license": "LicenseRef-LICENSE",
"dependencies": {
"@esotericsoftware/spine-core": "4.0.1",
"@esotericsoftware/spine-webgl": "4.0.1"
"@esotericsoftware/spine-core": "4.0.2",
"@esotericsoftware/spine-webgl": "4.0.2"
}
},
"spine-threejs": {
"name": "@esotericsoftware/spine-threejs",
"version": "4.0.1",
"version": "4.0.2",
"license": "LicenseRef-LICENSE",
"dependencies": {
"@esotericsoftware/spine-core": "4.0.1",
"@esotericsoftware/spine-core": "4.0.2",
"@types/three": "^0.131.0",
"three": "^0.132.0"
},
"devDependencies": {
"npx": "^10.2.2",
"rollup": "^2.56.2",
"rollup-plugin-dts": "^3.0.2",
"typescript": "^4.3.5"
}
},
"spine-webgl": {
"name": "@esotericsoftware/spine-webgl",
"version": "4.0.1",
"version": "4.0.2",
"license": "LicenseRef-LICENSE",
"dependencies": {
"@esotericsoftware/spine-core": "4.0.1"
"@esotericsoftware/spine-core": "4.0.2"
}
}
},
@ -8191,7 +8314,7 @@
"@esotericsoftware/spine-canvas": {
"version": "file:spine-canvas",
"requires": {
"@esotericsoftware/spine-core": "4.0.1"
"@esotericsoftware/spine-core": "4.0.2"
}
},
"@esotericsoftware/spine-core": {
@ -8200,26 +8323,22 @@
"@esotericsoftware/spine-player": {
"version": "file:spine-player",
"requires": {
"@esotericsoftware/spine-core": "4.0.1",
"@esotericsoftware/spine-webgl": "4.0.1"
"@esotericsoftware/spine-core": "4.0.2",
"@esotericsoftware/spine-webgl": "4.0.2"
}
},
"@esotericsoftware/spine-threejs": {
"version": "file:spine-threejs",
"requires": {
"@esotericsoftware/spine-core": "4.0.1",
"@esotericsoftware/spine-core": "4.0.2",
"@types/three": "^0.131.0",
"npx": "^10.2.2",
"rollup": "^2.56.2",
"rollup-plugin-dts": "^3.0.2",
"three": "^0.132.0",
"typescript": "^4.3.5"
"three": "^0.132.0"
}
},
"@esotericsoftware/spine-webgl": {
"version": "file:spine-webgl",
"requires": {
"@esotericsoftware/spine-core": "4.0.1"
"@esotericsoftware/spine-core": "4.0.2"
}
},
"@types/normalize-package-data": {
@ -8336,6 +8455,12 @@
"integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==",
"dev": true
},
"balanced-match": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
"dev": true
},
"base": {
"version": "0.11.2",
"resolved": "https://registry.npmjs.org/base/-/base-0.11.2.tgz",
@ -8399,6 +8524,16 @@
"file-uri-to-path": "1.0.0"
}
},
"brace-expansion": {
"version": "1.1.11",
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
"integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
"dev": true,
"requires": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
}
},
"braces": {
"version": "2.3.2",
"resolved": "https://registry.npmjs.org/braces/-/braces-2.3.2.tgz",
@ -8586,6 +8721,12 @@
"integrity": "sha512-Rd3se6QB+sO1TwqZjscQrurpEPIfO0/yYnSin6Q/rD3mOutHvUrCAhJub3r90uNb+SESBuE0QYoB90YdfatsRg==",
"dev": true
},
"concat-map": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
"integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
"dev": true
},
"concurrently": {
"version": "6.2.1",
"resolved": "https://registry.npmjs.org/concurrently/-/concurrently-6.2.1.tgz",
@ -8683,6 +8824,21 @@
"integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40=",
"dev": true
},
"copyfiles": {
"version": "2.4.1",
"resolved": "https://registry.npmjs.org/copyfiles/-/copyfiles-2.4.1.tgz",
"integrity": "sha512-fereAvAvxDrQDOXybk3Qu3dPbOoKoysFMWtkY3mv5BsL8//OSZVL5DCLYqgRfY5cWirgRzlC+WSrxp6Bo3eNZg==",
"dev": true,
"requires": {
"glob": "^7.0.5",
"minimatch": "^3.0.3",
"mkdirp": "^1.0.4",
"noms": "0.0.0",
"through2": "^2.0.1",
"untildify": "^4.0.0",
"yargs": "^16.1.0"
}
},
"core-util-is": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
@ -8989,12 +9145,11 @@
"integrity": "sha1-g8YK/Fi5xWmXAH7Rp2izqzA6RP4=",
"dev": true
},
"fsevents": {
"version": "2.3.2",
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
"integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
"dev": true,
"optional": true
"fs.realpath": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
"integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
"dev": true
},
"function-bind": {
"version": "1.1.1",
@ -9014,6 +9169,20 @@
"integrity": "sha1-3BXKHGcjh8p2vTesCjlbogQqLCg=",
"dev": true
},
"glob": {
"version": "7.1.7",
"resolved": "https://registry.npmjs.org/glob/-/glob-7.1.7.tgz",
"integrity": "sha512-OvD9ENzPLbegENnYP5UUfJIirTg4+XwMWGaQfQTY0JenxNvvIKP3U3/tAQSPIu/lHxXYSZmpXlUHeqAIdKzBLQ==",
"dev": true,
"requires": {
"fs.realpath": "^1.0.0",
"inflight": "^1.0.4",
"inherits": "2",
"minimatch": "^3.0.4",
"once": "^1.3.0",
"path-is-absolute": "^1.0.0"
}
},
"glob-parent": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz",
@ -9133,6 +9302,16 @@
"integrity": "sha512-t7hjvef/5HEK7RWTdUzVUhl8zkEu+LlaE0IYzdMuvbSDipxBRpOn4Uhw8ZyECEa808iVT8XCjzo6xmYt4CiLZg==",
"dev": true
},
"inflight": {
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
"integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
"dev": true,
"requires": {
"once": "^1.3.0",
"wrappy": "1"
}
},
"inherits": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
@ -9345,15 +9524,6 @@
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
"dev": true
},
"magic-string": {
"version": "0.25.7",
"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.25.7.tgz",
"integrity": "sha512-4CrMT5DOHTDk4HYDlzmwu4FVCcIYI8gauveasrdCu2IKIFOJ3f0v/8MDGJCDL9oD2ppz/Av1b0Nj345H9M+XIA==",
"dev": true,
"requires": {
"sourcemap-codec": "^1.4.4"
}
},
"map-cache": {
"version": "0.2.2",
"resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
@ -9444,6 +9614,15 @@
"mime-db": "1.49.0"
}
},
"minimatch": {
"version": "3.0.4",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
"integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
"dev": true,
"requires": {
"brace-expansion": "^1.1.7"
}
},
"mixin-deep": {
"version": "1.3.2",
"resolved": "https://registry.npmjs.org/mixin-deep/-/mixin-deep-1.3.2.tgz",
@ -9465,6 +9644,12 @@
}
}
},
"mkdirp": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-1.0.4.tgz",
"integrity": "sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==",
"dev": true
},
"morgan": {
"version": "1.10.0",
"resolved": "https://registry.npmjs.org/morgan/-/morgan-1.10.0.tgz",
@ -9543,6 +9728,42 @@
"integrity": "sha512-hZXc7K2e+PgeI1eDBe/10Ard4ekbfrrqG8Ep+8Jmf4JID2bNg7NvCPOZN+kfF574pFQI7mum2AUqDidoKqcTOw==",
"dev": true
},
"noms": {
"version": "0.0.0",
"resolved": "https://registry.npmjs.org/noms/-/noms-0.0.0.tgz",
"integrity": "sha1-2o69nzr51nYJGbJ9nNyAkqczKFk=",
"dev": true,
"requires": {
"inherits": "^2.0.1",
"readable-stream": "~1.0.31"
},
"dependencies": {
"isarray": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
"integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
"dev": true
},
"readable-stream": {
"version": "1.0.34",
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
"integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
"dev": true,
"requires": {
"core-util-is": "~1.0.0",
"inherits": "~2.0.1",
"isarray": "0.0.1",
"string_decoder": "~0.10.x"
}
},
"string_decoder": {
"version": "0.10.31",
"resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
"integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
"dev": true
}
}
},
"normalize-package-data": {
"version": "2.5.0",
"resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.5.0.tgz",
@ -13597,6 +13818,15 @@
"integrity": "sha512-pZAE+FJLoyITytdqK0U5s+FIpjN0JP3OzFi/u8Rx+EV5/W+JTWGXG8xFzevE7AjBfDqHv/8vL8qQsIhHnqRkrA==",
"dev": true
},
"once": {
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
"integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
"dev": true,
"requires": {
"wrappy": "1"
}
},
"opn": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/opn/-/opn-6.0.0.tgz",
@ -13796,23 +14026,13 @@
"integrity": "sha512-TTlYpa+OL+vMMNG24xSlQGEJ3B/RzEfUlLct7b5G/ytav+wPrplCpVMFuwzXbkecJrb6IYo1iFb0S9v37754mg==",
"dev": true
},
"rollup": {
"version": "2.56.3",
"resolved": "https://registry.npmjs.org/rollup/-/rollup-2.56.3.tgz",
"integrity": "sha512-Au92NuznFklgQCUcV96iXlxUbHuB1vQMaH76DHl5M11TotjOHwqk9CwcrT78+Tnv4FN9uTBxq6p4EJoYkpyekg==",
"dev": true,
"requires": {
"fsevents": "~2.3.2"
}
},
"rollup-plugin-dts": {
"rimraf": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/rollup-plugin-dts/-/rollup-plugin-dts-3.0.2.tgz",
"integrity": "sha512-hswlsdWu/x7k5pXzaLP6OvKRKcx8Bzprksz9i9mUe72zvt8LvqAb/AZpzs6FkLgmyRaN8B6rUQOVtzA3yEt9Yw==",
"resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
"integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
"dev": true,
"requires": {
"@babel/code-frame": "^7.12.13",
"magic-string": "^0.25.7"
"glob": "^7.1.3"
}
},
"rxjs": {
@ -14073,12 +14293,6 @@
"integrity": "sha512-cPiFOTLUKvJFIg4SKVScy4ilPPW6rFgMgfuZJPNoDuMs3nC1HbMUycBoJw77xFIp6z1UJQJOfx6C9GMH80DiTw==",
"dev": true
},
"sourcemap-codec": {
"version": "1.4.8",
"resolved": "https://registry.npmjs.org/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz",
"integrity": "sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==",
"dev": true
},
"spawn-command": {
"version": "0.0.2-1",
"resolved": "https://registry.npmjs.org/spawn-command/-/spawn-command-0.0.2-1.tgz",
@ -14278,6 +14492,16 @@
"integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=",
"dev": true
},
"through2": {
"version": "2.0.5",
"resolved": "https://registry.npmjs.org/through2/-/through2-2.0.5.tgz",
"integrity": "sha512-/mrRod8xqpA+IHSLyGCQ2s8SPHiCDEeQJSep1jqLYeEUClOFG2Qsh+4FU6G9VeqpZnGW/Su8LQGc4YKni5rYSQ==",
"dev": true,
"requires": {
"readable-stream": "~2.3.6",
"xtend": "~4.0.1"
}
},
"to-object-path": {
"version": "0.3.0",
"resolved": "https://registry.npmjs.org/to-object-path/-/to-object-path-0.3.0.tgz",
@ -14418,6 +14642,12 @@
}
}
},
"untildify": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/untildify/-/untildify-4.0.0.tgz",
"integrity": "sha512-KK8xQ1mkzZeg9inewmFVDNkg3l5LUhoq9kN6iWYB/CC9YMG8HA+c1Q8HwDe6dEX7kErrEVNVBO3fWsVq5iDgtw==",
"dev": true
},
"upath": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/upath/-/upath-1.2.0.tgz",
@ -14524,6 +14754,18 @@
}
}
},
"wrappy": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
"integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
"dev": true
},
"xtend": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
"integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==",
"dev": true
},
"y18n": {
"version": "5.0.8",
"resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",

17
spine-ts/package.json
View File

@ -6,13 +6,16 @@
"README.md"
],
"scripts": {
"build": "rm -rf build && concurrently \"npm run build:core\" \"npm run build:canvas\" \"npm run build:webgl\" \"npm run build:player\" \"npm run build:threejs\" \"npm run build:modules\"",
"prepublish": "npm run clean && npm run build",
"clean": "npx rimraf spine-core/dist spine-canvas/dist spine-webgl/dist spine-player/dist spine-threejs/dist",
"build": "npm run clean && npm run build:modules && concurrently \"npm run build:core\" \"npm run build:canvas\" \"npm run build:webgl\" \"npm run build:player\" \"npm run build:threejs\"",
"build:modules": "tsc -b -clean && tsc -b",
"build:core": "npx esbuild --bundle spine-core/src/index.ts --tsconfig=spine-core/tsconfig.json --sourcemap --outfile=build/spine-core.js --format=iife --global-name=\"spine\"",
"build:canvas": "npx esbuild --bundle spine-canvas/src/index.ts --tsconfig=spine-canvas/tsconfig.json --sourcemap --outfile=build/spine-canvas.js --format=iife --global-name=\"spine\"",
"build:webgl": "npx esbuild --bundle spine-webgl/src/index.ts --tsconfig=spine-webgl/tsconfig.json --sourcemap --outfile=build/spine-webgl.js --format=iife --global-name=\"spine\"",
"build:player": "npx esbuild --bundle spine-player/src/index.ts --tsconfig=spine-player/tsconfig.json --sourcemap --outfile=build/spine-player.js --format=iife --global-name=\"spine\"",
"build:threejs": "npx esbuild --bundle spine-threejs/src/index.ts --tsconfig=spine-threejs/tsconfig.json --sourcemap --outfile=build/spine-threejs.js --external:three --format=iife --global-name=\"spine\"",
"build:core": "npx esbuild --bundle spine-core/src/index.ts --tsconfig=spine-core/tsconfig.json --sourcemap --outfile=spine-core/dist/iife/spine-core.js --format=iife --global-name=spine",
"build:canvas": "npx esbuild --bundle spine-canvas/src/index.ts --tsconfig=spine-canvas/tsconfig.json --sourcemap --outfile=spine-canvas/dist/iife/spine-canvas.js --format=iife --global-name=spine",
"build:webgl": "npx esbuild --bundle spine-webgl/src/index.ts --tsconfig=spine-webgl/tsconfig.json --sourcemap --outfile=spine-webgl/dist/iife/spine-webgl.js --format=iife --global-name=spine",
"build:player": "npx copyfiles -f spine-player/css/spine-player.css spine-player/dist/ && npx npx esbuild --bundle spine-player/src/index.ts --tsconfig=spine-player/tsconfig.json --sourcemap --outfile=spine-player/dist/iife/spine-player.js --format=iife --global-name=spine",
"build:threejs": "npx esbuild --bundle spine-threejs/src/index.ts --tsconfig=spine-threejs/tsconfig.json --sourcemap --outfile=spine-threejs/dist/iife/spine-threejs.js --external:three --format=iife --global-name=spine",
"minify": "npx esbuild --minify spine-core/dist/iife/spine-core.js --outfile=spine-core/dist/iife/spine-core.min.js",
"dev": "concurrently \"npx live-server --no-browser\" \"npm run dev:canvas\" \"npm run dev:webgl\" \"npm run dev:player\" \"npm run dev:threejs\"",
"dev:canvas": "npm run build:canvas -- --watch",
"dev:webgl": "npm run build:webgl -- --watch",
@ -47,9 +50,11 @@
],
"devDependencies": {
"concurrently": "^6.2.1",
"copyfiles": "^2.4.1",
"esbuild": "^0.12.22",
"live-server": "^1.2.1",
"npx": "^10.2.2",
"rimraf": "^3.0.2",
"typescript": "^4.3.5"
}
}

2
spine-ts/spine-canvas/example/index.html
View File

@ -1,5 +1,5 @@
<html>
<script src="../../build/spine-canvas.js"></script>
<script src="../dist/iife/spine-canvas.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<style>
* {

3
spine-ts/spine-player/css/spine-player.css
View File

@ -1,3 +1,4 @@
/** Player **/
.spine-player {
box-sizing: border-box;
@ -346,4 +347,4 @@
}
.CodeMirror {
height: 100%;
}
}

12
spine-ts/spine-player/example/editor.html
View File

@ -1,19 +1,20 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script src="./external/codemirror.js"></script>
<script src="../../build/spine-player.js"></script>
<script src="../dist/iife/spine-player.js"></script>
<link rel="stylesheet" href="../css/spine-player.css">
<link rel="stylesheet" href="./external/codemirror.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<style>
body {
background: gray;
margin: 0px;
}
body {
background: gray;
margin: 0px;
}
</style>
<body>
@ -23,4 +24,5 @@ body {
new spine.SpinePlayerEditor(document.getElementById("editor"));
</script>
</body>
</html>

12
spine-ts/spine-player/example/example.html
View File

@ -1,17 +1,18 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script src="../../build/spine-player.js"></script>
<script src="../dist/iife/spine-player.js"></script>
<link rel="stylesheet" href="../css/spine-player.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<style>
body {
background: gray;
margin: 0px;
}
body {
background: gray;
margin: 0px;
}
</style>
<body>
@ -69,4 +70,5 @@ body {
});
</script>
</body>
</html>

48
spine-ts/spine-player/example/generator/embedding-generator.js
View File

@ -1,9 +1,9 @@
window.addEventListener("load", function(event) {
window.addEventListener("load", function (event) {
setupDropZone();
});
if (!String.prototype.endsWith) {
String.prototype.endsWith = function(search, this_len) {
String.prototype.endsWith = function (search, this_len) {
if (this_len === undefined || this_len > this.length) {
this_len = this.length;
}
@ -62,8 +62,8 @@ function loadFiles(files) {
for (var i = 0; i < files.length; i++) {
var file = files[i];
var reader = new FileReader();
reader.onload = function(file) {
return function(dataUrl) {
reader.onload = function (file) {
return function (dataUrl) {
console.log("Loaded " + file.name);
dataUrls[file.name] = dataUrl.target.result;
filesToLoad--;
@ -100,8 +100,8 @@ function setupPlayer(dataUrls, jsonFile, skelFile, atlasFile) {
spine = null;
loadCSS(cssUrl, function () {
var playerUrl = "https://esotericsoftware.com/files/spine-player/" + major + "." + minor + "/spine-player.min.js";
//playerUrl = "../../../build/spine-player.js"; // debug
loadJavaScript(playerUrl, function() {
//playerUrl = "../../dist/iife/spine-player.js"; // debug
loadJavaScript(playerUrl, function () {
document.getElementById("sp_generator_editor").classList.remove("sp_generator_hidden");
document.getElementById("sp_generator_drop_zone").classList.add("sp_generator_hidden");
var player = document.getElementById("sp_generator_player");
@ -121,7 +121,7 @@ function setupPlayer(dataUrls, jsonFile, skelFile, atlasFile) {
appState.player = new spine.SpinePlayer(player, config);
}, function() {
}, function () {
showError("Couldn't load script for Spine version " + version + ". Only skeletons with version 3.8+ are supported.");
});
}, function () {
@ -180,7 +180,7 @@ function setupConfigUI() {
noneImage.innerText = "None";
noneImage.selected = true;
backgroundImage.append(noneImage);
for(var data in appState.dataUrls) {
for (var data in appState.dataUrls) {
if (data.toLowerCase().endsWith(".png")) {
var image = document.createElement("option");
image.value = data;
@ -188,7 +188,7 @@ function setupConfigUI() {
backgroundImage.append(image);
}
}
backgroundImage.onchange = function() {
backgroundImage.onchange = function () {
var imageUrl = backgroundImage.value;
if (imageUrl != "none" && !appState.player.assetManager.get(imageUrl)) {
appState.player.assetManager.loadTexture(imageUrl);
@ -201,7 +201,7 @@ function setupConfigUI() {
boundsTable.classList.remove("sp_generator_hidden");
if (appState.player.config.backgroundImage) {
appState.player.config.backgroundImage.url = imageUrl != "none" ? imageUrl: null;
appState.player.config.backgroundImage.url = imageUrl != "none" ? imageUrl : null;
} else {
appState.player.config.backgroundImage = {
url: imageUrl != "none" ? imageUrl : null
@ -266,7 +266,7 @@ function getSkeletonVersion(dataUrls, jsonFile, skelFile) {
var input = new BinaryInput(array);
input.readString();
var version = input.readString();
return version;x
return version; x
}
}
@ -295,7 +295,7 @@ function showError(error) {
function setupDropZone() {
var fileButton = document.getElementById("sp_generator_file_button");
var dropZone = document.getElementById("sp_generator_drop_zone");
dropZone.onclick = function() {
dropZone.onclick = function () {
fileButton.click();
};
dropZone.addEventListener("dragenter", function (event) {
@ -323,27 +323,27 @@ function setupDropZone() {
function generateScript(jsonFile, skelFile, atlasFile, dataUrls) {
var shortVersion = major + "." + minor;
var scriptCode =
'<script src="https://esotericsoftware.com/files/spine-player/' + shortVersion + '/spine-player.min.js"><' + '/script>\n' +
'<link rel="stylesheet" href="https://esotericsoftware.com/files/spine-player/' + shortVersion + '/spine-player.min.css">\n\n' +
'<div id="player-container" style="width: 100%; height: 100vh;"></div>\n\n' +
'<script>\n' +
'new spine.SpinePlayer("player-container", {\n';
'<script src="https://esotericsoftware.com/files/spine-player/' + shortVersion + '/spine-player.min.js"><' + '/script>\n' +
'<link rel="stylesheet" href="https://esotericsoftware.com/files/spine-player/' + shortVersion + '/spine-player.min.css">\n\n' +
'<div id="player-container" style="width: 100%; height: 100vh;"></div>\n\n' +
'<script>\n' +
'new spine.SpinePlayer("player-container", {\n';
if (jsonFile) scriptCode +=
' jsonUrl: "' + jsonFile + '",\n';
' jsonUrl: "' + jsonFile + '",\n';
else scriptCode +=
' skelUrl: "' + skelFile + '",\n';
' skelUrl: "' + skelFile + '",\n';
scriptCode +=
' atlasUrl: "' + atlasFile + '",\n' +
' rawDataURIs: {\n'
' atlasUrl: "' + atlasFile + '",\n' +
' rawDataURIs: {\n'
for (var file in dataUrls)
scriptCode += ' "' + file + '": "' + dataUrls[file] + '",\n';
scriptCode +=
' }\n' +
'});\n' +
'<' + '/script>';
' }\n' +
'});\n' +
'<' + '/script>';
}
var BinaryInput = (function () {

2
spine-ts/spine-threejs/example/index.html
View File

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>spine-threejs</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.js"></script>
<script src="../../build/spine-threejs.js"></script>
<script src="../dist/iife/spine-threejs.js"></script>
<script src="index.js"></script>
</head>
<style>

8
spine-ts/spine-threejs/package.json
View File

@ -29,15 +29,9 @@
"url": "https://github.com/esotericsoftware/spine-runtimes/issues"
},
"homepage": "https://github.com/esotericsoftware/spine-runtimes#readme",
"devDependencies": {
"npx": "^10.2.2",
"rollup": "^2.56.2",
"rollup-plugin-dts": "^3.0.2",
"typescript": "^4.3.5"
},
"dependencies": {
"@types/three": "^0.131.0",
"three": "^0.132.0",
"@esotericsoftware/spine-core": "4.0.2"
}
}
}

BIN
spine-ts/spine-ts.zip Normal file
View File

Binary file not shown.

10
spine-ts/spine-webgl/demos/additiveblending.html
View File

@ -2,18 +2,20 @@
<meta charset="UTF-8">
<title>IK Constraints - Spine Demo</title>
<link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="utils.js"></script>
<script src="additiveblending.js"></script>
<body style="margin: 0; padding: 0;">
<div style="margin: 0 auto;" class="aspect standalone"></div>
<div style="margin: 0 auto;" class="aspect standalone"></div>
<script>
<script>
spineDemos.init();
spineDemos.addDemo(additiveBlendingDemo, document.getElementsByClassName("aspect")[0]);
</script>
</script>
</body>
</html>

24
spine-ts/spine-webgl/demos/clipping.html
View File

@ -2,23 +2,25 @@
<meta charset="UTF-8">
<title>Clipping - Spine Demo</title>
<link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="utils.js"></script>
<script src="clipping.js"></script>
<body>
<center>
<div class="aspect standalone"></div>
<div id="clipping-playbutton"></div>
<div id="clipping-timeline" class="slider"></div>
<input id="clipping-drawtriangles" type="checkbox"></input> Draw triangles
</center>
<center>
<div class="aspect standalone"></div>
<div id="clipping-playbutton"></div>
<div id="clipping-timeline" class="slider"></div>
<input id="clipping-drawtriangles" type="checkbox"></input> Draw triangles
</center>
<script>
spineDemos.init();
spineDemos.addDemo(clippingDemo, document.getElementsByClassName("aspect")[0]);
</script>
<script>
spineDemos.init();
spineDemos.addDemo(clippingDemo, document.getElementsByClassName("aspect")[0]);
</script>
</body>
</html>

708
spine-ts/spine-webgl/demos/demos.html
View File

@ -1,53 +1,382 @@
<!DOCTYPE html><html><head>
<meta charset="utf-8">
<title>Spine: Demos</title>
<link rel="stylesheet" href="demos.css">
<!DOCTYPE html>
<html>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="../../build/spine-webgl.js"></script>
<head>
<meta charset="utf-8">
<title>Spine: Demos</title>
<link rel="stylesheet" href="demos.css">
<script src="utils.js"></script>
<script src="spritesheets.js"></script>
<script src="imagechanges.js"></script>
<script src="transitions.js"></script>
<script src="meshes.js"></script>
<script src="skins.js"></script>
<script src="hoverboard.js"></script>
<script src="vine.js"></script>
<script src="clipping.js"></script>
<script src="stretchyman.js"></script>
<script src="tank.js"></script>
<script src="transforms.js"></script>
<script src="additiveblending.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="demos.js"></script>
<script src="utils.js"></script>
<script src="spritesheets.js"></script>
<script src="imagechanges.js"></script>
<script src="transitions.js"></script>
<script src="meshes.js"></script>
<script src="skins.js"></script>
<script src="hoverboard.js"></script>
<script src="vine.js"></script>
<script src="clipping.js"></script>
<script src="stretchyman.js"></script>
<script src="tank.js"></script>
<script src="transforms.js"></script>
<script src="additiveblending.js"></script>
<script src="demos.js"></script>
</head>
<body>
<div id="demos" class="demos-page">
<div class="demo">
<div>
<div id="demos" class="demos-page">
<div class="demo">
<div>
<h2 id="Spine-versus-sprites-sheets"><a href="#Spine-versus-sprite-sheets">Spine versus sprite sheets</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<div class="resize"></div>
<div id="spritesheets-overlay" class="overlay-hide">
<div class="overlay-label" style="width:50%"><b>Spine</b><br><span class="hide-small">All animations, all frame rates<br></span><b>0.18 MB</b></div>
<div class="overlay-label" style="left:50%;width:50%"><b>Sprite sheet</b><br><span class="hide-small">1 second of animation @ 30FPS<br></span><b>3.39 MB = 18x larger!</b></div>
<div>
<h2 id="Spine-versus-sprites-sheets"><a href="#Spine-versus-sprite-sheets">Spine versus sprite sheets</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<div class="resize"></div>
<div id="spritesheets-overlay" class="overlay-hide">
<div class="overlay-label" style="width:50%"><b>Spine</b><br><span class="hide-small">All animations, all frame rates<br></span><b>0.18 MB</b></div>
<div class="overlay-label" style="left:50%;width:50%"><b>Sprite sheet</b><br><span class="hide-small">1 second of animation @ 30FPS<br></span><b>3.39 MB = 18x larger!</b></div>
</div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="padding-bottom:0px">
<div class="control-label"><span>Animation speed</span></div>
<div class="slidervalue" id="spritesheets-timeslider-label">&nbsp;</div>
<div class="slider filled" id="spritesheets-timeslider"></div>
</div>
<div class="control" style="margin:0">
<div>
<button id="spritesheets-roar" class="btn unit-50">Roar</button>
<button id="spritesheets-jump" class="btn unit-50">Jump</button>
</div>
</div>
</div>
</div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="padding-bottom:0px">
<div class="control-label"><span>Animation speed</span></div>
<div class="slidervalue" id="spritesheets-timeslider-label">&nbsp;</div>
<div class="slider filled" id="spritesheets-timeslider"></div>
</div>
</div>
<div class="demo">
<div>
<div>
<h2 id="Spine-with-frame-based-animation"><a href="#Spine-with-frame-based-animation">Spine with frame-based animation</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<table class="timeline layout">
<tr>
<td>
<div id="imagechanges-playbutton" class="pause"></div>
</td>
<td>
<div class="slider" id="imagechanges-timeline"></div>
</td>
</tr>
</table>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control">
<label>Select a skeleton:</label>
<div class="select-container">
<select id="imagechanges-skeleton" size="2"></select>
</div>
</div>
</div>
<div class="control" style="margin:0">
<div>
<button id="spritesheets-roar" class="btn unit-50">Roar</button>
<button id="spritesheets-jump" class="btn unit-50">Jump</button>
</div>
</div>
</div>
</div>
<div class="demo">
<div>
<div>
<h2 id="Transitions-and-layering"><a href="#Transitions-and-layering">Transitions and layering</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<div id="transitions-overlay" class="overlay-hide">
<div class="overlay-label" style="left:25%;"><b>Smooth</b></div>
<div class="overlay-label" style="right:30%;"><b>Abrupt</b></div>
</div>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="margin:0">
<div>
<button id="transitions-die" class="btn unit-50">Die</button>
</div>
</div>
<div class="control" style="padding-bottom:0px">
<div class="control-label"><span>Animation speed</span></div>
<div class="slidervalue" id="transitions-timeslider-label">&nbsp;</div>
<div class="slider filled" id="transitions-timeslider"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="demo" id="demo-mesh-deformations">
<div>
<div>
<h2 id="Mesh-deformations"><a href="#Mesh-deformations">Mesh deformation</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<table class="timeline layout">
<tr>
<td>
<div id="meshes-playbutton" class="pause"></div>
</td>
<td>
<div class="slider" id="meshes-timeline"></div>
</td>
</tr>
</table>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="padding-bottom:0">
<label>Select a character:</label>
<div class="select-container">
<select id="meshes-skeleton" size="3"></select>
</div>
</div>
<div class="control" style="width:50%; display:inline-block; float:left; padding-bottom:6px">
<div class="checkbox">
<input type="checkbox" id="meshes-drawbonescheckbox" name="check">
<label for="meshes-drawbonescheckbox"></label>
</div>
<span style="cursor:pointer" onclick="$('#meshes-drawbonescheckbox').click()">Show bones</span>
</div>
<div class="control" style="width:50%; display:inline-block; padding-bottom:6px">
<div class="checkbox">
<input type="checkbox" id="meshes-drawmeshtrianglescheckbox" name="check">
<label for="meshes-drawmeshtrianglescheckbox"></label>
</div>
<span style="cursor:pointer" onclick="$('#meshes-drawmeshtrianglescheckbox').click()">Show triangles</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="demo" id="demo-skins">
<div>
<div>
<h2 id="Skins"><a href="#Skins">Skins</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control">
<label>Select a skin:</label>
<div class="select-container">
<select id="skins-skin"></select>
</div>
</div>
<div class="control" style="margin:0">
<div>
<button id="skins-randomizeattachments" class="btn unit-50">Randomize</button>
<button id="skins-swingsword" class="btn unit-50">Swing Sword</button>
</div>
</div>
<div class="control" style="padding-bottom:6px; padding-top:10px">
<div class="checkbox">
<input type="checkbox" id="skins-randomizeskins" name="check" checked="true">
<label for="skins-randomizeskins"></label>
</div>
<span style="cursor:pointer" onclick="$('#skins-randomizeskins').click()">Random skins</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="demo" id="demo-ik-constraint">
<div>
<div>
<h2 id="Inverse-kinematics"><a href="#Inverse-kinematics">Inverse kinematics</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="margin:0">
<div>
<button id="hoverboard-shoot" class="btn unit-50">Shoot</button>
<button id="hoverboard-jump" class="btn unit-50">Jump</button>
</div>
</div>
<div class="control" style="width:50%; display:inline-block; float:left; padding-bottom:6px">
<div class="checkbox">
<input type="checkbox" id="hoverboard-aim" name="check">
<label for="hoverboard-aim"></label>
</div>
<span style="cursor:pointer" onclick="$('#hoverboard-aim').click()">Aim</span>
</div>
<div class="control" style="width:50%; display:inline-block; padding-bottom:6px">
<div class="checkbox">
<input type="checkbox" id="hoverboard-drawbones" name="check">
<label for="hoverboard-drawbones"></label>
</div>
<span style="cursor:pointer" onclick="$('#hoverboard-drawbones').click()">Show bones</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="demo" id="demo-additive-blending">
<div>
<div>
<h2 id="Additive-blending"><a href="#Additive-blending">Additive Blending</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="padding-bottom:6px">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="demo" id="demo-path-constraint">
<div>
<div>
<h2 id="Path-constraints"><a href="#Path-constraints">Path constraints</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<table class="timeline layout">
<tr>
<td>
<div id="vine-playbutton" class="pause"></div>
</td>
<td>
<div class="slider" id="vine-timeline"></div>
</td>
</tr>
</table>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="padding-bottom:6px">
<div class="checkbox">
<input type="checkbox" id="vine-drawbones" name="check">
<label for="vine-drawbones"></label>
</div>
<span style="cursor:pointer" onclick="$('#vine-drawbones').click()">Show bones &amp; paths</span>
</div>
</div>
</div>
</div>
<div>
<div class="demo-container">
<div class="aspect"></div>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="padding-bottom:6px">
<div class="checkbox">
<input type="checkbox" id="stretchyman-drawbones" name="check">
<label for="stretchyman-drawbones"></label>
</div>
<span style="cursor:pointer" onclick="$('#stretchyman-drawbones').click()">Show bones &amp; paths</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="demo" id="demo-clipping">
<div>
<div>
<h2 id="Clipping"><a href="#Clipping">Clipping</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<table class="timeline layout">
<tr>
<td>
<div id="clipping-playbutton" class="pause"></div>
</td>
<td>
<div class="slider" id="clipping-timeline"></div>
</td>
</tr>
</table>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="padding-bottom:6px">
<div class="checkbox">
<input type="checkbox" id="clipping-drawtriangles" name="check">
<label for="clipping-drawtriangles"></label>
</div>
<span style="cursor:pointer" onclick="$('#clipping-drawtriangles').click()">Show triangles</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="demo" id="demo-transform-constraint">
<div>
<div>
<h2 id="Transform-constraints"><a href="#Transform-constraints">Transform constraints</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<table class="timeline layout">
<tr>
<td>
<div id="tank-playbutton" class="pause"></div>
</td>
<td>
<div class="slider" id="tank-timeline"></div>
</td>
</tr>
</table>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="padding-bottom:6px">
<div class="checkbox">
<input type="checkbox" id="tank-drawbones" name="check">
<label for="tank-drawbones" id="tank-drawbones-label"></label>
</div>
<span style="cursor:pointer" onclick="$('#tank-drawbones').click()">Show bones &amp; paths</span>
</div>
</div>
</div>
</div>
<div>
<div class="demo-container">
<div class="aspect"></div>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="padding-bottom:0px">
<div class="control-label"><span>Rotation offset</span></div>
<div class="slidervalue" id="transforms-rotationoffset-label">&nbsp;</div>
<div class="slider filled" id="transforms-rotationoffset"></div>
</div>
<div class="control" style="padding-bottom:0px">
<div class="control-label"><span>Translation mix</span></div>
<div class="slidervalue" id="transforms-translationmix-label">&nbsp;</div>
<div class="slider filled" id="transforms-translationmix"></div>
</div>
</div>
</div>
@ -55,299 +384,6 @@
</div>
</div>
</div>
<div class="demo">
<div>
<div>
<h2 id="Spine-with-frame-based-animation"><a href="#Spine-with-frame-based-animation">Spine with frame-based animation</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<table class="timeline layout"><tr>
<td><div id="imagechanges-playbutton" class="pause"></div></td>
<td><div class="slider" id="imagechanges-timeline"></div></td>
</tr></table>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control">
<label>Select a skeleton:</label>
<div class="select-container">
<select id="imagechanges-skeleton" size="2"></select>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="demo">
<div>
<div>
<h2 id="Transitions-and-layering"><a href="#Transitions-and-layering">Transitions and layering</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<div id="transitions-overlay" class="overlay-hide">
<div class="overlay-label" style="left:25%;"><b>Smooth</b></div>
<div class="overlay-label" style="right:30%;"><b>Abrupt</b></div>
</div>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="margin:0">
<div>
<button id="transitions-die" class="btn unit-50">Die</button>
</div>
</div>
<div class="control" style="padding-bottom:0px">
<div class="control-label"><span>Animation speed</span></div>
<div class="slidervalue" id="transitions-timeslider-label">&nbsp;</div>
<div class="slider filled" id="transitions-timeslider"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="demo" id="demo-mesh-deformations">
<div>
<div>
<h2 id="Mesh-deformations"><a href="#Mesh-deformations">Mesh deformation</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<table class="timeline layout"><tr>
<td><div id="meshes-playbutton" class="pause"></div></td>
<td><div class="slider" id="meshes-timeline"></div></td>
</tr></table>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="padding-bottom:0">
<label>Select a character:</label>
<div class="select-container">
<select id="meshes-skeleton" size="3"></select>
</div>
</div>
<div class="control" style="width:50%; display:inline-block; float:left; padding-bottom:6px">
<div class="checkbox">
<input type="checkbox" id="meshes-drawbonescheckbox" name="check">
<label for="meshes-drawbonescheckbox"></label>
</div>
<span style="cursor:pointer" onclick="$('#meshes-drawbonescheckbox').click()">Show bones</span>
</div>
<div class="control" style="width:50%; display:inline-block; padding-bottom:6px">
<div class="checkbox">
<input type="checkbox" id="meshes-drawmeshtrianglescheckbox" name="check">
<label for="meshes-drawmeshtrianglescheckbox"></label>
</div>
<span style="cursor:pointer" onclick="$('#meshes-drawmeshtrianglescheckbox').click()">Show triangles</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="demo" id="demo-skins">
<div>
<div>
<h2 id="Skins"><a href="#Skins">Skins</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control">
<label>Select a skin:</label>
<div class="select-container">
<select id="skins-skin"></select>
</div>
</div>
<div class="control" style="margin:0">
<div>
<button id="skins-randomizeattachments" class="btn unit-50">Randomize</button>
<button id="skins-swingsword" class="btn unit-50">Swing Sword</button>
</div>
</div>
<div class="control" style="padding-bottom:6px; padding-top:10px">
<div class="checkbox">
<input type="checkbox" id="skins-randomizeskins" name="check" checked="true">
<label for="skins-randomizeskins"></label>
</div>
<span style="cursor:pointer" onclick="$('#skins-randomizeskins').click()">Random skins</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="demo" id="demo-ik-constraint">
<div>
<div>
<h2 id="Inverse-kinematics"><a href="#Inverse-kinematics">Inverse kinematics</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="margin:0">
<div>
<button id="hoverboard-shoot" class="btn unit-50">Shoot</button>
<button id="hoverboard-jump" class="btn unit-50">Jump</button>
</div>
</div>
<div class="control" style="width:50%; display:inline-block; float:left; padding-bottom:6px">
<div class="checkbox">
<input type="checkbox" id="hoverboard-aim" name="check">
<label for="hoverboard-aim"></label>
</div>
<span style="cursor:pointer" onclick="$('#hoverboard-aim').click()">Aim</span>
</div>
<div class="control" style="width:50%; display:inline-block; padding-bottom:6px">
<div class="checkbox">
<input type="checkbox" id="hoverboard-drawbones" name="check">
<label for="hoverboard-drawbones"></label>
</div>
<span style="cursor:pointer" onclick="$('#hoverboard-drawbones').click()">Show bones</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="demo" id="demo-additive-blending">
<div>
<div>
<h2 id="Additive-blending"><a href="#Additive-blending">Additive Blending</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="padding-bottom:6px">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="demo" id="demo-path-constraint">
<div>
<div>
<h2 id="Path-constraints"><a href="#Path-constraints">Path constraints</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<table class="timeline layout"><tr>
<td><div id="vine-playbutton" class="pause"></div></td>
<td><div class="slider" id="vine-timeline"></div></td>
</tr></table>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="padding-bottom:6px">
<div class="checkbox">
<input type="checkbox" id="vine-drawbones" name="check">
<label for="vine-drawbones"></label>
</div>
<span style="cursor:pointer" onclick="$('#vine-drawbones').click()">Show bones &amp; paths</span>
</div>
</div>
</div>
</div>
<div>
<div class="demo-container">
<div class="aspect"></div>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="padding-bottom:6px">
<div class="checkbox">
<input type="checkbox" id="stretchyman-drawbones" name="check">
<label for="stretchyman-drawbones"></label>
</div>
<span style="cursor:pointer" onclick="$('#stretchyman-drawbones').click()">Show bones &amp; paths</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="demo" id="demo-clipping">
<div>
<div>
<h2 id="Clipping"><a href="#Clipping">Clipping</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<table class="timeline layout"><tr>
<td><div id="clipping-playbutton" class="pause"></div></td>
<td><div class="slider" id="clipping-timeline"></div></td>
</tr></table>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="padding-bottom:6px">
<div class="checkbox">
<input type="checkbox" id="clipping-drawtriangles" name="check">
<label for="clipping-drawtriangles"></label>
</div>
<span style="cursor:pointer" onclick="$('#clipping-drawtriangles').click()">Show triangles</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="demo" id="demo-transform-constraint">
<div>
<div>
<h2 id="Transform-constraints"><a href="#Transform-constraints">Transform constraints</a></h2>
<div class="demo-container">
<div class="aspect"></div>
<table class="timeline layout"><tr>
<td><div id="tank-playbutton" class="pause"></div></td>
<td><div class="slider" id="tank-timeline"></div></td>
</tr></table>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="padding-bottom:6px">
<div class="checkbox">
<input type="checkbox" id="tank-drawbones" name="check">
<label for="tank-drawbones" id="tank-drawbones-label"></label>
</div>
<span style="cursor:pointer" onclick="$('#tank-drawbones').click()">Show bones &amp; paths</span>
</div>
</div>
</div>
</div>
<div>
<div class="demo-container">
<div class="aspect"></div>
<div class="resize"></div>
</div>
<div class="demo-text">
<div class="controls">
<div class="control" style="padding-bottom:0px">
<div class="control-label"><span>Rotation offset</span></div>
<div class="slidervalue" id="transforms-rotationoffset-label">&nbsp;</div>
<div class="slider filled" id="transforms-rotationoffset"></div>
</div>
<div class="control" style="padding-bottom:0px">
<div class="control-label"><span>Translation mix</span></div>
<div class="slidervalue" id="transforms-translationmix-label">&nbsp;</div>
<div class="slider filled" id="transforms-translationmix"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body></html>
</body>
</html>

26
spine-ts/spine-webgl/demos/hoverboard.html
View File

@ -2,24 +2,26 @@
<meta charset="UTF-8">
<title>IK Constraints - Spine Demo</title>
<link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="utils.js"></script>
<script src="hoverboard.js"></script>
<body>
<center>
<div class="aspect standalone"></div>
<input id="hoverboard-drawbones" type="checkbox"></input> Display Bones<br>
<input id="hoverboard-aim" type="checkbox"></input> Aim<br>
<button id="hoverboard-shoot">Shoot</button>
<button id="hoverboard-jump">Jump</button>
</center>
<center>
<div class="aspect standalone"></div>
<input id="hoverboard-drawbones" type="checkbox"></input> Display Bones<br>
<input id="hoverboard-aim" type="checkbox"></input> Aim<br>
<button id="hoverboard-shoot">Shoot</button>
<button id="hoverboard-jump">Jump</button>
</center>
<script>
spineDemos.init();
spineDemos.addDemo(hoverboardDemo, document.getElementsByClassName("aspect")[0]);
</script>
<script>
spineDemos.init();
spineDemos.addDemo(hoverboardDemo, document.getElementsByClassName("aspect")[0]);
</script>
</body>
</html>

24
spine-ts/spine-webgl/demos/imagechanges.html
View File

@ -2,23 +2,25 @@
<meta charset="UTF-8">
<title>Frame-by-frame - Spine Demo</title>
<link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="utils.js"></script>
<script src="imagechanges.js"></script>
<body>
<center>
<div class="aspect standalone"></div>
<div id="imagechanges-timeline" class="slider"></div>
<input id="imagechanges-playbutton" type="button" value="Pause"></input><br>
<select id="imagechanges-skeleton" size="2"></select>
</center>
<center>
<div class="aspect standalone"></div>
<div id="imagechanges-timeline" class="slider"></div>
<input id="imagechanges-playbutton" type="button" value="Pause"></input><br>
<select id="imagechanges-skeleton" size="2"></select>
</center>
<script>
spineDemos.init();
spineDemos.addDemo(imageChangesDemo, document.getElementsByClassName("aspect")[0]);
</script>
<script>
spineDemos.init();
spineDemos.addDemo(imageChangesDemo, document.getElementsByClassName("aspect")[0]);
</script>
</body>
</html>

24
spine-ts/spine-webgl/demos/meshes.html
View File

@ -2,25 +2,27 @@
<meta charset="UTF-8">
<title>Meshes - Spine Demo</title>
<link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="utils.js"></script>
<script src="meshes.js"></script>
<body>
<center>
<div class="aspect standalone"></div>
<div id="meshes-timeline" class="slider"></div>
<input id="meshes-playbutton" type="button" value="Pause"></input><br>
<select id="meshes-skeleton" size="3"></select><br>
<input type="checkbox" id="meshes-drawbonescheckbox" style="color: #fff;"></input> Draw bones<br>
<input type="checkbox" id="meshes-drawmeshtrianglescheckbox" style="color: #fff;"></input> Draw triangles<br>
</center>
<center>
<div class="aspect standalone"></div>
<div id="meshes-timeline" class="slider"></div>
<input id="meshes-playbutton" type="button" value="Pause"></input><br>
<select id="meshes-skeleton" size="3"></select><br>
<input type="checkbox" id="meshes-drawbonescheckbox" style="color: #fff;"></input> Draw bones<br>
<input type="checkbox" id="meshes-drawmeshtrianglescheckbox" style="color: #fff;"></input> Draw triangles<br>
</center>
<script>
<script>
spineDemos.init();
spineDemos.addDemo(meshesDemo, document.getElementsByClassName("aspect")[0]);
</script>
</script>
</body>
</html>

26
spine-ts/spine-webgl/demos/skins.html
View File

@ -2,24 +2,26 @@
<meta charset="UTF-8">
<title>Skins - Spine Demo</title>
<link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="utils.js"></script>
<script src="skins.js"></script>
<body>
<center>
<div class="aspect standalone"></div>
<select id="skins-skin"></select><br>
<button id="skins-randomizeattachments">Random Attachments</button>
<button id="skins-swingsword">Swing Sword</button><br>
<input id="skins-randomizeskins" type="checkbox" checked=true></input> Randomize skin
</center>
<center>
<div class="aspect standalone"></div>
<select id="skins-skin"></select><br>
<button id="skins-randomizeattachments">Random Attachments</button>
<button id="skins-swingsword">Swing Sword</button><br>
<input id="skins-randomizeskins" type="checkbox" checked=true></input> Randomize skin
</center>
<script>
spineDemos.init();
spineDemos.addDemo(skinsDemo, document.getElementsByClassName("aspect")[0]);
</script>
<script>
spineDemos.init();
spineDemos.addDemo(skinsDemo, document.getElementsByClassName("aspect")[0]);
</script>
</body>
</html>

26
spine-ts/spine-webgl/demos/spritesheets.html
View File

@ -2,24 +2,26 @@
<meta charset="UTF-8">
<title>Spine vs Sprite Sheets - Spine Demo</title>
<link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="utils.js"></script>
<script src="spritesheets.js"></script>
<body>
<center>
<div class="aspect standalone"></div>
<button id="spritesheets-roar">Roar</button>
<button id="spritesheets-jump">Jump</button><br>
Time multiplier
<div id="spritesheets-timeslider" class="slider filled"></div>
</center>
<center>
<div class="aspect standalone"></div>
<button id="spritesheets-roar">Roar</button>
<button id="spritesheets-jump">Jump</button><br>
Time multiplier
<div id="spritesheets-timeslider" class="slider filled"></div>
</center>
<script>
spineDemos.init();
spineDemos.addDemo(spritesheetsDemo, document.getElementsByClassName("aspect")[0]);
</script>
<script>
spineDemos.init();
spineDemos.addDemo(spritesheetsDemo, document.getElementsByClassName("aspect")[0]);
</script>
</body>
</html>

20
spine-ts/spine-webgl/demos/stretchyman.html
View File

@ -2,21 +2,23 @@
<meta charset="UTF-8">
<title>Strechyman - Spine Demo</title>
<link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="utils.js"></script>
<script src="stretchyman.js"></script>
<body>
<center>
<div class="aspect standalone"></div>
<input id="stretchyman-drawbones" type="checkbox"></input> Display bones
</center>
<center>
<div class="aspect standalone"></div>
<input id="stretchyman-drawbones" type="checkbox"></input> Display bones
</center>
<script>
spineDemos.init();
spineDemos.addDemo(stretchymanDemo, document.getElementsByClassName("aspect")[0]);
</script>
<script>
spineDemos.init();
spineDemos.addDemo(stretchymanDemo, document.getElementsByClassName("aspect")[0]);
</script>
</body>
</html>

24
spine-ts/spine-webgl/demos/tank.html
View File

@ -2,23 +2,25 @@
<meta charset="UTF-8">
<title>Tank - Spine Demo</title>
<link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="utils.js"></script>
<script src="tank.js"></script>
<body>
<center>
<div class="aspect standalone"></div>
<div id="tank-timeline" class="slider"></div>
<input id="tank-playbutton" type="button" value="Pause"></input><br>
<input id="tank-drawbones" type="checkbox"></input> Display bones
</center>
<center>
<div class="aspect standalone"></div>
<div id="tank-timeline" class="slider"></div>
<input id="tank-playbutton" type="button" value="Pause"></input><br>
<input id="tank-drawbones" type="checkbox"></input> Display bones
</center>
<script>
spineDemos.init();
spineDemos.addDemo(tankDemo, document.getElementsByClassName("aspect")[0]);
</script>
<script>
spineDemos.init();
spineDemos.addDemo(tankDemo, document.getElementsByClassName("aspect")[0]);
</script>
</body>
</html>

26
spine-ts/spine-webgl/demos/transforms.html
View File

@ -2,24 +2,26 @@
<meta charset="UTF-8">
<title>Transform Constraints - Spine Demo</title>
<link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="utils.js"></script>
<script src="transforms.js"></script>
<body>
<center>
<div class="aspect standalone"></div>
Rotation offset
<div id="transforms-rotationoffset" class="slider filled"></div><br>
Translation mix
<div id="transforms-translationmix" class="slider filled"></div>
</center>
<center>
<div class="aspect standalone"></div>
Rotation offset
<div id="transforms-rotationoffset" class="slider filled"></div><br>
Translation mix
<div id="transforms-translationmix" class="slider filled"></div>
</center>
<script>
spineDemos.init();
spineDemos.addDemo(transformsDemo, document.getElementsByClassName("aspect")[0]);
</script>
<script>
spineDemos.init();
spineDemos.addDemo(transformsDemo, document.getElementsByClassName("aspect")[0]);
</script>
</body>
</html>

24
spine-ts/spine-webgl/demos/transitions.html
View File

@ -2,23 +2,25 @@
<meta charset="UTF-8">
<title>Transitions - Spine Demo</title>
<link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="utils.js"></script>
<script src="transitions.js"></script>
<body>
<center>
<div class="aspect standalone"></div>
Time multiplier
<div id="transitions-timeslider" class="slider filled"></div><br>
<button id="transitions-die">Die</button>
</center>
<center>
<div class="aspect standalone"></div>
Time multiplier
<div id="transitions-timeslider" class="slider filled"></div><br>
<button id="transitions-die">Die</button>
</center>
<script>
spineDemos.init();
spineDemos.addDemo(transitionsDemo, document.getElementsByClassName("aspect")[0]);
</script>
<script>
spineDemos.init();
spineDemos.addDemo(transitionsDemo, document.getElementsByClassName("aspect")[0]);
</script>
</body>
</html>

24
spine-ts/spine-webgl/demos/vine.html
View File

@ -2,23 +2,25 @@
<meta charset="UTF-8">
<title>Path Constraints - Spine Demo</title>
<link rel="stylesheet" href="demos.css">
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="utils.js"></script>
<script src="vine.js"></script>
<body>
<center>
<div class="aspect standalone"></div>
<div id="vine-timeline" class="slider"></div>
<input id="vine-playbutton" type="button" value="Pause"></input><br>
<input id="vine-drawbones" type="checkbox"></input> Display bones &amp; path
</center>
<center>
<div class="aspect standalone"></div>
<div id="vine-timeline" class="slider"></div>
<input id="vine-playbutton" type="button" value="Pause"></input><br>
<input id="vine-drawbones" type="checkbox"></input> Display bones &amp; path
</center>
<script>
spineDemos.init();
spineDemos.addDemo(vineDemo, document.getElementsByClassName("aspect")[0]);
</script>
<script>
spineDemos.init();
spineDemos.addDemo(vineDemo, document.getElementsByClassName("aspect")[0]);
</script>
</body>
</html>

2
spine-ts/spine-webgl/example/barebones.html
View File

@ -1,5 +1,5 @@
<html>
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<style>
* {
margin: 0;

2
spine-ts/spine-webgl/example/index.html
View File

@ -1,5 +1,5 @@
<html>
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<style>
* {

2
spine-ts/spine-webgl/tests/test-additive-animation-blending.html
View File

@ -2,7 +2,7 @@
<html>
<head>
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<style>
input,

2
spine-ts/spine-webgl/tests/test-atlas-loading.html
View File

@ -1,7 +1,7 @@
<html>
<body>
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<canvas width="640" height="480"></canvas>
</body>
<script>

2
spine-ts/spine-webgl/tests/test-binary.html
View File

@ -1,5 +1,5 @@
<html>
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<style>
* {

2
spine-ts/spine-webgl/tests/test-mix-and-match.html
View File

@ -1,5 +1,5 @@
<html>
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<style>
* {

2
spine-ts/spine-webgl/tests/test-pma-tintblack.html
View File

@ -1,5 +1,5 @@
<html>
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<style>
* {

2
spine-ts/spine-webgl/tests/test-rig.html
View File

@ -1,5 +1,5 @@
<html>
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<style>
* {

2
spine-ts/spine-webgl/tests/test-simple.html
View File

@ -1,5 +1,5 @@
<html>
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<style>
* {
margin: 0;

2
spine-ts/spine-webgl/tests/test-skins.html
View File

@ -1,5 +1,5 @@
<html>
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<style>
* {

2
spine-ts/spine-webgl/tests/test-slot-range.html
View File

@ -1,7 +1,7 @@
<html>
<body>
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<canvas width="640" height="480"></canvas>
</body>
<script>

2
spine-ts/spine-webgl/tests/test.html
View File

@ -1,5 +1,5 @@
<html>
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<style>
* {

2
spine-ts/spine-webgl/tests/test2.html
View File

@ -1,5 +1,5 @@
<html>
<script src="../../build/spine-webgl.js"></script>
<script src="../dist/iife/spine-webgl.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<style>
* {