JSFiddle - React, Tailwind, and code Playground

phaser tests

by luckylooke

HTML

<script src="http://examples.phaser.io/_site/js/phaser.js"></script>

JavaScript

var game = new Phaser.Game(800, 600, Phaser.CANVAS, '', {
    preload: preload,
    create: create,
    update: update
}),
    background1, background2, train, wheel, whisle,
    fx;

function preload() {
    game.load.image('background', 'http://thumbs.dreamstime.com/z/row-houses-under-blue-sky-4086807.jpg');
    game.load.image('train', 'http://www.clker.com/cliparts/E/z/Y/s/X/W/choo-choo-train.svg');
    game.load.image('wheel', 'http://www.clker.com/cliparts/f/B/G/K/n/3/wagon-wheel-darius-rucker-th.png');
    game.load.image('https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRUnQbhbTL9qqgRoo2zA2-7uglqpFqiz0bBVNfwxJcG9M4OjM6Q');
    game.load.audio('sfx', 'http://www.sounddogs.com/sound-effects/2227/mp3/518735_SOUNDDOGS__co.mp3');
}

function create() {
    game.world.setBounds(0, 0, 800, 600);

    background1 = game.add.sprite(0, 0, 'background');
    background2 = game.add.sprite(-800, 0, 'background');
    train = game.add.sprite(100, 150, 'train');
    wheel = game.add.sprite(240, 440, 'wheel');
    wheel.anchor.setTo(0.5, 0.5);
    wheel2 = game.add.sprite(150, 450, 'wheel');
    wheel2.anchor.setTo(0.5, 0.5);
    wheel2.scale.setTo(0.7, 0.7);
    whisle = game.add.sprite(150, 350, 'whisle');

    fx = game.add.audio('sfx');
    fx.play('',0,1,true);
}

var moveBackground = function (background) {
    if (background.x > 600) {
        background.x = -600;
        background.x += 1;
    }
    background.x += 1;
}

    function update() {
        moveBackground(background1);
        moveBackground(background2);
        wheel.angle -= 1;
        wheel2.angle -= 1.3;
    }