diff --git a/spine-ts/package.json b/spine-ts/package.json
index 9afa50f8f..408e2a4cd 100644
--- a/spine-ts/package.json
+++ b/spine-ts/package.json
@@ -18,7 +18,7 @@
"build:phaser": "npx esbuild --bundle spine-phaser/src/index.ts --tsconfig=spine-phaser/tsconfig.json --sourcemap --outfile=spine-phaser/dist/iife/spine-phaser.js --external:Phaser --alias:phaser=Phaser --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 && npx esbuild --minify spine-canvas/dist/iife/spine-canvas.js --outfile=spine-canvas/dist/iife/spine-canvas.min.js && npx esbuild --minify spine-player/dist/iife/spine-player.js --outfile=spine-player/dist/iife/spine-player.min.js && npx esbuild --minify spine-phaser/dist/iife/spine-phaser.js --outfile=spine-phaser/dist/iife/spine-phaser.min.js && npx esbuild --minify spine-webgl/dist/iife/spine-webgl.js --outfile=spine-webgl/dist/iife/spine-webgl.min.js && npx esbuild --minify spine-threejs/dist/iife/spine-threejs.js --outfile=spine-threejs/dist/iife/spine-threejs.min.js",
- "dev": "concurrently \"npx live-server --no-browser\" \"npm run dev:canvas\" \"npm run dev:webgl\" \"npm run dev:phaser\" \"npm run dev:player\" \"npm run dev:threejs\"",
+ "dev": "concurrently \"npx live-server\" \"npm run dev:canvas\" \"npm run dev:webgl\" \"npm run dev:phaser\" \"npm run dev:player\" \"npm run dev:threejs\"",
"dev:modules": "npm run build:modules -- --watch",
"dev:canvas": "npm run build:canvas -- --watch",
"dev:webgl": "npm run build:webgl -- --watch",
diff --git a/spine-ts/spine-phaser/example/basic-example.html b/spine-ts/spine-phaser/example/basic-example.html
index f9f00878e..144f985fc 100644
--- a/spine-ts/spine-phaser/example/basic-example.html
+++ b/spine-ts/spine-phaser/example/basic-example.html
@@ -6,6 +6,7 @@
+
Spine Phaser Example
@@ -21,15 +22,15 @@
scene: {
preload: preload,
create: create,
- pack: {
- files: [
- { type: "scenePlugin", key: "spine.SpinePlugin", url: "../dist/iife/spine-phaser.js", sceneKey: "spine" }
- ]
- }
+ },
+ plugins: {
+ scene: [
+ { key: "spine.SpinePlugin", plugin: spine.SpinePlugin, mapping: "spine" }
+ ]
}
};
- let game = new Phaser.Game(config);
+ const game = new Phaser.Game(config);
function preload() {
this.load.spineBinary("spineboy-data", "assets/spineboy-pro.skel");
@@ -37,9 +38,14 @@
}
function create() {
- let spineboy = this.add.spine(400, 500, 'spineboy-data', "spineboy-atlas");
+ const spineboy = this.add.spine(400, 500, 'spineboy-data', "spineboy-atlas");
spineboy.scale = 0.5;
spineboy.animationState.setAnimation(0, "walk", true);
+
+ const spineboy2 = this.make.spine({
+ x: 200, y: 500, dataKey: "spineboy-data", atlasKey: "spineboy-atlas"
+ });
+ this.add(spineboy2);
}
diff --git a/spine-ts/spine-phaser/example/camera-pipeline-test.html b/spine-ts/spine-phaser/example/camera-pipeline-test.html
index a85f8ef6b..9f05a328a 100644
--- a/spine-ts/spine-phaser/example/camera-pipeline-test.html
+++ b/spine-ts/spine-phaser/example/camera-pipeline-test.html
@@ -84,7 +84,7 @@
}
}
- let game = new Phaser.Game(config);
+ const game = new Phaser.Game(config);
function preload() {
this.load.spineBinary("spineboy-data", "assets/spineboy-pro.skel");
@@ -100,7 +100,7 @@
// is needed.
this.add.sprite(0, 0, 'img');
- let spineboy = this.add.spine(400, 300, 'spineboy-data', "spineboy-atlas");
+ const spineboy = this.add.spine(400, 300, 'spineboy-data', "spineboy-atlas");
spineboy.scale = 0.5;
spineboy.animationState.setAnimation(0, "walk", true);
diff --git a/spine-ts/spine-phaser/src/SpinePlugin.ts b/spine-ts/spine-phaser/src/SpinePlugin.ts
index 2bd43ed28..0f8297e6a 100644
--- a/spine-ts/spine-phaser/src/SpinePlugin.ts
+++ b/spine-ts/spine-phaser/src/SpinePlugin.ts
@@ -94,7 +94,6 @@ export class SpinePlugin extends Phaser.Plugins.ScenePlugin {
};
pluginManager.registerFileType("spineBinary", skeletonBinaryFileCallback, scene);
-
let atlasFileCallback = function (this: any, key: string,
url: string,
premultipliedAlpha: boolean,
@@ -184,7 +183,11 @@ export class SpinePlugin extends Phaser.Plugins.ScenePlugin {
return atlasFile.premultipliedAlpha;
}
- createSkeleton (dataKey: string, atlasKey: string) {
+ createSkeleton (dataKey: string, atlasKey: string) {
+ return new Skeleton(this.createSkeletonData(dataKey, atlasKey));
+ }
+
+ createAtlas(atlasKey: string) {
let atlas: TextureAtlas;
if (this.atlasCache.exists(atlasKey)) {
atlas = this.atlasCache.get(atlasKey);
@@ -204,10 +207,15 @@ export class SpinePlugin extends Phaser.Plugins.ScenePlugin {
}
this.atlasCache.add(atlasKey, atlas);
}
+ return atlas;
+ }
- let skeletonData: SkeletonData;
- if (this.skeletonDataCache.exists(dataKey)) {
- skeletonData = this.skeletonDataCache.get(dataKey);
+ createSkeletonData(dataKey: string, atlasKey: string) {
+ const atlas = this.createAtlas(atlasKey)
+ const combinedKey = dataKey + atlasKey;
+ let skeletonData: SkeletonData;
+ if (this.skeletonDataCache.exists(combinedKey)) {
+ skeletonData = this.skeletonDataCache.get(combinedKey);
} else {
if (this.game.cache.json.exists(dataKey)) {
let jsonFile = this.game.cache.json.get(dataKey) as any;
@@ -218,10 +226,9 @@ export class SpinePlugin extends Phaser.Plugins.ScenePlugin {
let binary = new SkeletonBinary(new AtlasAttachmentLoader(atlas));
skeletonData = binary.readSkeletonData(new Uint8Array(binaryFile));
}
- this.skeletonDataCache.add(dataKey, skeletonData);
+ this.skeletonDataCache.add(combinedKey, skeletonData);
}
-
- return new Skeleton(skeletonData);
+ return skeletonData;
}
}