diff --git a/README.md b/README.md index 8065d94e..7ad7ace2 100644 --- a/README.md +++ b/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. diff --git a/examples/physics/bounce accelerator.js b/examples/physics/bounce accelerator.js new file mode 100644 index 00000000..90fd9b32 --- /dev/null +++ b/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); + +} \ No newline at end of file diff --git a/examples/physics/bounce knock.js b/examples/physics/bounce knock.js new file mode 100644 index 00000000..e01913e8 --- /dev/null +++ b/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); + +} diff --git a/examples/physics/bounce with gravity.js b/examples/physics/bounce with gravity.js new file mode 100644 index 00000000..9ba77429 --- /dev/null +++ b/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); + +} diff --git a/examples/physics/bounce.js b/examples/physics/bounce.js new file mode 100644 index 00000000..08047ad9 --- /dev/null +++ b/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); +} \ No newline at end of file diff --git a/examples/physics/snake.js b/examples/physics/snake.js new file mode 100644 index 00000000..b303cb88 --- /dev/null +++ b/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); + +} \ No newline at end of file diff --git a/examples/wip/snake2.js b/examples/wip/snake2.js new file mode 100644 index 00000000..185a29f4 --- /dev/null +++ b/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); + +} \ No newline at end of file