New user submitted examples

README.md

@@ -52,6 +52,14 @@ New features:
 * Added Device.vibration to check if the Vibration API is available or not.
 * Added Device.trident and Device.tridentVersion for testing IE11 and forced IE11 to Canvas renderer until pixi updates to support it.
 
+New Examples:
+
+* Physics - Bounce by Patrick OReilly.
+* Physics - Bounce with gravity by Patrick OReilly.
+* Physics - Bounce accelerator (use the keyboard) by Patrick OReilly.
+* Physics - Bounce knock (use the keyboard) by Patrick OReilly.
+* Physics - Snake (use the keyboard to control the snake like creature) by Patrick OReilly and Richard Davey.
+
 Updates:
 
 * When a Sprite is destroyed any active filters are removed as well.

examples/physics/bounce accelerator.js

@@ -0,0 +1,94 @@
+// mods by Patrick OReilly 
+// Twitter: @pato_reilly Web: http://patricko.byethost9.com
+
+var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render });
+
+function preload() {
+
+    game.load.spritesheet('dude', 'assets/games/starstruck/dude.png', 32, 48);
+    
+}
+
+var flyer;
+
+function create() {
+
+    cursors = game.input.keyboard.createCursorKeys();
+
+    flyer = game.add.sprite(400, 200, 'dude');
+
+    flyer.animations.add('left', [0, 1, 2, 3], 10, true);
+    flyer.animations.add('right', [5, 6, 7, 8], 10, true);
+    
+    //  This gets it moving
+    flyer.body.velocity.setTo(200, 200);
+    
+    //  This makes the game world bounce-able
+    flyer.body.collideWorldBounds = true;
+    
+    //  This sets the image bounce energy for the horizontal 
+    //  and vertical vectors (as an x,y point). "1" is 100% energy return
+    flyer.body.bounce.setTo(0.8, 0.8);
+    
+    //  This sets the gravity the sprite responds to in the world, as a point
+    //  Leave x=0 and set y=8 to simulate falling
+    flyer.body.gravity.setTo(0, 8);
+
+}
+
+//  Change the vertical and horizontal acceleration property accordingly with the key pressed
+//  Also turn on and off the animation. Dude should have wings ;)
+
+function update () {
+
+    if (cursors.up.isDown)
+    {
+        flyer.body.acceleration.y = -600;
+
+        if (flyer.body.velocity.x > 0)
+        {
+            flyer.animations.play('right');
+        }
+        else
+        {
+            flyer.animations.play('left');
+        }
+    }
+    else if (cursors.down.isDown)
+    {
+        flyer.body.acceleration.y = 600;
+
+        if (flyer.body.velocity.x > 0)
+        {
+            flyer.animations.play('right');
+        }
+        else
+        {
+            flyer.animations.play('left');
+        }
+    }
+    else if (cursors.left.isDown)
+    {
+        flyer.body.acceleration.x = -500;
+        flyer.animations.play('left');
+    }
+    else if (cursors.right.isDown)
+    {
+        flyer.body.acceleration.x = 500;
+        flyer.animations.play('right');
+    }
+    else
+    {
+        flyer.frame = 4;
+        flyer.body.acceleration.setTo(0,0);
+        flyer.animations.stop();
+    }
+    
+}
+
+function render () {
+
+    //debug helper
+    game.debug.renderSpriteInfo(flyer,32,32);
+
+}

examples/physics/bounce knock.js

@@ -0,0 +1,75 @@
+// mods by Patrick OReilly 
+// Twitter: @pato_reilly Web: http://patricko.byethost9.com
+
+var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render });
+
+function preload() {
+
+    game.load.image('dude', 'assets/sprites/phaser-dude.png');
+    game.load.image('ball', 'assets/sprites/pangball.png');
+    
+}
+
+var image;
+
+function create() {
+
+    cursors = game.input.keyboard.createCursorKeys();
+    
+    //  This creates a simple sprite that is using our loaded image and
+    //  displays it on-screen
+    //  and assign it to a variable
+    ball = game.add.sprite(400, 200, 'ball');
+    knocker = game.add.sprite(400, 200, 'dude');
+
+    //  This gets it moving
+    ball.body.velocity.setTo(200, 200);
+
+    //  This makes the game world bounce-able
+    ball.body.collideWorldBounds = true;
+
+    //  This sets the image bounce energy for the horizontal 
+    //  and vertical vectors (as an x,y point). "1" is 100% energy return
+    ball.body.bounce.setTo(1, 1);
+
+    //  This sets the gravity the sprite responds to in the world, as a point
+    //  Here we leave x=0 and set y=8 to simulate falling
+    ball.body.gravity.setTo(0, 8);
+
+}
+
+//  Move the knocker with the arrow keys
+function update () {
+
+    if (cursors.up.isDown)
+    {
+        knocker.body.velocity.y = -400;
+    }
+    else if (cursors.down.isDown)
+    {
+        knocker.body.velocity.y =  400;
+    }
+    else if (cursors.left.isDown)
+    {
+        knocker.body.velocity.x = -400;
+    }
+    else if (cursors.right.isDown)
+    {
+        knocker.body.velocity.x = 400;
+    } 
+    else
+    {
+        knocker.body.velocity.setTo(0, 0);
+    }
+        
+    //  Enable physics between the knocker and the ball
+    game.physics.collide(knocker, ball);
+    
+}
+
+function render () {
+
+    //debug helper
+    game.debug.renderSpriteInfo(ball, 32, 32);
+
+}

