Added Group IDs and references to Sprites, Group sorting, z-index values and child swapping. Also added all of the drag and bounds methods to Input.

Tests/groups/create group 1.js

@@ -0,0 +1,26 @@
+/// <reference path="../../Phaser/Game.ts" />
+(function () {
+    var game = new Phaser.Game(this, 'game', 800, 600, init, create);
+    function init() {
+        //  Using Phasers asset loader we load up a PNG from the assets folder
+        game.loader.addImageFile('sonic', 'assets/sprites/sonic_havok_sanity.png');
+        game.loader.load();
+    }
+    var firstGroup;
+    function create() {
+        //  Here we'll create a new Group
+        firstGroup = game.add.group();
+        //  And add some sprites to it
+        for(var i = 0; i < 10; i++) {
+            //  Create a new sprite at a random screen location
+            var newSprite = new Phaser.Sprite(game, game.stage.randomX, game.stage.randomY, 'sonic');
+            //  This set-ups a listener for the event, view your console.log output to see the result
+            newSprite.events.onAddedToGroup.add(logGroupAdd);
+            //  Add the sprite to the Group
+            firstGroup.add(newSprite);
+        }
+    }
+    function logGroupAdd(sprite, group, zIndex) {
+        console.log('Sprite added to Group', group.ID, 'at z-index:', zIndex);
+    }
+})();

Tests/groups/create group 1.ts

@@ -0,0 +1,43 @@
+/// <reference path="../../Phaser/Game.ts" />
+
+(function () {
+
+    var game = new Phaser.Game(this, 'game', 800, 600, init, create);
+
+    function init() {
+
+        //  Using Phasers asset loader we load up a PNG from the assets folder
+        game.loader.addImageFile('sonic', 'assets/sprites/sonic_havok_sanity.png');
+        game.loader.load();
+
+    }
+
+    var firstGroup: Phaser.Group;
+
+    function create() {
+
+        //  Here we'll create a new Group
+        firstGroup = game.add.group();
+
+        //  And add some sprites to it
+        for (var i = 0; i < 10; i++)
+        {
+            //  Create a new sprite at a random screen location
+            var newSprite: Phaser.Sprite = new Phaser.Sprite(game, game.stage.randomX, game.stage.randomY, 'sonic');
+
+            //  This set-ups a listener for the event, view your console.log output to see the result
+            newSprite.events.onAddedToGroup.add(logGroupAdd);
+
+            //  Add the sprite to the Group
+            firstGroup.add(newSprite);
+        }
+
+    }
+
+    function logGroupAdd(sprite: Phaser.Sprite, group: Phaser.Group, zIndex: number) {
+
+        console.log('Sprite added to Group', group.ID, 'at z-index:', zIndex);
+
+    }
+
+})();

Tests/groups/display order.js

@@ -0,0 +1,30 @@
+/// <reference path="../../Phaser/Game.ts" />
+(function () {
+    var game = new Phaser.Game(this, 'game', 800, 600, init, create);
+    function init() {
+        game.loader.addImageFile('atari1', 'assets/sprites/atari130xe.png');
+        game.loader.addImageFile('atari2', 'assets/sprites/atari800xl.png');
+        game.loader.addImageFile('card', 'assets/sprites/mana_card.png');
+        game.loader.load();
+    }
+    var items;
+    var card;
+    function create() {
+        items = game.add.group();
+        //  Items are rendered in the depth order in which they are added to the Group
+        items.addNewSprite(64, 100, 'atari1');
+        card = items.addNewSprite(240, 80, 'card');
+        items.addNewSprite(280, 100, 'atari2');
+        game.input.onTap.addOnce(removeCard, this);
+    }
+    function removeCard() {
+        //  Now let's kill the card sprite
+        card.kill();
+        game.input.onTap.addOnce(replaceCard, this);
+    }
+    function replaceCard() {
+        //  And bring it back to life again - I assume it will render in the same place as before?
+        var bob = items.getFirstDead();
+        bob.revive();
+    }
+})();

Tests/groups/display order.ts

@@ -0,0 +1,52 @@
+/// <reference path="../../Phaser/Game.ts" />
+
+(function () {
+
+    var game = new Phaser.Game(this, 'game', 800, 600, init, create);
+
+    function init() {
+
+        game.loader.addImageFile('atari1', 'assets/sprites/atari130xe.png');
+        game.loader.addImageFile('atari2', 'assets/sprites/atari800xl.png');
+        game.loader.addImageFile('card', 'assets/sprites/mana_card.png');
+
+        game.loader.load();
+
+    }
+
+    var items: Phaser.Group;
+    var card: Phaser.Sprite;
+
+    function create() {
+
+        items = game.add.group();
+
+        //  Items are rendered in the depth order in which they are added to the Group
+
+        items.addNewSprite(64, 100, 'atari1');
+        card = items.addNewSprite(240, 80, 'card');
+        items.addNewSprite(280, 100, 'atari2');
+
+        game.input.onTap.addOnce(removeCard, this);
+
+    }
+
+    function removeCard() {
+
+        //  Now let's kill the card sprite
+        card.kill();
+
+        game.input.onTap.addOnce(replaceCard, this);
+
+    }
+
+    function replaceCard() {
+
+        //  And bring it back to life again - I assume it will render in the same place as before?
+        var bob = items.getFirstDead();
+
+        bob.revive();
+
+    }
+
+})();

Tests/groups/swap children.js

@@ -0,0 +1,21 @@
+/// <reference path="../../Phaser/Game.ts" />
+(function () {
+    var game = new Phaser.Game(this, 'game', 800, 600, init, create);
+    function init() {
+        game.loader.addImageFile('atari1', 'assets/sprites/atari130xe.png');
+        game.loader.addImageFile('atari2', 'assets/sprites/atari800xl.png');
+        game.loader.load();
+    }
+    var atari1;
+    var atari2;
+    function create() {
+        //  Items are rendered in the depth order in which they are added to the Group
+        atari1 = game.add.sprite(100, 100, 'atari1');
+        atari2 = game.add.sprite(250, 90, 'atari2');
+        game.input.onTap.add(swapSprites, this);
+    }
+    function swapSprites() {
+        //  The 2 Sprites are in the global world Group, but this will work for any Group:
+        game.world.group.swap(atari1, atari2);
+    }
+})();

Tests/groups/swap children.ts

@@ -0,0 +1,38 @@
+/// <reference path="../../Phaser/Game.ts" />
+
+(function () {
+
+    var game = new Phaser.Game(this, 'game', 800, 600, init, create);
+
+    function init() {
+
+        game.loader.addImageFile('atari1', 'assets/sprites/atari130xe.png');
+        game.loader.addImageFile('atari2', 'assets/sprites/atari800xl.png');
+
+        game.loader.load();
+
+    }
+
+    var atari1: Phaser.Sprite;
+    var atari2: Phaser.Sprite;
+
+    function create() {
+
+        //  Items are rendered in the depth order in which they are added to the Group
+
+        atari1 = game.add.sprite(100, 100, 'atari1');
+        atari2 = game.add.sprite(250, 90, 'atari2');
+
+        game.input.onTap.add(swapSprites, this);
+
+    }
+
+    function swapSprites() {
+
+        //  The 2 Sprites are in the global world Group, but this will work for any Group:
+        game.world.group.swap(atari1, atari2);
+
+    }
+
+
+})();