JSFiddle - React, Tailwind, and code Playground

by shiqangpan

HTML

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/phaser.js"></script>

JavaScript

class BootScene extends Phaser.Scene {
  constructor() {
    super();
    console.log(this);
  }

  preload() {
    this.load.spritesheet('brawler', 'https://raw.githubusercontent.com/photonstorm/phaser3-examples/master/public/assets/animations/brawler48x48.png', {
      frameWidth: 48,
      frameHeight: 48
    });
  }

  create() {
    this.player = this.physics.add.sprite(50, 50, 'brawler', 30).setOrigin(0).setScale(2);

    this.player2 = this.physics.add.sprite(50, 50, 'brawler', 30).setOrigin(0).setScale(2);

    var tween = this.tweens.add({
      targets: this.player2,
      x: 350,
      ease: 'Power1',
      duration: 1000,
      yoyo: true,
      repeat: 0,
    });
   //tween.stop();

    let btn = this.add.text(150, 200, 'click me');
    btn.setInteractive();
    btn.on('pointerdown', () => {
      console.log('btn');
      // this.player.play('raise');
      tween.play();
    }, this);

  }
}

var config = {
  width: 400,
  height: 300,
  physics: {
    default: 'arcade',
    arcade: {
      gravity: {
        y: 0
      },
      debug: false // set to true to view zones
    }
  },
  backgroundColor: 0x000000,
  scene: [BootScene]
}

var game = new Phaser.Game(config);