examples/physics/bounce with gravity.js

@@ -0,0 +1,50 @@
+// mods by Patrick OReilly 
+// Twitter: @pato_reilly Web: http://patricko.byethost9.com
+
+var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render });
+
+function preload() {
+
+    //  You can fill the preloader with as many assets as your game requires
+
+    //  Here we are loading an image. The first parameter is the unique
+    //  string by which we'll identify the image later in our code.
+
+    //  The second parameter is the URL of the image (relative)
+    game.load.image('flyer', 'assets/sprites/phaser-dude.png');
+}
+
+var image;
+
+function create() {
+
+    //  This creates a simple sprite that is using our loaded image and displays it on-screen and assign it to a variable
+    image = game.add.sprite(400, 200, 'flyer');
+    
+    //  This gets it moving
+    image.body.velocity.setTo(200, 200);
+    
+    //  This makes the game world bounce-able
+    image.body.collideWorldBounds = true;
+    
+    //  This sets the image bounce energy for the horizontal  and vertical vectors (as an x,y point). "1" is 100% energy return
+    image.body.bounce.setTo(0.8, 0.8);
+    
+    //  This sets the gravity the sprite responds to in the world, as a point
+    //  Leave x=0 and set y=8 to simulate falling
+    image.body.gravity.setTo(0, 8);
+
+}
+
+function update () {
+
+    // nothing required here
+    
+}
+
+function render () {
+
+    //debug helper
+    game.debug.renderSpriteInfo(image,32,32);
+
+}

examples/physics/bounce.js

@@ -0,0 +1,47 @@
+// mods by Patrick OReilly 
+// Twitter: @pato_reilly Web: http://patricko.byethost9.com
+
+var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render });
+
+function preload() {
+
+    //  You can fill the preloader with as many assets as your game requires
+
+    //  Here we are loading an image. The first parameter is the unique
+    //  string by which we'll identify the image later in our code.
+
+    //  The second parameter is the URL of the image (relative)
+    game.load.image('flyer', 'assets/sprites/phaser-dude.png');
+}
+
+var image;
+
+function create() {
+
+    //  This creates a simple sprite that is using our loaded image and
+    //  displays it on-screen
+    //  and assign it to a variable
+    image = game.add.sprite(0, 0, 'flyer');
+    
+    //  This gets it moving
+    image.body.velocity.setTo(200,200);
+    
+    //  This makes the game world bounce-able
+    image.body.collideWorldBounds = true;
+    
+    //  This sets the image bounce energy for the horizontal 
+    //  and vertical vectors. "1" is 100% energy return
+    image.body.bounce.setTo(1,1);
+
+}
+
+function update () {
+
+//nothing required here
+    
+}
+
+function render () {
+    //debug helper
+    game.debug.renderSpriteInfo(image,32,32);
+}

examples/physics/snake.js

