callidus

Members
  • Content Count

    22
  • Joined

  • Last visited

About callidus

  • Rank
    Member

Recent Profile Visitors

1061 profile views
  1. knight = game.add.sprite(game.width/2,game.height-175,'knight'); game.physics.enable(knight, Phaser.Physics.ARCADE); knight.body.collideWorldBounds = true; weapon = knight.addChild(game.make.sprite(15, -15, 'greatsword')); //weapon.anchor.setTo(1,1) Knight is my player, and he holds a sword that I implemented as a child of the knight. My issue is that it follows the player but doesn't flip when he turns. I tried to set the weapon as an anchor but I get an error "Cannot read property 'anchor' of undefined". Thanks for any help
  2. After looking through the docs I realized there's a function that solves my problem. I called: game.physics.arcade.moveToObject(bubbleBullet, bubbles.getAt(0), 800); this grabs the first spawned bubble (therefore closest to the cannon) and has the bullet move towards it.
  3. Thank you your implementation has been helpful. I noticed you used tweens, is there any way to do this with velocity? I'd prefer to implement the bullets movement with an x and y velocity based on the angle between the cannon and the bullet.
  4. I have a cannon and bubbles that spawn at random points from the top of the screen. The cannon currently faces the bubble that's closest to it. The issue is the bullet itself shoots in a straight line regardless of the angle of the cannon, I want the bullet to shoot in the same angle. I've tried using velocityFromAngle and such but can't seem to figure it out. If you look at my fireCannon() code on line 130 you can see my attempts commented out. Thank you for any assistance. // Initialize the Phaser Game object and set default game window size const game = new Phaser.Game(325, 600, Phaser.CANVAS, '', { preload: preload, create: create, update: update,}) scaleRatio = window.devicePixelRatio / 3; //LEAVE SCALLING WILL BE IMPLEMENTED AT END //Scaling Examples //game.world.height - 50 //game.add.sprite(game.world.centerX, game.world.centerY, 'mySprite'); function preload (){ game.load.spritesheet('buttons', 'assets/buttons/spritesheetSmall.png', 61,54,8); game.load.spritesheet('bubbles', 'assets/bubbles/bubbleSpritesheet.png', 93,93,6); game.load.image('finishLine', 'assets/finishLine.png'); game.load.image('bullet','assets/bullet.png'); game.load.image('cannon','assets/cannon/cannon.png'); } function create () { game.physics.startSystem(Phaser.Physics.ARCADE); //VARIABLES //bubbles CBUBBLE = 0; //current target bubble BVALUES = []; //contains all the bubble values VELOCITY = 20; //Speed of the bubbles BUBBLESPAWNTIME = 5; BUBBLEBULLETSPEED = -700; //cannon TARGET = 0; TARGETx = 0; TARGETy = 0; ROTATION = 0; //button currButton = 0; //0 = 2, 1 = 3, etc. Index represents number on numpad //ENVIRONMENT game.stage.backgroundColor = "#D076E7" mainButton = game.add.button(game.width/2 - 30, 500, 'buttons', buttonPressOne, this, 0 , 0, 0, 0); bubbles = game.add.group(); bubbles.enableBody = true; bubbles.createMultiple(50,'bubbles'); cannon = game.add.sprite(game.width/2 , 415, 'cannon'); cannon.anchor.setTo(0.5,0.5); cannonBullet = game.add.group(); cannonBullet.enableBody = true; cannonBullet.physicsBodyType = Phaser.Physics.ARCADE; cannonBullet.createMultiple(1, 'bullet'); cannonBullet.setAll('anchor.x', 0.5); cannonBullet.setAll('anchor.y', 0.5); cannonBullet.setAll('outOfBoundsKill', true); cannonBullet.setAll('checkWorldBounds', true); //CONTROLS cursors = game.input.keyboard.createCursorKeys(); game.input.keyboard.addKeyCapture([ Phaser.Keyboard.SPACEBAR ]); //TIME BASED EVENTS game.time.events.loop(Phaser.Timer.SECOND * BUBBLESPAWNTIME, spawnCoord, this); //INITIAL SPAWN spawnCoord() } function update () { //CENTERS SCREEN game.scale.pageAlignHorizontally = true; game.scale.pageAlignVertically = true; game.scale.refresh(); //CURR BUBBLE VALUE if(bubbles.countLiving() > 0){ currValue = BVALUES[CBUBBLE]; } else{ currValue = 0; } //CANNONS DIRECTION if(bubbles.countLiving() > 0){ TARGETx = bubbles.getAt(0).x; TARGETy = bubbles.getAt(0).y; ROTATION = game.math.angleBetween(cannon.x, cannon.y, TARGETx, TARGETy) cannon.angle = ROTATION; } else{ TARGET = 0; cannon.angle = TARGET; } game.physics.arcade.overlap(cannonBullet, bubbles, popBubble); } //BUTTON HANDLERS-------------------- function buttonPressOne(){ fireCannon() } //SPAWNING BUBBLES-------------------- function spawnCoord(){ //random frame (color) and coordinate for each bubble xCoord = game.rnd.integerInRange(93,game.world.width-93); frame = game.rnd.integerInRange(0,5); createBubble(xCoord,frame); } function createBubble(xCoord, frame){ bubbleInstance = bubbles.getFirstDead(); bubbleInstance.reset(xCoord,0); bubbleInstance.anchor.setTo(0.5, 0.5); bubbleInstance.body.velocity.y = VELOCITY; bubbleInstance.frame = frame; } //CANNON VARIABLE-------------------- function fireCannon() { if (bubbles.countLiving() > 0){ bubbleBullet = cannonBullet.getFirstExists(false); if (bubbleBullet) { bubbleBullet.enableBody; bubbleBullet.reset(cannon.x - 2.5, cannon.y - 50); bubbleBullet.anchor.setTo(0.5,0.5); bubbleBullet.rotation = cannon.rotation; //angle = game.math.angleBetween(cannon.x, cannon.y, bubbles.getAt(0).x, bubbles.getAt(0).y) //game.scene.physics.velocityFromAngle(angle, 700, bubbleBullet.body.velocity); bubbleBullet.body.velocity.y = BUBBLEBULLETSPEED; bubbleBullet.outOfBoundsKill = true; } } } function popBubble(bulletInstance, bubbleInstance){ bubbleInstance.kill() }
  5. I see thank you this worked, I was over-complicating the problem in my head
  6. I've tried adding the text like this: function createBubble(xCoord, frame,value){ bubbleInstance = bubbles.getFirstDead(); bubbleInstance.reset(xCoord,0); bubbleInstance.anchor.setTo(0.5, 0.5); bubbleInstance.body.velocity.y = VELOCITY; bubbleInstance.frame = frame; //tracking the value of each bubble in an array BVALUES[currIndex] = value; currIndex++ bubbleInstance.addChild(game.make.text(0,0,BVALUES[currIndex])) //NEW LINE HERE } but I'm not sure how to handle changing the text. Lets say I have a function that handles the text change with setText, how should I refer to this instance of the text?
  7. I have a unique health value for each instance of a group, and I want to display it on the sprite as if it was a numeric health bar. Group object: Here is where my group members are being created. I have an array that stores a randomly generated health value and assigns it to the array based on the member that was produced (currIndex starts at 0). So I want to somehow associate the health value stored in the array with the current member, and display this over top of the sprite. So each sprite member has a corresponding health value in the array. Is there a better way to associate this value with that particular instance of the sprite / display it onscreen over-top the sprite. function createBubble(xCoord, frame,value){ bubbleInstance = bubbles.getFirstDead(); bubbleInstance.reset(xCoord,0); bubbleInstance.anchor.setTo(0.5, 0.5); bubbleInstance.body.velocity.y = VELOCITY; bubbleInstance.frame = frame; //tracking the value of each bubble in an array BVALUES[currIndex] = value; currIndex++ }
  8. I want the bullets to fire in the direction the ship is facing such as in this example: https://phaser.io/examples/v2/arcade-physics/asteroids-movement I have followed the same code structure but my bullets don't fire in the direction I'm facing. Code: // Initialize the Phaser Game object and set default game window size const game = new Phaser.Game(325, 600, Phaser.CANVAS, '', { preload: preload, create: create, update: update }) function preload () { //player assets game.load.spritesheet('player', 'assets/player_spaceship/tempShipSpsritesheet.png',80,60,2); game.load.image("bullet", 'assets/bullet.png'); } //bullet variables var bullets; var bulletTime = 0; var ebulletTime = 0; function create () { //Player Variables ---------------------------------- MAX_VELOCITY = 200; // pixels/second DRAG = 100; // pixels/second game.physics.startSystem(Phaser.Physics.ARCADE); playerbullets = game.add.group(); playerbullets.enableBody = true; playerbullets.physicsBodyType = Phaser.Physics.ARCADE; playerbullets.createMultiple(10000, 'bullet'); playerbullets.setAll('anchor.x', 0.5); playerbullets.setAll('anchor.y', 0.5); playerbullets.setAll('outOfBoundsKill', true); playerbullets.setAll('checkWorldBounds', true); player = game.add.sprite(game.width/2,game.height,'player',0); game.physics.enable(player, Phaser.Physics.ARCADE); player.body.maxVelocity.set(MAX_VELOCITY) player.body.drag.set(DRAG) player.anchor.set(0.5); player.body.collideWorldBounds = true; //Environment -------------------------------- game.stage.backgroundColor = "#4488AA" //Controls ----------------------------------- cursors = game.input.keyboard.createCursorKeys(); game.input.keyboard.addKeyCapture([ Phaser.Keyboard.SPACEBAR ]); } function update () { //Centers screen game.scale.pageAlignHorizontally = true; game.scale.pageAlignVertically = true; game.scale.refresh(); if (cursors.up.isDown){ game.physics.arcade.accelerationFromRotation(player.rotation, 200, player.body.acceleration); //player.animations.play('thrusters', 30, true); } else{ player.body.acceleration.set(0); } if(cursors.left.isDown){ player.body.angularVelocity = -300; } else if(cursors.right.isDown){ player.body.angularVelocity = 300; } else{ player.body.angularVelocity = 0; } if(game.input.keyboard.isDown(Phaser.Keyboard.SPACEBAR)){ PlayerBulletFired() } } function PlayerBulletFired () { if (game.time.now > bulletTime)//adds a delay to the bullet time { bullet = playerbullets.getFirstExists(false); if (bullet) { bullet.scale.setTo(0.2,0.2); bullet.reset(player.body.x, player.body.y); bullet.rotation = player.rotation; game.physics.arcade.velocityFromRotation(player.rotation, 400, bullet.body.velocity); bullet.body.velocity.y = -400; bulletTime = game.time.now + 50; } } }
  9. Thanks to both of you, this solved my problem. Damn this community is fast I posted this like an hour ago lol.
  10. I have been trying to separate my code into states but no matter what I try the game comes up with a black screen, and an error saying "No state found with the key: playTest " . Here is my code: Thanks for any help this has been bothering me for a while *Note: each colour is a different file (index,load and playTest). Index: <!DOCTYPE html><html> <head><meta charset="utf-8" /><script src="phaser.js"></script><script src="load.js"></script><script src="playTest.js"></script></head> <body> <script> function create() { var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'game'); game.state.add("load",load);game.state.add("playTest",playTest);game.state.start("playTest");};</script></body</html> load: var load = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create}); function preload() {cursors = this.game.input.keyboard.createCursorKeys(); //allows keyboard inputthis.game.load.image("sky","assets/sky.png");} function create() {this.game.state.start("playTest")} play: var playTest = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update,}); function create() {this.game.add.image(0,0,"sky");this.game.add.text(16,16,"test");this.game.scale.pageAlignHorizontally = true; //centers canvasthis.game.scale.pageAlignVertically = true;this.game.scale.refresh(); } function update() { }
  11. In my game I want an animation to play when the player collides with a red block and dies. I used the arcade physics system and said a function called gameOver should trigger when the player and a block overlap. The animation I'm using is an explosion, the function then calls for the player to be killed and removed from the canvas and for the explosion sprite to be added and for it's animation to play. The problem is that the function only plays the first frame, I'm assuming this is because either the function only runs once after they overlap or because the player dies and therefore without the player nothing is overlapping and the function stops. Tl;Dr: how do you make a death animation play after a sprite dies Thanks for any help My code: *Note the relevant part is coloured green. var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update,});var Rx = Math.random () * 800; // ball spawns in a random placevar Ry = Math.random() * 600;var Bx = Math.random () * 800; var By = Math.random() * 600;var Gx = Math.random () * 800 var Gy = Math.random() * 600;var colours = ["redBlock","greenBlock","blueBlock"];var colour = colours[Math.floor(Math.random()*2)];var score = 0; var scoreText;var collideCounter = 0;var playerX = 10;var playerY = 10; function preload() {cursors = game.input.keyboard.createCursorKeys(); //allows keyboard inputthis.game.load.image("redBlock","assets/red.png");this.game.load.image("greenBlock","assets/green.png");this.game.load.image("blueBlock","assets/blue.png");this.game.load.spritesheet("explosion","assets/explosionSheet.png",433,410);this.game.load.image("block","assets/block.png");} function create() {this.game.physics.startSystem(Phaser.Physics.ARCADE);this.game.scale.pageAlignHorizontally = true; //centers canvasthis.game.scale.pageAlignVertically = true;this.game.scale.refresh(); Rblock = game.add.group(); Rblock.enableBody = true; for (var i = 1; i < 4 ; i++){var RblockT = Rblock.create(i * Rx,i * Ry,"redBlock"); // x and y are randomy coordinates the ball spawns atRblockT.body.velocity.setTo(200,200);RblockT.body.collideWorldBounds = true; RblockT.body.bounce.set(1);} Bblock = game.add.group(); Bblock.enableBody = true; for (var i = 1; i < 4; i++){BblockT = Bblock.create(i * Bx,i * By,"blueBlock"); // x and y are randomy coordinates the ball spawns atBblockT.body.velocity.setTo(200,200);BblockT.body.collideWorldBounds = true; BblockT.body.bounce.set(1);} Gblock = game.add.group(); Gblock.enableBody = true; for (var i = 1; i < 4 ; i++){GblockT = Gblock.create(i * Gx,i * Gy,"greenBlock"); // x and y are randomy coordinates the ball spawns atthis.game.physics.arcade.enable(Gblock);GblockT.body.velocity.setTo(200,200);GblockT.body.collideWorldBounds = true; GblockT.body.bounce.set(1);} player = this.game.add.sprite(10,10,"block");this.game.physics.arcade.enable(player);player.body.collideWorldBounds = true;player.scale.setTo(0.2,0.2); explosion = this.game.add.sprite(800,700,"explosion");explosion.animations.add ("explode",[1,0,2],2,true); scoreText = this.game.add.text(16,16,"Score:0",{ FontSize: "32px",fill: "#CCFFFF"});test = this.game.add.text(16,32,"test:",{ FontSize: "32px",fill: "#CCFFFF"});test2 = this.game.add.text(16,50,"test:",{ FontSize: "32px",fill: "#CCFFFF"});} function update() {this.game.physics.arcade.overlap(player,Rblock,gameOver,null,this);this.game.physics.arcade.overlap(player,Gblock,addPointG,null,this);this.game.physics.arcade.overlap(player,Bblock,addPointB,null,this); function addPointR (player, RblockT){score += 1;scoreText.text = "Score:" + score;RblockT.kill();} function addPointG (player, GblockT){score += 1;scoreText.text = "Score:" + score;GblockT.kill();} function addPointB (player, BblockT){score += 1;scoreText.text = "Score:" + score;BblockT.kill();} function gameOver(){player.kill();explosion = this.game.add.sprite(player.body.x,player.body.y,"explosion");explosion.anchor.setTo(0.5,0.5);explosion.animations.play("explode");} playerY = player.body.velocity.y; //playerY tracks the y coordinate of the player and is used to tell where the explosion should spawnplayerX = player.body.velocity.x; //playerX tracks the x coordinate of the player and is used to tell where the explosion should spawnplayer.body.velocity.x = 0;player.body.velocity.y = 0; if (cursors.up.isDown){player.body.velocity.y += -200;} if (cursors.down.isDown){player.body.velocity.y += 200;} if (cursors.left.isDown){player.body.velocity.x += -200;} if(cursors.right.isDown){player.body.velocity.x += 200;}}
  12. *face-palm*, thanks, didn't even notice the for loop started at 0.
  13. In my code im trying to have 3 diff colour blocks spawn in various areas on the screen, but one of the three red blocks spawns exactly on top of a blue one every single time. It makes no sense as I am using a math.random and have even used a game.add.text to make sure that the numbers aren't exactly the same yet it keeps happening. The relevant code is in green, thanks for any help. My code: var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update,});var Rx = Math.random () * 800; // ball spawns in a random placevar Ry = Math.random() * 600; // X and Y coordinate for each colour blockvar Bx = Math.random () * 800; var By = Math.random() * 600;var Gx = Math.random () * 800 var Gy = Math.random() * 600;var text; var colours = ["redBlock","greenBlock","blueBlock"];var colour = colours[Math.floor(Math.random()*2)]; function preload() {cursors = game.input.keyboard.createCursorKeys(); //allows keyboard inputthis.game.load.image("block","assets/block.png");this.game.load.image("redBlock","assets/red.png");this.game.load.image("greenBlock","assets/green.png");this.game.load.image("blueBlock","assets/blue.png");} function create() {this.game.physics.startSystem(Phaser.Physics.ARCADE);this.game.scale.pageAlignHorizontally = true; //centers canvasthis.game.scale.pageAlignVertically = true;this.game.scale.refresh(); for (var i = 0; i < 3 ; i++){Rblock = this.game.add.sprite(i * Rx,i * Ry,"redBlock"); // x and y are randomy coordinates the ball spawns atthis.game.physics.arcade.enable(Rblock);Rblock.body.velocity.setTo(200,200);Rblock.body.collideWorldBounds = true; Rblock.body.bounce.set(1);} for (var i = 0; i < 3; i++){Bblock = this.game.add.sprite(i * Bx,i * By,"blueBlock"); // x and y are randomy coordinates the ball spawns atthis.game.physics.arcade.enable(Bblock);Bblock.body.velocity.setTo(200,200);Bblock.body.collideWorldBounds = true; Bblock.body.bounce.set(1);} for (var i = 0; i < 3 ; i++){Gblock = this.game.add.sprite(i * Gx,i * Gy,"greenBlock"); // x and y are randomy coordinates the ball spawns atthis.game.physics.arcade.enable(Gblock);Gblock.body.velocity.setTo(200,200);Gblock.body.collideWorldBounds = true; Gblock.body.bounce.set(1);} player = this.game.add.sprite(10,10,"block");this.game.physics.arcade.enable(player);player.anchor.set(0.5);player.body.drag.set(100);player.body.maxVelocity.set(300);//player.scale.setTo(0.2,0.2);player.body.collideWorldBounds = true; game.add.text(16,16,Rx + Ry);game.add.text(16,40,Bx + By);} function update() { if (cursors.up.isDown){this.game.physics.arcade.accelerationFromRotation(player.rotation,200,player.body.acceleration);}else{player.body.acceleration.set(0);}if (cursors.left.isDown){player.body.angularVelocity = -300} else if(cursors.right.isDown){player.body.angularVelocity = 300;}else{player.body.angularVelocity = 0;}}
  14. Thank you very much for the answer, it worked perfectly.