UnityMirror/spine-runtimes
1
0
Fork 0
mirror of https://github.com/EsotericSoftware/spine-runtimes.git synced 2026-02-09 16:48:43 +08:00
Code Issues Packages Projects Releases Wiki Activity

[phaser] Example clean-up

Browse Source
This commit is contained in:
Mario Zechner 2023-04-24 10:33:40 +02:00
parent cf68a9fd07
commit 125d7c9903
16 changed files with 60 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
spine-ts/spine-phaser/example/arcade-physics-test.html
View File

@ -13,7 +13,7 @@
<h1>Arcade Physics example</h1>
</body>
<script>
var config = {
const config = {
type: Phaser.AUTO,
width: 800,
height: 600,
@ -36,7 +36,7 @@
}
};
let game = new Phaser.Game(config);
const game = new Phaser.Game(config);
function preload() {
this.load.spineBinary("coin-data", "assets/coin-pro.skel");
@ -44,7 +44,7 @@
}
function create() {
let coin = this.add.spine(400, 200, 'coin-data', "coin-atlas");
const coin = this.add.spine(400, 200, 'coin-data', "coin-atlas");
coin.animationState.setAnimation(0, "animation", true);
coin.setScale(0.3);
coin.setSize(280, 280);

2
spine-ts/spine-phaser/example/basic-example.html
View File

@ -13,7 +13,7 @@
<h1>Basic example</h1>
</body>
<script>
var config = {
const config = {
type: Phaser.AUTO,
width: 800,
height: 600,

6
spine-ts/spine-phaser/example/basic-vanilla-js-example.html
View File

@ -14,7 +14,7 @@
<h1>Basic example</h1>
</body>
<script>
var config = {
const config = {
type: Phaser.AUTO,
width: 800,
height: 600,
@ -30,7 +30,7 @@
}
};
let game = new Phaser.Game(config);
const game = new Phaser.Game(config);
function preload() {
this.load.spineBinary("spineboy-data", "assets/spineboy-pro.skel");
@ -38,7 +38,7 @@
}
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);
}

8
spine-ts/spine-phaser/example/batching-test.html
View File

@ -13,7 +13,7 @@
<h1>Batching test</h1>
</body>
<script>
var config = {
const config = {
type: Phaser.AUTO,
width: 800,
height: 600,
@ -30,7 +30,7 @@
}
};
let game = new Phaser.Game(config);
const game = new Phaser.Game(config);
let debug;
function preload() {
@ -41,12 +41,12 @@
}
function create() {
let plugin = this.spine;
const plugin = this.spine;
let x = 25;
let y = 60;
for (let j = 0; j < 10; j++, y += 600 / 10) {
for (let i = 0; i < 20; i++, x += 800 / 20) {
let obj = Math.random() > 0.5
const obj = Math.random() > 0.5
? this.add.spine(x, y, 'spineboy-data', "spineboy-atlas")
: this.add.spine(x, y, 'raptor-data', "raptor-atlas");
obj.animationState.setAnimation(0, "walk", true);

10
spine-ts/spine-phaser/example/blend-test.html
View File

@ -13,7 +13,7 @@
<h1>Blend test</h1>
</body>
<script>
var config = {
const config = {
type: Phaser.AUTO,
width: 800,
height: 600,
@ -32,7 +32,7 @@
};
let controls;
let game = new Phaser.Game(config);
const game = new Phaser.Game(config);
function preload() {
this.load.spineBinary("spineboy-data", "assets/spineboy-pro.skel");
@ -41,14 +41,14 @@
function create() {
for (var i = 0; i < 4; i++) {
let obj = this.add.spine(i * 200, 600, 'spineboy-data', 'spineboy-atlas').setScale(0.25);
const obj = this.add.spine(i * 200, 600, 'spineboy-data', 'spineboy-atlas').setScale(0.25);
obj.setScale(0.25);
obj.animationState.setAnimation(0, "idle", true);
obj.animationState.setAnimation(1, "shoot", true);
}
var cursors = this.input.keyboard.createCursorKeys();
const cursors = this.input.keyboard.createCursorKeys();
var controlConfig = {
const controlConfig = {
camera: this.cameras.main,
left: cursors.left,
right: cursors.right,

6
spine-ts/spine-phaser/example/bounds-test.html
View File

@ -13,7 +13,7 @@
<h1>Bounds test</h1>
</body>
<script>
var config = {
const config = {
type: Phaser.AUTO,
width: 800,
height: 600,
@ -30,7 +30,7 @@
}
};
let game = new Phaser.Game(config);
const game = new Phaser.Game(config);
let spineboy;
function preload() {
@ -49,7 +49,7 @@
let time = 0;
function update(t, delta) {
time += delta / 1000;
let scale = 0.4 + Math.cos(time) * 0.2;
const scale = 0.4 + Math.cos(time) * 0.2;
spineboy.scale = scale;
spineboy.angle++;
}

4
spine-ts/spine-phaser/example/camera-pipeline-test.html
View File

@ -12,7 +12,7 @@
<body>
<h1>Camera pipeline test</h1>
<script>
var config = {
const config = {
type: Phaser.AUTO,
width: 800,
height: 600,
@ -98,7 +98,7 @@
// FIXME: Need a dummy sprite so the MultiPipeline sets up state
// so rendering the Spine sprite actually works. Unsure what state
// is needed.
var s = this.add.sprite(0, 0, 'img');
this.add.sprite(0, 0, 'img');
let spineboy = this.add.spine(400, 300, 'spineboy-data', "spineboy-atlas");
spineboy.scale = 0.5;

6
spine-ts/spine-phaser/example/canvas-test.html
View File

@ -13,7 +13,7 @@
<h1>Canvas test</h1>
</body>
<script>
var config = {
const config = {
type: Phaser.AUTO,
width: 800,
height: 600,
@ -29,7 +29,7 @@
}
};
let game = new Phaser.Game(config);
const game = new Phaser.Game(config);
function preload() {
this.load.spineBinary("spineboy-data", "assets/spineboy-pro.skel");
@ -37,7 +37,7 @@
}
function create() {
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);
}

20
spine-ts/spine-phaser/example/control-bones-test.html
View File

@ -12,7 +12,7 @@
<body>
<h1>Control bones</h1>
<script>
var config = {
const config = {
type: Phaser.AUTO,
width: 800,
height: 600,
@ -28,7 +28,7 @@
}
};
let game = new Phaser.Game(config);
const game = new Phaser.Game(config);
function preload() {
this.load.spineBinary("stretchyman-data", "assets/stretchyman-pro.skel");
@ -36,33 +36,31 @@
}
function create() {
let stretchyman = this.add.spine(400, 550, 'stretchyman-data', "stretchyman-atlas");
const stretchyman = this.add.spine(400, 550, 'stretchyman-data', "stretchyman-atlas");
stretchyman.scale = 0.8;
stretchyman.skeleton.updateWorldTransform();
var controlBones = ["back-arm-ik-target", "back-leg-ik-target", "front-arm-ik-target", "front-leg-ik-target"];
const controlBones = ["back-arm-ik-target", "back-leg-ik-target", "front-arm-ik-target", "front-leg-ik-target"];
for (var i = 0; i < controlBones.length; i++) {
var bone = stretchyman.skeleton.findBone(controlBones[i]);
let point = { x: bone.worldX, y: bone.worldY };
const bone = stretchyman.skeleton.findBone(controlBones[i]);
const point = { x: bone.worldX, y: bone.worldY };
stretchyman.skeletonToPhaserWorldCoordinates(point);
var control = this.add.circle(point.x, point.y, 4, 0xff00ff).setData('bone', bone);
const control = this.add.circle(point.x, point.y, 4, 0xff00ff).setData('bone', bone);
control.setInteractive();
this.input.setDraggable(control);
this.input.on('drag', function (pointer, gameObject, dragX, dragY) {
gameObject.x = dragX;
gameObject.y = dragY;
var bone = gameObject.getData('bone');
let point = { x: dragX, y: dragY };
const bone = gameObject.getData('bone');
const point = { x: dragX, y: dragY };
stretchyman.phaserWorldCoordinatesToBone(point, bone);
bone.x = point.x;
bone.y = point.y;
bone.update();
}, this);
}
}

6
spine-ts/spine-phaser/example/depth-test.html
View File

@ -13,7 +13,7 @@
<h1>Depth test</h1>
</body>
<script>
var config = {
const config = {
type: Phaser.AUTO,
width: 800,
height: 600,
@ -29,7 +29,7 @@
}
};
let game = new Phaser.Game(config);
const game = new Phaser.Game(config);
function preload() {
this.load.image('logo', 'phaser.png');
@ -39,7 +39,7 @@
function create() {
this.add.image(400, 350, 'logo').setName('logo1').setDepth(2);
let spineboy = this.add.spine(400, 600, 'spineboy-data', "spineboy-atlas");
const spineboy = this.add.spine(400, 600, 'spineboy-data', "spineboy-atlas");
spineboy.animationState.setAnimation(0, "walk", true)
spineboy.setScale(0.5)
spineboy.setDepth(1);

8
spine-ts/spine-phaser/example/extended-class-test.html
View File

@ -22,7 +22,7 @@
}
function create() {
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);
}
@ -71,11 +71,11 @@
create() {
this.add.image(0, 0, 'logo').setOrigin(0);
let custom1 = new CustomSpineObject1(this, 100, 550, 'spineboy-data', 'spineboy-atlas', 'idle', true);
const custom1 = new CustomSpineObject1(this, 100, 550, 'spineboy-data', 'spineboy-atlas', 'idle', true);
custom1.spine.setScale(0.5);
let custom2 = new CustomSpineObject2(this, 350, 550, 'spineboy-data', 'spineboy-atlas', 'walk', true);
const custom2 = new CustomSpineObject2(this, 350, 550, 'spineboy-data', 'spineboy-atlas', 'walk', true);
custom2.spine.setScale(0.5);
let custom3 = new CustomSpineObject3(this, 600, 550, 'spineboy-data', 'spineboy-atlas', 'run', true);
const custom3 = new CustomSpineObject3(this, 600, 550, 'spineboy-data', 'spineboy-atlas', 'run', true);
custom3.spine.setScale(0.5);
this.add.image(400, 0, 'logo').setOrigin(0);

10
spine-ts/spine-phaser/example/mix-and-match.html
View File

@ -13,7 +13,7 @@
<h1>Mix and match</h1>
</body>
<script>
var config = {
const config = {
type: Phaser.AUTO,
width: 800,
height: 600,
@ -29,7 +29,7 @@
}
};
let game = new Phaser.Game(config);
const game = new Phaser.Game(config);
function preload() {
this.load.spineBinary("mix-and-match-data", "assets/mix-and-match-pro.skel");
@ -37,12 +37,12 @@
}
function create() {
let mixAndMatch = this.add.spine(400, 500, 'mix-and-match-data', "mix-and-match-atlas");
const mixAndMatch = this.add.spine(400, 500, 'mix-and-match-data', "mix-and-match-atlas");
mixAndMatch.scale = 0.5;
mixAndMatch.animationState.setAnimation(0, "walk", true);
let skeletonData = mixAndMatch.skeleton.data;
let skin = new spine.Skin("custom");
const skeletonData = mixAndMatch.skeleton.data;
const skin = new spine.Skin("custom");
skin.addSkin(skeletonData.findSkin("skin-base"));
skin.addSkin(skeletonData.findSkin("nose/short"));
skin.addSkin(skeletonData.findSkin("eyelids/girly"));

8
spine-ts/spine-phaser/example/multi-scene-test.html
View File

@ -25,7 +25,7 @@
}
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);
this.input.once('pointerdown', () => this.scene.start('Scene2'));
@ -43,14 +43,14 @@
}
create() {
let raptor = this.add.spine(300, 600, 'raptor-data', "raptor-atlas");
const raptor = this.add.spine(300, 600, 'raptor-data', "raptor-atlas");
raptor.scale = 0.5;
raptor.animationState.setAnimation(0, "walk", true);
this.input.once('pointerdown', () => this.scene.start('Scene1'));
}
}
var config = {
const config = {
type: Phaser.AUTO,
width: 800,
height: 600,
@ -62,7 +62,7 @@
]
}
};
let game = new Phaser.Game(config);
const game = new Phaser.Game(config);
</script>
</html>

8
spine-ts/spine-phaser/example/render-to-texture-test.html
View File

@ -13,7 +13,7 @@
<h1>Render to texture</h1>
</body>
<script>
var config = {
const config = {
type: Phaser.AUTO,
width: 800,
height: 600,
@ -29,7 +29,7 @@
}
};
let game = new Phaser.Game(config);
const game = new Phaser.Game(config);
function preload() {
this.load.spineBinary("spineboy-data", "assets/spineboy-pro.skel");
@ -37,8 +37,8 @@
}
function create() {
let renderTexture = this.add.renderTexture(0, 0, 800, 600);
let spineboy = this.add.spine(400, 300, 'spineboy-data', "spineboy-atlas");
const renderTexture = this.add.renderTexture(0, 0, 800, 600);
const spineboy = this.add.spine(400, 300, 'spineboy-data', "spineboy-atlas");
spineboy.scale = 0.5;
spineboy.animationState.setAnimation(0, "walk", true);
this.add.text(200, 8, 'Click to stamp SpineBoy');

6
spine-ts/spine-phaser/example/typescript/index.ts
View File

@ -8,14 +8,14 @@ class SpineDemo extends Scene {
}
create() {
let spineboy = this.add.spine(400, 500, 'spineboy-data', "spineboy-atlas");
const spineboy = this.add.spine(400, 500, 'spineboy-data', "spineboy-atlas");
this.make
spineboy.scale = 0.5;
spineboy.animationState.setAnimation(0, "walk", true);
}
}
var config = {
const config = {
width: 800,
height: 600,
type: Phaser.WEBGL,
@ -27,4 +27,4 @@ var config = {
}
};
let game = new Phaser.Game(config);
new Phaser.Game(config);

8
spine-ts/spine-phaser/example/visibility-test.html
View File

@ -14,7 +14,7 @@
<h1>Basic example</h1>
</body>
<script>
var config = {
const config = {
type: Phaser.AUTO,
width: 800,
height: 600,
@ -30,7 +30,7 @@
}
};
let game = new Phaser.Game(config);
const game = new Phaser.Game(config);
function preload() {
this.load.spineBinary("spineboy-data", "assets/spineboy-pro.skel");
@ -38,11 +38,11 @@
}
function create() {
let spineboy = this.add.spine(250, 500, 'spineboy-data', "spineboy-atlas");
const spineboy = this.add.spine(250, 500, 'spineboy-data', "spineboy-atlas");
spineboy.scale = 0.5;
spineboy.animationState.setAnimation(0, "walk", true);
let spineboy2 = this.add.spine(550, 500, 'spineboy-data', "spineboy-atlas");
const spineboy2 = this.add.spine(550, 500, 'spineboy-data', "spineboy-atlas");
spineboy2.scale = 0.5;
spineboy2.animationState.setAnimation(0, "run", true);