@@ -0,0 +1,82 @@
+// Snake by Patrick OReilly and Richard Davey
+// Twitter: @pato_reilly Web: http://patricko.byethost9.com
+
+var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update,render : render });
+
+function preload() {
+
+    game.load.image('ball','assets/sprites/shinyball.png');
+
+}
+
+var snakeHead; //head of snake sprite
+var snakeSection = new Array(); //array of sprites that make the snake body sections
+var snakePath = new Array(); //arrary of positions(points) that have to be stored for the path the sections follow
+var numSnakeSections = 30; //number of snake body sections
+var snakeSpacer = 6; //parameter that sets the spacing between sections
+
+function create() {
+
+    game.world.setBounds(0, 0, 800, 600);
+
+    cursors = game.input.keyboard.createCursorKeys();
+
+    snakeHead = game.add.sprite(400, 300, 'ball');
+    snakeHead.anchor.setTo(0.5, 0.5);
+    
+    //  Init snakeSection array
+    for (var i = 1; i <= numSnakeSections-1; i++)
+    {
+        snakeSection[i] = game.add.sprite(400, 300, 'ball');
+        snakeSection[i].anchor.setTo(0.5, 0.5);
+    }
+    
+    //  Init snakePath array
+    for (var i = 0; i <= numSnakeSections * snakeSpacer; i++)
+    {
+        snakePath[i] = new Phaser.Point(400, 300);
+    }
+
+}
+
+function update() {
+
+    snakeHead.body.velocity.setTo(0, 0);
+    snakeHead.body.angularVelocity = 0;
+
+    if (cursors.up.isDown)
+    {
+        snakeHead.body.velocity.copyFrom(game.physics.velocityFromAngle(snakeHead.angle, 300));
+
+        // Everytime the snake head moves, insert the new location at the start of the array, 
+        // and knock the last position off the end
+
+        var part = snakePath.pop();
+
+        part.setTo(snakeHead.x, snakeHead.y);
+
+        snakePath.unshift(part);
+
+        for (var i = 1; i <= numSnakeSections - 1; i++)
+        {
+            snakeSection[i].x = (snakePath[i * snakeSpacer]).x;
+            snakeSection[i].y = (snakePath[i * snakeSpacer]).y;
+        }
+    }
+
+    if (cursors.left.isDown)
+    {
+        snakeHead.body.angularVelocity = -300;
+    }
+    else if (cursors.right.isDown)
+    {
+        snakeHead.body.angularVelocity = 300;
+    }
+
+}
+
+function render() {
+
+    game.debug.renderSpriteInfo(snakeHead, 32, 32);
+
+}

examples/wip/snake2.js

@@ -0,0 +1,84 @@
+// Snake by Patrick OReilly and Richard Davey
+// Twitter: @pato_reilly Web: http://patricko.byethost9.com
+
+var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update,render : render });
+
+function preload() {
+
+    game.load.image('ball','assets/sprites/shinyball.png');
+
+}
+
+var snakeHead; //head of snake sprite
+var snakeSection = new Array(); //array of sprites that make the snake body sections
+var snakePath = new Array(); //arrary of positions(points) that have to be stored for the path the sections follow
+var numSnakeSections = 6; //number of snake body sections
+var snakeSpacer = 6; //parameter that sets the spacing between sections
+
+function create() {
+
+    game.world.setBounds(0, 0, 800, 600);
+
+    cursors = game.input.keyboard.createCursorKeys();
+
+    snakeHead = game.add.sprite(400, 300, 'ball');
+    snakeHead.anchor.setTo(0.5, 0.5);
+    
+    //  Init snakeSection array
+    for (var i = 1; i <= numSnakeSections-1; i++)
+    {
+        snakeSection[i] = game.add.sprite(400, 300, 'ball');
+        snakeSection[i].anchor.setTo(0.5, 0.5);
+    }
+    
+    //  Init snakePath array
+    for (var i = 0; i <= numSnakeSections * snakeSpacer; i++)
+    {
+        snakePath[i] = new Phaser.Point(400, 300);
+    }
+
+    //snakeHead.body.velocity.setTo(0
+
+}
+
+function update() {
+
+    // snakeHead.body.velocity.setTo(0, 0);
+    snakeHead.body.angularVelocity = 0;
+    
+    // if (cursors.up.isDown)
+    // {
+        snakeHead.body.velocity.copyFrom(game.physics.velocityFromAngle(snakeHead.angle, 200));
+
+        // Everytime the snake head moves, insert the new location at the start of the array, 
+        // and knock the last position off the end
+
+        var part = snakePath.pop();
+
+        part.setTo(snakeHead.x, snakeHead.y);
+
+        snakePath.unshift(part);
+
+        for (var i = 1; i <= numSnakeSections - 1; i++)
+        {
+            snakeSection[i].x = (snakePath[i * snakeSpacer]).x;
+            snakeSection[i].y = (snakePath[i * snakeSpacer]).y;
+        }
+    // }
+
+    if (cursors.left.isDown)
+    {
+        snakeHead.body.angularVelocity = -300;
+    }
+    else if (cursors.right.isDown)
+    {
+        snakeHead.body.angularVelocity = 300;
+    }
+
+}
+
+function render() {
+
+    // game.debug.renderSpriteInfo(snakeHead, 32, 32);
+
+}