mirror of
https://github.com/EsotericSoftware/spine-runtimes.git
synced 2026-02-11 09:38:44 +08:00
[ts] Merged with master.
This commit is contained in:
commit
1bb212a110
1
spine-ts/build/spine-all.d.ts
vendored
1
spine-ts/build/spine-all.d.ts
vendored
@ -1626,6 +1626,7 @@ declare module spine {
|
||||
animation: string;
|
||||
imagesPath: string;
|
||||
atlasPages: string[];
|
||||
atlasPagesContent: string[];
|
||||
skin: string;
|
||||
loop: boolean;
|
||||
scale: number;
|
||||
|
||||
@ -8447,13 +8447,25 @@ var spine;
|
||||
this.debugShader = spine.webgl.Shader.newColored(gl);
|
||||
this.debugRenderer = new spine.webgl.SkeletonDebugRenderer(gl);
|
||||
this.shapes = new spine.webgl.ShapeRenderer(gl);
|
||||
var assets = this.assetManager = new spine.webgl.AssetManager(gl);
|
||||
if (!config.atlasContent)
|
||||
var assets = this.assetManager = new spine.webgl.AssetManager(gl, config.imagesPath ? config.imagesPath : "");
|
||||
if (!config.atlasContent) {
|
||||
assets.loadText(config.atlas);
|
||||
if (!config.jsonContent)
|
||||
}
|
||||
if (!config.jsonContent) {
|
||||
assets.loadText(config.json);
|
||||
}
|
||||
if (config.atlasPages == null) {
|
||||
assets.loadTexture(config.atlas.replace(".atlas", ".png"));
|
||||
if (config.atlas) {
|
||||
var atlasPage = config.atlas.replace(".atlas", ".png");
|
||||
if (atlasPage.lastIndexOf(config.imagesPath) == 0) {
|
||||
atlasPage = atlasPage.substr(config.imagesPath.length);
|
||||
}
|
||||
assets.loadTexture(atlasPage);
|
||||
}
|
||||
else {
|
||||
var firstLine = config.atlasContent.trim().split("\n")[0];
|
||||
assets.loadTexture(firstLine);
|
||||
}
|
||||
}
|
||||
else {
|
||||
for (var i = 0; i < config.atlasPages.length; i++) {
|
||||
@ -8484,14 +8496,25 @@ var spine;
|
||||
if (!config.backgroundColor)
|
||||
config.backgroundColor = "#555555";
|
||||
if (!config.imagesPath) {
|
||||
var index = config.atlas.lastIndexOf("/");
|
||||
if (index != -1) {
|
||||
config.imagesPath = config.atlas.substr(0, index) + "/";
|
||||
if (config.atlas) {
|
||||
var index = config.atlas.lastIndexOf("/");
|
||||
if (index != -1) {
|
||||
config.imagesPath = config.atlas.substr(0, index) + "/";
|
||||
}
|
||||
else {
|
||||
config.imagesPath = "";
|
||||
}
|
||||
}
|
||||
else {
|
||||
config.imagesPath = "";
|
||||
}
|
||||
}
|
||||
if (config.json && config.json.lastIndexOf(config.imagesPath) == 0) {
|
||||
config.json = config.json.substr(config.imagesPath.length);
|
||||
}
|
||||
if (config.atlas && config.atlas.lastIndexOf(config.imagesPath) == 0) {
|
||||
config.atlas = config.atlas.substr(config.imagesPath.length);
|
||||
}
|
||||
if (!config.premultipliedAlpha === undefined)
|
||||
config.premultipliedAlpha = false;
|
||||
if (!config.debug === undefined)
|
||||
@ -8515,7 +8538,7 @@ var spine;
|
||||
}
|
||||
var atlasContent = config.atlasContent === undefined ? this.assetManager.get(this.config.atlas) : config.atlasContent;
|
||||
var atlas = new spine.TextureAtlas(atlasContent, function (path) {
|
||||
var texture = assetManager.get(imagesPath + path);
|
||||
var texture = assetManager.get(path);
|
||||
return texture;
|
||||
});
|
||||
var atlasLoader = new spine.AtlasAttachmentLoader(atlas);
|
||||
@ -8534,7 +8557,7 @@ var spine;
|
||||
skeleton.y = config.y;
|
||||
}
|
||||
var animationState = this.state = new spine.AnimationState(new spine.AnimationStateData(skeleton.data));
|
||||
animationState.setAnimation(0, config.animation, true);
|
||||
animationState.setAnimation(0, config.animation, config.loop);
|
||||
if (config.success)
|
||||
config.success(this);
|
||||
this.loaded = true;
|
||||
|
||||
File diff suppressed because one or more lines are too long
1
spine-ts/build/spine-widget.d.ts
vendored
1
spine-ts/build/spine-widget.d.ts
vendored
@ -1547,6 +1547,7 @@ declare module spine {
|
||||
animation: string;
|
||||
imagesPath: string;
|
||||
atlasPages: string[];
|
||||
atlasPagesContent: string[];
|
||||
skin: string;
|
||||
loop: boolean;
|
||||
scale: number;
|
||||
|
||||
@ -7915,13 +7915,25 @@ var spine;
|
||||
this.debugShader = spine.webgl.Shader.newColored(gl);
|
||||
this.debugRenderer = new spine.webgl.SkeletonDebugRenderer(gl);
|
||||
this.shapes = new spine.webgl.ShapeRenderer(gl);
|
||||
var assets = this.assetManager = new spine.webgl.AssetManager(gl);
|
||||
if (!config.atlasContent)
|
||||
var assets = this.assetManager = new spine.webgl.AssetManager(gl, config.imagesPath ? config.imagesPath : "");
|
||||
if (!config.atlasContent) {
|
||||
assets.loadText(config.atlas);
|
||||
if (!config.jsonContent)
|
||||
}
|
||||
if (!config.jsonContent) {
|
||||
assets.loadText(config.json);
|
||||
}
|
||||
if (config.atlasPages == null) {
|
||||
assets.loadTexture(config.atlas.replace(".atlas", ".png"));
|
||||
if (config.atlas) {
|
||||
var atlasPage = config.atlas.replace(".atlas", ".png");
|
||||
if (atlasPage.lastIndexOf(config.imagesPath) == 0) {
|
||||
atlasPage = atlasPage.substr(config.imagesPath.length);
|
||||
}
|
||||
assets.loadTexture(atlasPage);
|
||||
}
|
||||
else {
|
||||
var firstLine = config.atlasContent.trim().split("\n")[0];
|
||||
assets.loadTexture(firstLine);
|
||||
}
|
||||
}
|
||||
else {
|
||||
for (var i = 0; i < config.atlasPages.length; i++) {
|
||||
@ -7952,14 +7964,25 @@ var spine;
|
||||
if (!config.backgroundColor)
|
||||
config.backgroundColor = "#555555";
|
||||
if (!config.imagesPath) {
|
||||
var index = config.atlas.lastIndexOf("/");
|
||||
if (index != -1) {
|
||||
config.imagesPath = config.atlas.substr(0, index) + "/";
|
||||
if (config.atlas) {
|
||||
var index = config.atlas.lastIndexOf("/");
|
||||
if (index != -1) {
|
||||
config.imagesPath = config.atlas.substr(0, index) + "/";
|
||||
}
|
||||
else {
|
||||
config.imagesPath = "";
|
||||
}
|
||||
}
|
||||
else {
|
||||
config.imagesPath = "";
|
||||
}
|
||||
}
|
||||
if (config.json && config.json.lastIndexOf(config.imagesPath) == 0) {
|
||||
config.json = config.json.substr(config.imagesPath.length);
|
||||
}
|
||||
if (config.atlas && config.atlas.lastIndexOf(config.imagesPath) == 0) {
|
||||
config.atlas = config.atlas.substr(config.imagesPath.length);
|
||||
}
|
||||
if (!config.premultipliedAlpha === undefined)
|
||||
config.premultipliedAlpha = false;
|
||||
if (!config.debug === undefined)
|
||||
@ -7983,7 +8006,7 @@ var spine;
|
||||
}
|
||||
var atlasContent = config.atlasContent === undefined ? this.assetManager.get(this.config.atlas) : config.atlasContent;
|
||||
var atlas = new spine.TextureAtlas(atlasContent, function (path) {
|
||||
var texture = assetManager.get(imagesPath + path);
|
||||
var texture = assetManager.get(path);
|
||||
return texture;
|
||||
});
|
||||
var atlasLoader = new spine.AtlasAttachmentLoader(atlas);
|
||||
@ -8002,7 +8025,7 @@ var spine;
|
||||
skeleton.y = config.y;
|
||||
}
|
||||
var animationState = this.state = new spine.AnimationState(new spine.AnimationStateData(skeleton.data));
|
||||
animationState.setAnimation(0, config.animation, true);
|
||||
animationState.setAnimation(0, config.animation, config.loop);
|
||||
if (config.success)
|
||||
config.success(this);
|
||||
this.loaded = true;
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -41,7 +41,7 @@ function init () {
|
||||
gl = canvas.getContext("webgl", config) || canvas.getContext("experimental-webgl", config);
|
||||
|
||||
// Create a simple shader, mesh, model-view-projection matrix and SkeletonRenderer.
|
||||
shader = spine.webgl.Shader.newColoredTextured(gl);
|
||||
shader = spine.webgl.Shader.newTwoColoredTextured(gl);
|
||||
batcher = new spine.webgl.PolygonBatcher(gl);
|
||||
mvp.ortho2d(0, 0, canvas.width - 1, canvas.height - 1);
|
||||
skeletonRenderer = new spine.webgl.SkeletonRenderer(gl);
|
||||
|
||||
BIN
spine-ts/widget/example/assets/spine-logo.png
Normal file
BIN
spine-ts/widget/example/assets/spine-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
@ -9,8 +9,67 @@
|
||||
<div style="margin-bottom: 20px; width: 100%; height: 150px;" class="spine-widget" data-json="assets/raptor.json" data-atlas="assets/raptor.atlas" data-animation="Jump" data-fit-to-canvas="false" data-scale="0.1" data-x="200" data-y="10"></div>
|
||||
<!-- Or make things real small -->
|
||||
<div style="margin-bottom: 20px; width: 320px; height: 240px;" class="spine-widget" data-json="assets/raptor.json" data-atlas="assets/raptor.atlas" data-animation="walk" data-background-color="#cc0000"></div>
|
||||
<!-- You can also specify the .JSON and .atlas files inline to reduce the number of requests made to the server -->
|
||||
<div id="spine-widget-inline" style="margin-bottom: 20px; width: 640px; height: 480px;"></div>
|
||||
</center>
|
||||
</body>
|
||||
|
||||
<script id="atlas" type="text/plain">
|
||||
spine-logo.png
|
||||
size: 128,64
|
||||
format: RGBA8888
|
||||
filter: Linear,Linear
|
||||
repeat: none
|
||||
logo
|
||||
rotate: false
|
||||
xy: 2, 2
|
||||
size: 104, 32
|
||||
orig: 104, 32
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
</script>
|
||||
|
||||
<script id="atlasPage" type="text/plain">
|
||||
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAABACAYAAADS1n9/AAAFLElEQVR42u2bTWhVRxTH//myJtTmGT+SYEvTFGvTRBOTV8tLbXwL0e3bZCEiBtRuzUa6ElJX2QgKiqibiG4MfiSCiHaToohowQQEUShY/MCNNQUXLtSUs7gwDHPvzLx737svef8fDNHk3nnnnPnP3DNn7gMIIWTR0NKAlpPrcXKqB1Py80A7DvSvQH9DDRoYnSpgvBPjC3ks6O3DNnx4NYhXc1nM3dmMO5PdmDz4JQ4ur8VyRm0Jcbkbl00CCGsn1uMEo7aEuNSNSz4CmOnDDKNWBH19fQOjo6O/qU1+53p/Pp/fLq2jo6Mzqt9CoTDsY9fhr3HYRwAXunDBp/8wu8XOOHab0Pv0jXHJBn5qavqP+fn/FkxtZubPv2xGSgCD68WpoF+519Tns2f//Osa0NZlaH3zM964CmDXWuzyGfzApomJc5OB3bOzc38XGwsTEhPxOSzGEv9UhCCq1w0T5/UABIPqKoCRkZFfw5xVm6sIJOt/sgVPbIP/MIuHPrsD1W4ZBBe7JTaZTGal62ccO3b8tEssZBzKLgLVOJkB6jIoTkpAxGEfAaizXu6VPoJlVp8J8m/XYNbXoH54DYbPd+H805/w9P0Q3gcD/3Yr3p7ZgDOrGrDKd/lXbQmzW2LjMyHUma/2L/9X/dVXX19xxUZ1KuyD5fc2o9RAqjPKdJ9+rWswTTTXozlTj0yx95vslsE22a2KQAbTZXVV+5XPCrtWnTRx4hFLAHH60QMpDrmuPLZrS4lut4jWdUBty/XY2O/jwbXiry05TCUePg75BNK2YqgOxxVfkgKw2a3mRlEz2vfaJCejF/qyJs+9JAKZ5PIo5L5A7sYm3Li9Gbevb8T1iz/gohSI7vXj3sscXs5vxfz9AdyPkwO42K0+r202+w5oUpPRewto2gXoyUrSgdQdtgXzag+uumwBd7didyUIwPRosTWfeCQuAtO+15S1piWA6R5ML2YB+LZUagKy/JsKNyIOn0JQKQRw5BscsQ3+pzw+dTaisxIFoFf/olqxj+FEVwS9eGHLTEstAKkGvsjhRZQAxjowVurcpVgBLMqzAb0qlqTDIjKf7FtY9xnWnd2As68H8VotAF3biGs7WrCjHMmrqwDEH7Vf/Zxh0aA6HFWg0ANpc1itkMkjxteupjo0NdaiMeltYJK7ADWvSn1ZT0IAUU6YCkFRlUU1OLYiSTnrAEkKQC0EpVnsiizGSPDDZqsMlLpFjEoETVmvOG3qW88v4ma8ckaQXYFsYTUKlZIEmmodLkKXSVa2HUCwDMsgi3EiiODwIzgEcimRRm17pG+ZCcE5uL7flb/52l1Xg7p97dg38T0m7vbj7rtf8C7ICaQgJOcDlSAA/VGn1liCOAexlvgHk61sZwGuR7ZimO2ZrgdSBjzq/Nv2mIhiZwt2Ru0GfBLCUgvAtOLZWlkPg8L2/urKUGwhKOxFk6DAVKzNg80YjBLA9pVwrqKpuxGXEz61dO5TrZNro166kc+WvlNLFmWQ1WXJtxQZNZMkyMX2a6K2BrWzWcyaBv9KD67II6JSk2pTnFN/JSyNbDoubcvQduo7nHowgAe3enHr6Lc4OpTBEEh1CIBQAIQCIFUtgN7P0Ssvhz76EY/kq2GPt+Dx8xyeH/oKhzgiZUZ9vbxcZc+9bdhr2gnIN4k4IlVAVxO6Pm7DR10A+9uxn9GpEqQqKO8IyjeEb27CzT2t2MOoEEIIIYQQQgghhBBCCCGEEEIIIYQQQgghhBBCCCGEEEIIIYQQQpYG/wPiudlO23hTHQAAAABJRU5ErkJggg==
|
||||
</script>
|
||||
|
||||
<script id="json" type="text/plain">
|
||||
{
|
||||
"skeleton": { "hash": "MYXtB/H4Z2fp6J+/XZiyN+f9Hfc", "spine": "3.5.49", "width": 104, "height": 32, "images": "" },
|
||||
"bones": [
|
||||
{ "name": "root" }
|
||||
],
|
||||
"slots": [
|
||||
{ "name": "spine-logo", "bone": "root", "attachment": "logo" }
|
||||
],
|
||||
"skins": {
|
||||
"default": {
|
||||
"spine-logo": {
|
||||
"logo": { "width": 104, "height": 32 }
|
||||
}
|
||||
}
|
||||
},
|
||||
"animations": {
|
||||
"animation": {
|
||||
"bones": {
|
||||
"root": {
|
||||
"rotate": [
|
||||
{ "time": 0, "angle": 0 },
|
||||
{ "time": 0.8333, "angle": 39.96 },
|
||||
{ "time": 1.6667, "angle": 0 }
|
||||
],
|
||||
"scale": [
|
||||
{ "time": 0, "x": 1, "y": 1 },
|
||||
{ "time": 0.8333, "x": 3, "y": 3 },
|
||||
{ "time": 1.6667, "x": 1, "y": 1 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<script>
|
||||
new spine.SpineWidget("spine-widget", {
|
||||
json: "assets/spineboy.json",
|
||||
@ -28,6 +87,28 @@ new spine.SpineWidget("spine-widget", {
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
json = document.getElementById("json").innerHTML;
|
||||
atlas = document.getElementById("atlas").innerHTML;
|
||||
|
||||
new spine.SpineWidget("spine-widget-inline", {
|
||||
jsonContent: json,
|
||||
atlasContent: atlas,
|
||||
imagesPath: "assets/",
|
||||
animation: "animation",
|
||||
backgroundColor: "#00000000",
|
||||
debug: true,
|
||||
success: function (widget) {
|
||||
var animIndex = 0;
|
||||
widget.canvas.onclick = function () {
|
||||
animIndex++;
|
||||
let animations = widget.skeleton.data.animations;
|
||||
if (animIndex >= animations.length) animIndex = 0;
|
||||
widget.setAnimation(animations[animIndex].name);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@ -77,11 +77,24 @@ module spine {
|
||||
this.debugRenderer = new spine.webgl.SkeletonDebugRenderer(gl);
|
||||
this.shapes = new spine.webgl.ShapeRenderer(gl);
|
||||
|
||||
let assets = this.assetManager = new spine.webgl.AssetManager(gl);
|
||||
if (!config.atlasContent) assets.loadText(config.atlas);
|
||||
if (!config.jsonContent) assets.loadText(config.json);
|
||||
let assets = this.assetManager = new spine.webgl.AssetManager(gl, config.imagesPath ? config.imagesPath : "");
|
||||
if (!config.atlasContent) {
|
||||
assets.loadText(config.atlas);
|
||||
}
|
||||
if (!config.jsonContent) {
|
||||
assets.loadText(config.json);
|
||||
}
|
||||
if (config.atlasPages == null) {
|
||||
assets.loadTexture(config.atlas.replace(".atlas", ".png"));
|
||||
if (config.atlas) {
|
||||
var atlasPage = config.atlas.replace(".atlas", ".png");
|
||||
if (atlasPage.lastIndexOf(config.imagesPath) == 0) {
|
||||
atlasPage = atlasPage.substr(config.imagesPath.length);
|
||||
}
|
||||
assets.loadTexture(atlasPage);
|
||||
} else {
|
||||
let firstLine = config.atlasContent.trim().split("\n")[0];
|
||||
assets.loadTexture(firstLine);
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < config.atlasPages.length; i++) {
|
||||
assets.loadTexture(config.atlasPages[i]);
|
||||
@ -103,13 +116,23 @@ module spine {
|
||||
if (config.fitToCanvas === undefined) config.fitToCanvas = true;
|
||||
if (!config.backgroundColor) config.backgroundColor = "#555555";
|
||||
if (!config.imagesPath) {
|
||||
let index = config.atlas.lastIndexOf("/");
|
||||
if (index != -1) {
|
||||
config.imagesPath = config.atlas.substr(0, index) + "/";
|
||||
if (config.atlas) {
|
||||
let index = config.atlas.lastIndexOf("/");
|
||||
if (index != -1) {
|
||||
config.imagesPath = config.atlas.substr(0, index) + "/";
|
||||
} else {
|
||||
config.imagesPath = "";
|
||||
}
|
||||
} else {
|
||||
config.imagesPath = "";
|
||||
}
|
||||
}
|
||||
if (config.json && config.json.lastIndexOf(config.imagesPath) == 0) {
|
||||
config.json = config.json.substr(config.imagesPath.length);
|
||||
}
|
||||
if (config.atlas && config.atlas.lastIndexOf(config.imagesPath) == 0) {
|
||||
config.atlas = config.atlas.substr(config.imagesPath.length);
|
||||
}
|
||||
if (!config.premultipliedAlpha === undefined) config.premultipliedAlpha = false;
|
||||
if (!config.debug === undefined) config.debug = false;
|
||||
if (!config.alpha === undefined) config.alpha = true;
|
||||
@ -129,7 +152,7 @@ module spine {
|
||||
|
||||
let atlasContent = config.atlasContent === undefined ? this.assetManager.get(this.config.atlas) as string : config.atlasContent;
|
||||
let atlas = new spine.TextureAtlas(atlasContent, (path: string) => {
|
||||
let texture = assetManager.get(imagesPath + path) as spine.webgl.GLTexture;
|
||||
let texture = assetManager.get(path) as spine.webgl.GLTexture;
|
||||
return texture;
|
||||
});
|
||||
|
||||
@ -152,7 +175,7 @@ module spine {
|
||||
}
|
||||
|
||||
var animationState = this.state = new spine.AnimationState(new spine.AnimationStateData(skeleton.data));
|
||||
animationState.setAnimation(0, config.animation, true);
|
||||
animationState.setAnimation(0, config.animation, config.loop);
|
||||
if (config.success) config.success(this);
|
||||
this.loaded = true;
|
||||
requestAnimationFrame(() => { this.render(); });
|
||||
@ -315,6 +338,7 @@ module spine {
|
||||
animation: string;
|
||||
imagesPath: string;
|
||||
atlasPages: string[];
|
||||
atlasPagesContent: string[];
|
||||
skin = "default";
|
||||
loop = true;
|
||||
scale = 1.0;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user