JSFiddle - React, Tailwind, and code Playground

by Batzi

HTML

<script src="https://github.com/photonstorm/phaser/releases/download/v2.4.4/phaser.js"></script>

JavaScript

var game = new Phaser.Game(800, 600, Phaser.AUTO, 'roam-example', {preload:preload,create: create,update:update});

var player,flag;

function preload(){

game.load.crossOrigin = 'anonymous';    game.load.spritesheet('player','http://i.imgur.com/ctRh8np.png',70,125);
}

function create(){
    player = game.add.sprite(200,300,'player',24);
    game.physics.arcade.enable(player);
    player.body.setSize(50, 50, 20, 80);

	player.animations.add('down', [24, 25, 34, 35], 20, true);
    player.animations.add('up', [22, 23, 32, 33], 20, true);
    player.animations.add('left', [8, 9, 18, 19], 20, true);
    player.animations.add('right', [6, 7, 16, 17], 20, true);
    player.animations.add('upLeft', [20, 21, 30, 31], 20, true);
    player.animations.add('upRight', [4, 5, 14, 15], 20, true);
    player.animations.add('downLeft', [2, 3, 12, 13], 20, true);
    player.animations.add('downRight', [0, 1, 10, 11], 20, true);
    
    flag = false;
    
    game.physics.arcade.moveToXY(player,150,300,60);
    
    setTimeout(function(){
        flag=false;
    	game.physics.arcade.moveToXY(player,player.x,200,60);
    },5000);
    
    setTimeout(function(){
        flag=false;
    	game.physics.arcade.moveToXY(player,350,400,60);
    },10000);
    
    
}

function update(){
    
    if(flag)
        player.body.velocity.set(0);
    
    if(player.x==100)
        flag = true;
    
    if(player.y==200)
        flag = true;
    if(Math.floor(player.x)==350 && Math.floor(player.y)==400)
        flag = true;
    
    moved = false;
    
    if (player.body.velocity.y.toFixed(2) == 0) {
    if (player.body.velocity.x.toFixed(2) < 0) {
        moved = true;
        player.play('left');
    } else if (player.body.velocity.x.toFixed(2) > 0) {
        moved = true;
        player.play('right');
    }
}

if (player.body.velocity.x.toFixed(2) == 0) {
    if (player.body.velocity.y.toFixed(2) < 0) {
        moved = true;
        player.play('up');
    } else if...