@koreez/phaser2-animate/example/index.ts

Phaser2 Animate

// tslint:disable-next-line:no-submodule-imports
// @ts-ignore
import { AnimatePlugin } from "../src";
import "./phaser";

Phaser.Sprite.prototype.update = Phaser.Group.prototype.update;

export default class Game extends Phaser.Game {
    public centerX: number;
    public centerY: number;
    constructor(width?: string | number, height?: string | number, renderer?: number, parent?: any, state?: any) {
        super(width, height, renderer, parent, state);
    }
}

function preload() {
    console.log("preload");
    this.game.plugins.add(AnimatePlugin);

    //
    this.load.atlas("atlas", "static/assets/atlas.png", "static/assets/atlas.json");
    // //
    this.load.json("penguin", "static/assets/penguin.json");
    this.load.json("logo", "static/assets/logo.json");
}

function create() {
    this.add.animate(100, 100, "penguin", "atlas", true).play();
    this.add.animate(100, 500, "penguin", "atlas", true).gotoAndPlay(0, 41);
    this.add.animate(210, 500, "penguin", "atlas", true).gotoAndLoop(42, 66);
    this.add.animate(330, 500, "penguin", "atlas", true).gotoAndStop(67);
    this.add.animate(440, 500, "penguin", "atlas", true).gotoAndLoop(68, 128);
    this.add.animate(550, 500, "penguin", "atlas", true).gotoAndStop(129);
    this.add.animate(660, 500, "penguin", "atlas", true).gotoAndPlay(130, 157);

    this.add.animate(400, 300, "logo", "atlas", false).play();
}

document.onreadystatechange = () => {
    if (document.readyState === "complete") {
        (window as any).game = new Game(800, 600, Phaser.CANVAS, null, { create, preload });
    }
};