Phaser current version test environment

Basic Phaser setup for testing

by Lewis Lane

HTML

<script src="https://rawgit.com/photonstorm/phaser/master/build/phaser.min.js"></script>
<div id="test"></div>

JavaScript

// Phaser current version test environment
// WrappedGroup implementation

var BasicGame = {
    game: new Phaser.Game(500, 400, Phaser.AUTO, 'test')
};

BasicGame.Main = {
    create: function (game) {
        this.circleBmd = game.add.bitmapData(32, 32);
        this.circleBmd.circle(16, 16, 16, '#fff');

        // Create a WrappedGroup instance 350 wide and 250 high
        this.wrappedGroup = new WrappedGroup(game, 350, 250);
        
        // Create a few objects to show the wrapping
        this.wrappedGroup.create(0, 0, this.circleBmd).tint = 0xff0000;
        this.wrappedGroup.create(0, 0, this.circleBmd).tint = 0x007cff;
    },
    update: function (game) {
        // Move the red object backwards to test negative wrapping
        this.wrappedGroup.getAt(0).x -= 4;
        this.wrappedGroup.getAt(0).y -= 2;
        
        // Move the blue object forwards to test positive wrapping
        this.wrappedGroup.getAt(1).x += 3;
        this.wrappedGroup.getAt(1).y += 6;
    }
};

BasicGame.game.state.add('Main', BasicGame.Main);
BasicGame.game.state.start('Main');

// Create a WrappedGroup object which extends the normal Phaser.Group, but has wrapWidth and wrapHeight 
// properties which constrain children to these bounds. By default bounds will be the same size as the game world.
var WrappedGroup = function (game, width, height) {
    Phaser.Group.call(this, game);
    this.wrapWidth = width || game.world.width;
    this.wrapHeight = height || game.world.height;
};

WrappedGroup.prototype = Object.create(Phaser.Group.prototype);
WrappedGroup.prototype.constructor = WrappedGroup;

WrappedGroup.prototype.update = function () {

    var i = this.children.length;

    while (i--) {
        // Ensure all immediate children are kept within the bounds of the WrapGroup
        if (this.children[i].x < 0 || this.children[i].x > this.wrapWidth) {
            this.children[i].x = Phaser.Math.wrap(this.children[i].x, 0, this.wrapWidth);
        }
        if...