Search the Community

Hello, i have this script which is based on the tutorial: i want the player to navigate through the world, but it's constrained to a 800x600 box, (as this is the world WxH), the "game" world is a GIF 4096x3500. maybe this is not the correct way, could you please lead me into the correct way? this is the code: http://cypunkdb.net/t/phaser/tut1b/part7.html thanks

Hello, so what I am trying do is quite simple I think I just don't know the best way to execute it. I want the camera to follow the bullet up until it dies/takes impact to the enemy or boundary then the camera is handed back to the player. I tried an if statement about the bullet being alive and else it would return to the player and that caused the bullet to be stuck on itself. I have additional code as well in the beginning to tell it to follow the player as well as this code in the beginning not too sure if this is causing an overlap or what. game.camera.follow(player(); //weapon systems laser = game.add.weapon(10, 'bullet'); laser.bulletKillType = Phaser.Weapon.KILL_CAMERA_BOUNDS; laser.bulletSpeed = 600; laser.fireRate = 250; // set bullet collision area to match its visual size laser.setBulletBodyOffset(24, 12, 6, 6); fireSound = game.add.audio('gun', 0.1); laser.onFire.add(function(bullet) { fireSound.play(); game.camera.follow(bullet); });

I am looking for some guidance or example of how to integrate into my game the ability for users to create their own "player." I would like them to be able to select a character and then be able to customize that character (change hair; shape; body etc) prior to playing. I have searched extensively but have been unsuccessful in locating any assistance/tutorials/examples online for this type of action.

Hi, I'm a actually making a game using PHASER. On this game, player have to jump to escape balls rolling on the ground, like on an infinite runner. Actually, everything is working fine but the player is showed using a spritesheet divided on 128*128 resolution. The character animation running doesn't use 128 pixels on width causing the ball to collide with the player even if the player doesn't hit the ball. The player hitbox is actually configured to 128*128 but I know that in previous versions of PHASER, it was possible to render player to make his hitbox scale his skin. I didn't find this function in the actual version of PHASER. Can someone help ? Thanx in advance. For information : Phaser example on previous versions :

Hello, I've started using phaser just recently, I'm making a RPG game, and so far I've been learning how to make tilemaps, use spritesheets, animate sprites, and I'm falling in love with the framework, I just have a little problem. My player is set to collide with World Bounds, and it works for every bound, except the top one. I'm using the es6 webpack template, here's my, so far piece of code. create() method of my Game.js class. (I have nothing else in update, since I manage that in my own Sprite Class) this.game.world.setBounds(0, 0, 100 * 32, 100 * 32) this.game.physics.startSystem(Phaser.Physics.P2JS) this.game.time.advancedTiming = true this.game.stage.smoothed = false this.game.physics.p2.setImpactEvents(true) /* SET GAME MAP */ this.map = game.add.tiledmap('map') this.player = new Player({ game: this.game, x: 0, y: 0, lookId: 0, health: 100, mana: 100 }) this.game.world.setBounds(0, 0, 100 * 32, 100 * 32) Sprite Class import Phaser from 'phaser' import { Outfits } from './Outfits' const IMAGES = '../../assets/images/' const LOOK = { UP: 0, DOWN: 4, RIGHT: 2, LEFT: 6 } export default class extends Phaser.Sprite { constructor ({ game, x, y, lookId, health, mana }) { super( game, x * 32, y * 32, Outfits[lookId].sheets[0], Outfits[lookId].frame ) this.outfit = Outfits[lookId] this.mana = mana this.health = health this.smoothed = false this.anchor.setTo(1, 1) game.physics.p2.enable(this) this.body.setRectangle(32, 32) this.body.debug = true this.body.fixedRotation = true this.body.offset.x = -16 this.body.offset.y = -16 this.cursors = game.input.keyboard.createCursorKeys() game.camera.follow(this) game.add.existing(this) } /** * SETS A NEW FRAME TO THE PLAYER SPRITE LOOKING */ playerPosition (difference) { let spriteId = this.outfit.frame + difference let lastSprite = 143 if (spriteId > lastSprite) { this.loadTexture(this.outfit.sheets[1]) return spriteId - lastSprite } else { this.loadTexture(this.outfit.sheets[0]) return spriteId } } update () { this.body.setZeroVelocity() console.log('World position', this.worldPosition) // this.animations.play('moveUp', 5, true) if (this.cursors.up.isDown) { this.frame = this.playerPosition(LOOK.UP) // if (this.worldPosition.y <= 0) return this.body.moveUp(1000) // this.animations.play('up', 5, true) } if (this.cursors.right.isDown) { this.body.moveRight(1000) // this.animations.play('right', 5, true) this.frame = this.playerPosition(LOOK.RIGHT) } if (this.cursors.down.isDown) { this.body.moveDown(1000) this.frame = this.playerPosition(LOOK.DOWN) // this.animations.play('down', 5, true) } if (this.cursors.left.isDown) { this.body.moveLeft(1000) this.frame = this.playerPosition(LOOK.LEFT) // this.animations.play('left', 5, true) } // // if (this.game.camera.atLimit.x) { // console.log('LimitX', this.game.world) // // starfield.tilePosition.x -= (ship.body.velocity.x * game.time.physicsElapsed); // } // // if (this.game.camera.atLimit.y) { // console.log('LimitY', this.game.world) // // starfield.tilePosition.y -= (ship.body.velocity.y * game.time.physicsElapsed); // } // this.game.input.keyboard.onUpCallback = e => { // this.player.animations.stop() // if (e.keyCode == Phaser.Keyboard.UP) { // this.player.frame = this.playerStartingFrame + 3 // } // if (e.keyCode == Phaser.Keyboard.DOWN) { // this.player.frame = this.playerStartingFrame // } // if (e.keyCode == Phaser.Keyboard.LEFT) { // this.player.frame = this.playerStartingFrame + 9 // } // if (e.keyCode == Phaser.Keyboard.RIGHT) { // this.player.frame = this.playerStartingFrame + 6 // } // } } } In summary my player does collide with world bounds but only bottom, left and right, not top.

I'm still new to Phaser and coding in general so I apologize if this doesn't make sense. I have player gravity and bounce set to 0 and movement velocity cranked up so movement seems instant. I'm looking to make it so that once the player hits a certain point on the x axis it stops, then the movement key must be pressed again to continue in either direction until it hits another one of those points, and so on. One idea I had was to populate the screen with vertical immovable bars with collision spread out evenly, but I don't know how to make it so that once the player hits them and stops their momentum they can then proceed through them at the press of the movement key (or if thats even possible). I feel like its more likely that I'd be able to set a coordinate for movement to stop, but again I don't know if thats possible either. Any help would be appreciated!

Hi, I'm creating a game that player can walk over terrains with lots of slopes. How can I make my player rotate accordingly to the angle of the slope? This is how it's currently working: And this is how is must work (I've changed the angle manually): I'm using Box2D plugin to generate the terrain accordingly to an image. That's the reason of all these bodies. Thanks!!

help with collision. When I add collision it's layer has offset (or not work). You can show demo in https://game.tlgrm.info/phaser.html. var game = new Phaser.Game(900, 600, Phaser.AUTO, 'gameTroll', { preload: preload, create: create, update:update, render:render}); function preload () { game.load.tilemap('level', 'assets/level.json', null, Phaser.Tilemap.TILED_JSON); game.load.spritesheet('dude', 'assets/NPC.png', 16, 32); game.load.image('snow-expansion', 'assets/snow-expansion.png'); game.load.image('tiles_packed', 'assets/tiles_packed.png'); } var cursors; function create() { game.world.setBounds(0, 0, 1400, 1400); map = game.add.tilemap('level'); map.addTilesetImage('snow-expansion'); map.addTilesetImage('tiles_packed'); Voda = map.createLayer('Voda'); Ostrova = map.createLayer('Ostrova'); Atributika = map.createLayer('Atributika'); collision = map.createLayer('collision'); player = game.add.sprite(16, 32, 'dude'); map.setCollisionByExclusion([0], true, 'collision') Ostrova.resizeWorld() collision.resizeWorld() collision.debug = true player.animations.add('down', [0, 1, 2, 3], 7, true); player.animations.add('right', [4, 5, 6, 7], 7, true); player.animations.add('up', [8, 9, 10, 11], 7, true); player.animations.add('left', [12, 13, 14, 15], 7, true); game.physics.enable(player, Phaser.Physics.ARCADE); player.body.setSize(16, 32, 50, 50); player.body.bounce.y = 0; player.body.collideWorldBounds = true; player.bringToTop(); var startPos = map.objects.Meta.find(c => c.name == "start") player.x = startPos.x; player.y = startPos.y; game.camera.follow(player); // game.camera.x = 314; // game.camera.y = 390; cursors = game.input.keyboard.createCursorKeys(); } var facing; function update() { game.physics.arcade.collide(player, collision); player.body.velocity.x = 0; player.body.velocity.y = 0; if (cursors.left.isDown) { player.body.velocity.x = -100; if (facing != 'left') { player.animations.play('left'); facing = 'left'; } } else if (cursors.right.isDown) { player.body.velocity.x = 100; if (facing != 'right') { player.animations.play('right'); facing = 'right'; } } else if (cursors.up.isDown) { player.body.velocity.y = -100; if (facing != 'up') { player.animations.play('up'); facing = 'up'; } } else if (cursors.down.isDown) { player.body.velocity.y = 100; if (facing != 'down') { player.animations.play('down'); facing = 'down'; } } else { if (facing != 'idle') { player.animations.stop(); if (facing == 'down') { player.frame = 0; } else if (facing == 'right') { player.frame = 4; } else if (facing == 'up') { player.frame = 8; } else if (facing == 'left') { player.frame = 12; } facing = 'idle'; } } } function render() { game.debug.cameraInfo(game.camera, 32, 32); }

I'm creating an infinite scroller and (among other things) I'm having trouble with deducting player lives. I've looked at various tutorials, but most of them seem to kill the player whenever they hit an obstacle. Ideally, I'd like to deduct a life from the player until they have no more lives. The problem I'm experiencing is that I'm checking overlap with the player and a pool of enemies (btw, works the same way if I check for collision). In the callback, I only want to deduct a life the first time the player comes in contact with the enemy. What's happening now is that a single contact will destroy all the hearts. I've tried using a counter, but that doesn't seem to work well as any attempt to reset it seems to be happening too quickly. I've also tried to use signals, but they seem to result in the same behavior as using the callback. The code looks like this: // In update this.game.physics.arcade.overlap(this.player, this.enemiesPool, this.hurtPlayer, null, this); // Callback hurtPlayer: function(player, enemy) { console.log(this.hitCounter); //do this during overlap this.isHit = true; this.canShoot = false enemy.play('attacking'); player.play('hit'); //only destroy a heart the first time you contact the enemy //enemy should detract 1 heart at most // if (this.hitCounter <= 0) { // this.destroyHeart(); // } // this.hitCounter++; this.destroyHeart(); //enemy.kill(); }, //Destroy heart destroyHeart: function() { console.log(this.myLives); switch(this.myLives) { case 4: this.life4.destroy(); break; case 3: this.life3.destroy(); break; case 2: this.life2.destroy(); break; case 1: this.life1.destroy(); break; } this.myLives--; }, Any suggestions?

Hi, Im making a platformer in Phaser and have successfully loaded a tilemap but my player doesn't collide with the tilemap layer. Here's my code. var game = new Phaser.Game(304, 208, Phaser.AUTO, 'game', { preload: preload, create: create, update: update, render: render}); function preload() { this.game.load.atlas('player', 'assets/player/player_full.png', 'assets/player/player_full.json'); game.load.image('bg', 'assets/bg-LONG.jpg'); // TILEMAP game.load.tilemap('world', 'assets/tilemaps/world.json', null, Phaser.Tilemap.TILED_JSON); game.load.image('world_tiles', 'assets/tilemaps/world.png'); } var player; var facing = 'right'; var map; var tileset; var layer; function create() { // START PHYSICS game.physics.startSystem(Phaser.Physics.ARCADE); // ADD SPRITES game.add.tileSprite(0, 0, 900, 200, 'bg'); game.world.setBounds(0, 0, 900, 200); // PLAYER player = game.add.sprite(10, 176, 'player'); player.animations.add('idle_right', ['idle_1_right.png', 'idle_1_right.png', 'idle_2_right.png', 'idle_3_right.png'], 4, true); player.animations.add('running_right', ['running_1_right.png', 'running_2_right.png', 'running_3_right.png', 'running_4_right.png', 'running_5_right.png', 'running_6_right.png'], 9.5, true); player.animations.add('idle_left', ['idle_1_left.png', 'idle_1_left.png', 'idle_2_left.png', 'idle_3_left.png'], 4, true); player.animations.add('running_left', ['running_1_left.png', 'running_2_left.png', 'running_3_left.png', 'running_4_left.png', 'running_5_left.png', 'running_6_left.png'], 9.5, true); player.animations.add('jump_right', ['jump_1_right.png', 'jump_2_right.png', 'jump_3_right.png', 'jump_4_right.png', 'jump_5_right.png', 'jump_6_right.png'], 7, true); player.animations.add('jump_left', ['jump_1_left.png', 'jump_2_left.png', 'jump_3_left.png', 'jump_4_left.png', 'jump_5_left.png'], 7, true); // WORLD game.physics.arcade.gravity.y = 600; game.physics.enable(player, Phaser.Physics.ARCADE); player.body.collideWorldBounds = true; player.body.height = 24; // OTHER game.camera.follow(player); // TILEMAP map = game.add.tilemap('world'); map.addTilesetImage('world', 'world_tiles'); layer = map.createLayer('Tile Layer 1'); layer.resizeWorld(); } function update() { player.body.velocity.x = 0; game.physics.arcade.collide(player, layer); if (game.input.keyboard.isDown(Phaser.Keyboard.RIGHT)) { facing = 'right'; player.body.velocity.x = 90; player.animations.play('running_right'); }else if (game.input.keyboard.isDown(Phaser.Keyboard.LEFT)) { facing = 'left'; player.body.velocity.x = -90; player.animations.play('running_left'); } if (game.input.keyboard.isDown(Phaser.Keyboard.UP) && player.body.onFloor() && game.input.keyboard.addKey(Phaser.Keyboard.UP).downDuration(1)) { if (facing == 'right') { player.animations.play('jump_right'); player.body.velocity.y = -230; }else{ player.animations.play('jump_left'); player.body.velocity.y = -230; } } if (player.body.velocity.x == 0 && player.body.onFloor() && player.body.velocity.y == 0) { if (facing == 'right') { player.animations.play('idle_right'); }else{ player.animations.play('idle_left'); } } } function render(){ game.debug.spriteInfo(player, 10, 20); }

Hi, I have an idea of a game in which there would be a player who could collect different items(boots, helmet, pants, etc) It would really be a pain if I had to draw: 10 animation frames for normal character, 10 animation frames for character in boots, 10 animation frames for character in pants, 10 animation frames for character in pants,in boots, And so on..... You got me..(Of no, think of Minecraft or Terraria or Starbound where you can wear armor and stuff) So, my question is - Is it possible(in Phaser) to take different images(One for body, one for head, one for legs) and put them together and move,animate as if it was one image... Or maybe you have other suggestions?

Hello! I am making my first ever game and am having trouble getting my character to lose points. In the game, the character can collect two types of bottles. One of them rewards them points, while the other one I want to take away points. However, after doing the codes, my character is still getting points from collecting the wrong bottles (the ones that should take points away) This was the code I am using to take points from the player (it is in the update function) function collectbottle (player, bottle) { // Removes the bottle from the screen bottle.kill(); // Subtract and update the score score -= score -1; scoreText.text = 'score: '-score; } Anyone have tips or ideas of how to fix? Thank you!

Hello I am trying to develop a FPS using BabylonJS and CannonJS in TypeScript. My first problem was what type of Impostor to use as the player, end up using a Cylinder with a FixedRotation = true. Now I place the camera on top off the Cylinder on every frame, and apply Impulses to the Cylinder based on keyboard input, and camera target. The algorithm that I came up is the flowing (hero = Cylinder): scene.registerBeforeRender(function () { //Your code here //Step camera.position.x = hero.position.x; camera.position.y = hero.position.y + 1.0; camera.position.z = hero.position.z; let camFront = camera.getFrontPosition(1.0); let vecFront = camFront.subtract(camera.position); vecFront.normalize(); let finalVector = new BABYLON.Vector3(0.0, 0.0, 0.0); if (moveForward) { finalVector = finalVector.add(new BABYLON.Vector3(1.0 * vecFront.x, 0.0, 1.0 * vecFront.z)); } if (moveBackward) { finalVector = finalVector.add(new BABYLON.Vector3(-1.0 * vecFront.x, 0.0, -1.0 * vecFront.z)); } if (moveRight) { let q = BABYLON.Quaternion.RotationAxis(BABYLON.Axis.Y, BABYLON.Tools.ToRadians(90)); let m = new BABYLON.Matrix(); q.toRotationMatrix(m); let vecRight = BABYLON.Vector3.TransformCoordinates(vecFront, m); vecRight.normalize(); finalVector = finalVector.add(new BABYLON.Vector3(1.0 * vecRight.x, 0.0, 1.0 * vecRight.z)); } if (moveLeft) { let q = BABYLON.Quaternion.RotationAxis(BABYLON.Axis.Y, BABYLON.Tools.ToRadians(-90)); let m = new BABYLON.Matrix(); q.toRotationMatrix(m); let vecLeft = BABYLON.Vector3.TransformCoordinates(vecFront, m); vecLeft.normalize(); finalVector = finalVector.add(new BABYLON.Vector3(1.0 * vecLeft.x, 0.0, 1.0 * vecLeft.z)); } finalVector = finalVector.normalize(); hero.physicsImpostor.applyImpulse(new BABYLON.Vector3(15.0 * finalVector.x, 0.0, 15.0 * finalVector.z), hero.getAbsolutePosition()); }); Is there a more effective way to do this ? Thanks in advance.

Contract programmers to develop multiplayer card games. early pagametno

I am trying to move my player diagonally when I press down the 'up' & 'left' arrow keys. My current code is this this.moved = false; if (this.cursors.up.isDown) { this.moved = true; this.player.body.velocity.y -= 100; this.player.play('up'); } if (this.cursors.down.isDown) { this.moved = true; this.player.body.velocity.y += 100; this.player.play('down'); } if (this.cursors.left.isDown) { this.moved = true; this.player.body.velocity.x -= 100; this.player.play('left'); } if (this.cursors.right.isDown) { this.moved = true; this.player.body.velocity.x += 100; this.player.play('right'); } if (!this.moved) this.player.animations.stop();Now if I add the following if(this.cursors.left.isDown && this.cursors.up.isDown){ this.moved = true; this.player.play('upLeft');}and I press down the 'up' and 'left' keys, the player goes up (x=-100 & y=-100) which is what I want however, the animation does not work! It switches to the first frame of that animation but it stops after. So you will see a player sliding diagonally. It might be the "this.player.animations.stop()" that is getting in the way but I can't figure it out. Is there something I am not seeing?

I am new to phaser so sorry if this seems like a newb question. I have searched for this with no luck. Maybe I just dont know what I am looking for yet. After creating the world map, I have a bigger map than the player can see. As the player reaches the edge of the map, the player can go outside of my set jpg map that is a width of 5000 pixels by 5000 pixels and can see black past the edge One: How can I keep the player inside the edge of the map and Two: how do I set the map so as the player navigates to the end of the maps edge the map stops showing what is past it This is just a mockup js fiddle but will give the idea. you can move with the arrows, but when you get to the set bounds of the map the player can go past and you see past the bounds http://jsfiddle.net/krr9ay5e/ Thanks for any help!

I'm trying to make a Missile that will follow the player. My problem is that I don't know how to get the player position inside Missile object. I will paste my code below and write a comment where the problem is: window.onload = function() { var GameState = function(game) { }; // Here is a custom game object Player = function (game, x, y) { Phaser.Sprite.call(this, game, x, y, 'player'); }; Player.prototype = Object.create(Phaser.Sprite.prototype); Player.prototype.constructor = Player; /** * Automatically called by World.update */ Player.prototype.update = function() { // this.angle += this.rotateSpeed; }; // Load images and sounds GameState.prototype.preload = function() { this.game.load.image('ground', '/phaser/img/background2.png'); this.game.load.spritesheet('player', '/phaser/img/dude.png', 32, 48); this.game.load.image('bullet', '/phaser/img/bullet.png'); this.game.load.image('gun', '/phaser/img/gun.png'); this.game.load.image('rocket', '/assets/gfx/rocket.png'); this.game.load.image('platform', 'assets/platform.png'); }; // Setup the example GameState.prototype.create = function() { var player = new Player(game, 200, 300); game.add.existing(player); // Set stage background to something sky colored this.game.stage.backgroundColor = 0x4488cc; // Define movement constants this.MAX_SPEED = 350; // pixels/second this.ACCELERATION = 2600; // pixels/second/second this.DRAG = 200; // pixels/second this.GRAVITY = 1500; // pixels/second/second this.JUMP_SPEED = -400; // pixels/second (negative y is up) this.SHOT_DELAY = 100; // milliseconds (10 bullets/second) this.BULLET_SPEED = 500; // pixels/second this.NUMBER_OF_BULLETS = 10; this.platforms = this.add.physicsGroup(); for (var i = 0; i <= 10; i++) { this.platforms.create(this.game.rnd.integerInRange(450, 600), this.game.rnd.integerInRange(300, 300), 'platform'); }; this.platforms.setAll('body.allowGravity', false); this.platforms.setAll('body.immovable', true); // Create a player sprite this.player = player; // Enable physics on the player this.game.physics.enable(this.player, Phaser.Physics.ARCADE); // Make player collide with world boundaries so he doesn't leave the stage this.player.body.collideWorldBounds = true; // Set player minimum and maximum movement speed this.player.body.maxVelocity.setTo(this.MAX_SPEED, this.MAX_SPEED * 10); // x, y // Add drag to the player that slows them down when they are not accelerating this.player.body.drag.setTo(this.DRAG, 0); // x, y this.player.body.setSize(20, 32, 5, 16); this.player.animations.add('left', [0, 1, 2, 3], 10, true); this.player.animations.add('turn', [4], 20, true); this.player.animations.add('right', [5, 6, 7, 8], 10, true); this.player.animations.add('jumpright', [6], 10, true); this.player.animations.add('jumpleft', [1], 10, true); // Create a missile and add it to the game in the bottom center of the stage this.game.add.existing( new Missile(this.game, this.game.width/2, this.game.height - 16) ); // Since we're jumping we need gravity game.physics.arcade.gravity.y = this.GRAVITY; // Flag to track if the jump button is pressed this.jumping = false; // Create some ground for the player to walk on this.ground = this.game.add.group(); for(var x = 0; x < this.game.width; x += 32) { // Add the ground blocks, enable physics on each, make them immovable var groundBlock = this.game.add.sprite(x, this.game.height - 32, 'ground'); this.game.physics.enable(groundBlock, Phaser.Physics.ARCADE); groundBlock.body.immovable = true; groundBlock.body.allowGravity = false; this.ground.add(groundBlock); } // Create an object representing our gun this.gun = this.game.add.sprite(this.player.x, this.player.y, 'gun'); // Set the pivot point to the center of the gun this.gun.anchor.setTo(0.5, 0.5); // Create an object pool of bullets this.bulletPool = this.game.add.group(); for(var i = 0; i < this.NUMBER_OF_BULLETS; i++) { // Create each bullet and add it to the group. var bullet = this.game.add.sprite(0, 0, 'bullet'); this.bulletPool.add(bullet); // Set its pivot point to the center of the bullet bullet.anchor.setTo(0.5, 0.5); // Enable physics on the bullet this.game.physics.enable(bullet, Phaser.Physics.ARCADE); // Set its initial state to "dead". bullet.kill(); } // Simulate a pointer click/tap input at the center of the stage // when the example begins running. this.game.input.activePointer.x = this.game.width/2; this.game.input.activePointer.y = this.game.height/2; // Capture certain keys to prevent their default actions in the browser. // This is only necessary because this is an HTML5 game. Games on other // platforms may not need code like this. this.game.input.keyboard.addKeyCapture([ Phaser.Keyboard.LEFT, Phaser.Keyboard.RIGHT, Phaser.Keyboard.UP, Phaser.Keyboard.DOWN ]); }; // Missile constructor var Missile = function(game, x, y) { Phaser.Sprite.call(this, game, x, y, 'rocket'); // Set the pivot point for this sprite to the center this.anchor.setTo(0.5, 0.5); // Enable physics on the missile game.physics.enable(this, Phaser.Physics.ARCADE); // Define constants that affect motion this.SPEED = 250; // missile speed pixels/second this.TURN_RATE = 5; // turn rate in degrees/frame }; // Missiles are a type of Phaser.Sprite Missile.prototype = Object.create(Phaser.Sprite.prototype); Missile.prototype.constructor = Missile; Missile.prototype.update = function() { // Calculate the angle from the missile to the mouse cursor game.input.x // and game.input.y are the mouse position; substitute with whatever // target coordinates you need. var targetAngle = this.game.math.angleBetween( this.x, this.y, this.player.position.x, this.player.position.y // ----- >>>> HOW TO CALL PLAYER ??? ); // Gradually (this.TURN_RATE) aim the missile towards the target angle if (this.rotation !== targetAngle) { // Calculate difference between the current angle and targetAngle var delta = targetAngle - this.rotation; // Keep it in range from -180 to 180 to make the most efficient turns. if (delta > Math.PI) delta -= Math.PI * 2; if (delta < -Math.PI) delta += Math.PI * 2; if (delta > 0) { // Turn clockwise this.angle += this.TURN_RATE; } else { // Turn counter-clockwise this.angle -= this.TURN_RATE; } // Just set angle to target angle if they are close if (Math.abs(delta) < this.game.math.degToRad(this.TURN_RATE)) { this.rotation = targetAngle; } } // Calculate velocity vector based on this.rotation and this.SPEED this.body.velocity.x = Math.cos(this.rotation) * this.SPEED; this.body.velocity.y = Math.sin(this.rotation) * this.SPEED; }; var facing = 'right'; // The update() method is called every frame GameState.prototype.update = function() { this.physics.arcade.collide(this.player, this.platforms, this.setFriction, null, this); this.physics.arcade.collide(this.bulletPool, this.platforms, this.setFrictionBullet, null, this); // Collide the player with the ground this.game.physics.arcade.collide(this.player, this.ground); if (this.leftInputIsActive()) { if (facing != 'left'){ this.player.animations.play('left'); facing = 'left'; } if (this.upInputIsActive()) { this.player.animations.play('jumpleft'); }; // If the LEFT key is down, set the player velocity to move left this.player.body.acceleration.x = -this.ACCELERATION; } else if (this.rightInputIsActive()) { if (facing != 'right'){ this.player.animations.play('right'); facing = 'right'; } if (this.upInputIsActive()) { this.player.animations.play('jumpright'); }; // If the RIGHT key is down, set the player velocity to move right this.player.body.acceleration.x = this.ACCELERATION; } else if(this.upInputIsActive()){ if (facing == 'idle-left'){ this.player.animations.play('jumpleft'); }else if(facing == 'idle-right'){ this.player.animations.play('jumpright'); } }else { if (facing != 'idle'){ this.player.animations.stop(); if (facing == 'left'){ this.player.frame = 0; facing = 'idle-left'; }else if(facing == 'right'){ this.player.frame = 5; if (facing != 'idle-left') { facing = 'idle-right'; }; }else if(facing == 'idle-left'){ this.player.frame = 0; }else if(facing == 'idle-right'){ this.player.frame = 5; } } this.player.body.acceleration.x = 0; } console.log(this.player.body.velocity.x); // Set a variable that is true when the player is touching the ground var onTheGround = this.player.body.touching.down; // If the player is touching the ground, let him have 2 jumps if (onTheGround) { this.jumps = 2; this.player.body.drag.x = 500; this.jumping = false; } // Jump! Keep y velocity constant while the jump button is held for up to 150 ms if (this.jumps > 0 && this.upInputIsActive(150)) { this.player.body.drag.x = 200; this.player.body.velocity.y = this.JUMP_SPEED; this.jumping = true; } // Reduce the number of available jumps if the jump input is released if (this.jumping && this.upInputReleased()) { this.jumps--; this.jumping = false; } // Aim the gun at the pointer. // All this function does is calculate the angle using // Math.atan2(yPointer-yGun, xPointer-xGun) this.gun.rotation = this.game.physics.arcade.angleToPointer(this.gun); this.gun.position.x = this.player.position.x + 20; this.gun.position.y = this.player.position.y + 40; // Shoot a bullet if (this.game.input.activePointer.isDown) { if (this.gun.angle > -90 && this.gun.angle < 90 && this.game.input.activePointer.x > this.player.body.x && (facing == 'right' || facing == 'idle-right')) { this.shootBullet(); }else if((this.gun.angle < -90 || this.gun.angle > 90) && this.game.input.activePointer.x < this.player.body.x && (facing == 'left' || facing == 'idle-left')){ this.shootBullet(); }; } }; GameState.prototype.shootBullet = function() { // Enforce a short delay between shots by recording // the time that each bullet is shot and testing if // the amount of time since the last shot is more than // the required delay. if (this.lastBulletShotAt === undefined) this.lastBulletShotAt = 0; if (this.game.time.now - this.lastBulletShotAt < this.SHOT_DELAY) return; this.lastBulletShotAt = this.game.time.now; // Get a dead bullet from the pool var bullet = this.bulletPool.getFirstDead(); // If there aren't any bullets available then don't shoot if (bullet === null || bullet === undefined) return; // Revive the bullet // This makes the bullet "alive" bullet.revive(); // Bullets should kill themselves when they leave the world. // Phaser takes care of this for me by setting this flag // but you can do it yourself by killing the bullet if // its x,y coordinates are outside of the world. bullet.checkWorldBounds = true; bullet.outOfBoundsKill = true; // Set the bullet position to the gun position. bullet.reset(this.gun.x, this.gun.y); bullet.rotation = this.gun.rotation; // Shoot it in the right direction bullet.body.velocity.x = Math.cos(bullet.rotation) * this.BULLET_SPEED; bullet.body.velocity.y = Math.sin(bullet.rotation) * this.BULLET_SPEED; bullet.body.allowGravity = false; }; // This function should return true when the player activates the "go left" control // In this case, either holding the right arrow or tapping or clicking on the left // side of the screen. GameState.prototype.leftInputIsActive = function() { var isActive = false; isActive = this.input.keyboard.isDown(Phaser.Keyboard.LEFT); return isActive; }; // This function should return true when the player activates the "go right" control // In this case, either holding the right arrow or tapping or clicking on the right // side of the screen. GameState.prototype.rightInputIsActive = function() { var isActive = false; isActive = this.input.keyboard.isDown(Phaser.Keyboard.RIGHT); return isActive; }; // This function should return true when the player activates the "jump" control // In this case, either holding the up arrow or tapping or clicking on the center // part of the screen. GameState.prototype.upInputIsActive = function(duration) { var isActive = false; isActive = this.input.keyboard.downDuration(Phaser.Keyboard.UP, duration); return isActive; }; // This function returns true when the player releases the "jump" control GameState.prototype.upInputReleased = function() { var released = false; released = this.input.keyboard.upDuration(Phaser.Keyboard.UP); return released; }; GameState.prototype.setFriction = function(player, platform) { player.body.x -= platform.body.x - platform.body.prev.x; }; GameState.prototype.setFrictionBullet = function(bullet, platform) { bullet.kill(); }; var game = new Phaser.Game(848, 450, Phaser.CANVAS, 'game'); game.state.add('game', GameState, true);};

Hi, I'm new and my English isn't very good... I hope you will understand what I'm trying to do. I'm doing a html5 game like Metal Slug, or something like that, and I want a specific behaviour which I found in http://test.xapient.net/phaser/attm/. I know this game was made by a member of this forum (@valueerror) so I hope he can help me. The behaviour I want is the one made by Mario who is able to walk to the middle of the screen and then he stop moving forward and now is the "world" who is moving. Sorry about my English and thank you very much!!!

figured it out! Ignore this post thanks

Hey everyone! I'm making a top-down game with waves, but the problem is the enemy AI. As it stands now the enemy rotates and goes towards the player, but when they all go after the player they come close to each other and it looks silly, like this: The thing is that I want the enemies to avoid eachother so they don't collide. If anybody knows how to do this, help is really appreciated! this is my code for their behavior: enemy1Group.forEachAlive(function (enemy) { enemy.body.rotation += 20, enemy.body.collideWorldBounds = true, enemy.body.velocity.x = 0, enemy.body.velocity.y = 0, chasePlayer(enemy); ; }) function chasePlayer(enemy) { if (player.alive) { game.physics.arcade.moveToObject(enemy, player, 150); } }

I've got npc's that can go offscreen when player moves left/right but as they go out of bounds collision stops working on ground and they end up colliding with the world bounds, what would be the best way to handle them? do i save their positions on outOfBounds? or disable gravity for them or somehow keep ground collisions working out of camera?

Good day guys, I'm customizing Flying Dog, I've gone throught the tutorials and documentation. Still a bit unclear on how to implement something. After the round ends, when I click restart. I want another plane to be used for the reminder of the game. I know I have to add it to assets.js, and then objects.js under this.sprite. However I'm not sure how to enable the new plane on a button action or restart. On restart button click - it's loads game.system.setScene(SceneGame); So I was trying to however load another scene, however I think that would be overkill, all I want is a different player/sprite for the same scene. Any assistance would be much appreicated. Cheers

Hello, I am trying to make an entity class which holds the textures, player data, etc. I keep getting "Uncaught TypeError: undefined is not a function" in chrome which I am not sure how to fix it. Works perfectly in VS2013. This is a typescript project. GameState.Ts: module TinyRpg.State { export class GameState extends Phaser.State { public _player: TinyRpg.Entity; constructor() { super(); } preload() { this._player = new TinyRpg.Entity(this.game, EntityType.Player, 0); } render() { this._player.draw(); } }} Entities.Ts: enum EntityType { Player, Enemy, Npc,}module TinyRpg { export class Entity extends Phaser.Sprite { public name: string=""; public minHealth: number = 0; public maxHealth: number = 0; public minXp: number = 0; public maxXp: number = 0; public strength: number = 0; public defense: number = 0; public evade: number = 0; public luck: number = 0; public unitID: number = 0; public _id: string; public game: Phaser.Game; constructor(game: Phaser.Game, entityType: EntityType, unitID: number) { super(game, 0, 0, ''); this.game = game; this.unitID = unitID; if (entityType == EntityType.Player) this.key = 'player'; else if (entityType == EntityType.Enemy) this.key = 'enemy'; else if (entityType == EntityType.Npc) this.key = 'npc'; } draw() { this.game.add.image(0, 0, this.key); } }}

Hello everyone, it's me again.. i think my last post wasn't very clear .. i need help see i'm using this code (PLAYER) player = this.game.add.sprite(32, game.world.height - 150, 'dude'); game.physics.arcade.enable(player); player.body.bounce.y = 0.2; player.body.gravity.y = 1200; player.body.collideWorldBounds = true; player.animations.add('left', [0, 1, 2, 3], 10, true); player.animations.add('right', [5, 6, 7, 8], 10, true); Now i want to attach a gun with him, infront of him so i just used this code gun = game.add.sprite(player.x + 45, player.y + 55, 'DE'); somehow, player.addChild(gun); is not working... for that i did that gun = game.add.sprite(45, 55, 'DE'); player.addChild(gun); (If you think your code is working with .addChild() function please let me know) it's still not working, Please have a look at JsFiddle http://jsfiddle.net/AliMalik/snctgm5q/5/ (I DIDN'T ADD, ADDCHILD FUNCTION IN THERE, PLEASE JUST TAKE A LOOK, GIVE ME YOUR OPINIONS ABOUT HOW TO MOVE WITH PLAYER) NOTE : i also used "group" function to move gun, it worked fine. The only problem was in that function was whenever my player launches vertical velocity (player.body.velocity.y = -xx;) the gun in the group never stops, it gets out of bound in Y direction.. thank you

Hi everyone, Panda.js Sequencer is a plugin for Panda.js HTML5 game engine. The plugin goal is to provide an easy way to animate a sprite with spritesheet sequences. You can download it on github. https://github.com/blaspix/panda.js-sequencer