Search the Community

Showing results for tags 'phaser'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



Website URL





Found 3392 results

  1. I've been testing Phaser on Windows Phone 7/8, and I've run into couple of problems. 1) Phaser doesn't recognize Windows Phone as mobile device on game.device Phaser 1.1.5 recognizes Windows Phone as a desktop device at game.device.desktop. I checked the phaser's online docs for game.device, and there doesn't appear to be any user agent checks for windows phone. There is a check for the existence of 'windows' string that subsequently sets the game.device.desktop value true. According to a stack overflow answer, the safest thing would be to check user agent for the 'windows phone' string. In addition to the normal mobile mode, there's also a desktop mode in some windows phone models, that is missing the 'phone' part on user agent. The desktop mode is trying to mask itself as desktop version, it appears to be pretty hard to distinguish it from real windows 8 machine. 2) Game resizes incorrectly on Windows Phone I'm having problems getting my game to scale properly on windows phone 8, when using 480x320 resolution for the game. I have tried using the full screen mobile template under resources folder, with minor changes, but that doesn't seem to work. I'm testing on Nokia Lumia 920 in mobile mode with screen resolution 1280×768. I thought setting game.stage.scalemode to Phaser.StageScaleMode.SHOW_ALL would have resized the app to fit inside the browser, but as it is, it doesn't do that. SHOW_ALL only sets the width of the app to match the width of the screen when in landscape mode. Due to this the height of the game is almost twice the screen's height. EXACT_FIT and NO_SCALE don't work any better. Is this is the intended functionality, or am I just missing something? I have been testing the game on android tablets as well, but windows phone is the only one where I'm running into this problem. My settings: var game = new Phaser.Game(480, 320, Phaser.AUTO, 'game');game.stage.scaleMode = Phaser.StageScaleMode.SHOW_ALL;game.stage.scale.minWidth = 320;game.stage.scale.minHeight = 240;game.stage.scale.maxWidth = 960;game.stage.scale.maxHeight = 640;game.stage.scale.pageAlignVertically = true;game.stage.scale.pageAlignHorizontally = true;game.stage.scale.forceOrientation(true, false);game.stage.scale.enterIncorrectOrientation.add(this.enterIncorrectOrientation, this)game.stage.scale.leaveIncorrectOrientation.add(this.leaveIncorrectOrientation, this)game.stage.scale.setScreenSize(true); 3) Some Windows Phone models don't trigger game.stage.scale.leaveIncorrectOrientation on orientation switch I'm also having problems with Nokia Lumia 620 (another windows phone) when switching from portrait to landscape. As mentioned above I'm using the full screen mobile template, and i haven't touched the code on this part. The game correctly shows the turn your phone to landscape mode image (from the template) in the portrait mode. When the device is turned to landscape mode, the same image is still visible, only zoomed in to the top left corner of the image. Problem seems to be that game.stage.scale.leaveIncorrectOrientation isn't triggering correctly on the device. The device is able to change from landscape to portrait, so it's no a question of a missing sensor. This problem doesn't appear on Lumia 920, although I've managed to have it happen couple of times with chrome on my laptop when switching browser window size while developer tools are open. Any ideas what could be causing this, or how should I handle this? 4) Using console.log on Windows Phone is a bad idea This last one isn't related to Phaser, just something I realized after trying to debug my app on windows phone, and thought of sharing. Apparently, from time to time, even though Windows Phone's browser doesn't have visible console available. the console in it can crash/close. When it does, it sets the console global undefined. So, if you are getting mysterious crashes when trying to run development code on windows phone, it might be due to your console.log statements. In order to get rid of the problem, you need to create a new console object somewhere in your code, if one doesn't already exist. The code below is from if (typeof console == 'undefined') { var console = new Object(); console.log = function(){} console.error = function(){} console.debug = function(){} console.warn = function(){}}
  2. This is my first Html5 game, I am using Phaser 1.00TS0.83 and I had a real fun making it. The basis of the game is simple: you need to connect all blocks, either by moving them or rotating them, there are 3 types of them and a total of 60 levels. You can play the game HERE Any feedback is welcome... Edit: I updated the game and added a music and sound effects.
  3. Hello, I have a problem with sprites with a body set as immovable. When my player collide with two immovable bodies, one of these bodies moves. You can try with the two bushes under the player. 1- Go on top of the left bush and collide with it2- While still colliding, try pushing the right bush The code for the player and the bush are easely readable with DevTools (player.js and bush.js, you can read obstaclesgroup.js too). I don't understand what I'm doing wrong so if someone can help me to fix it, I'll owe him one. Thank you.
  4. Space Flight Hi! We just finished up another game, this one is called Space Flight. Use your finger to trace a path from incoming ships to the appropriate colored stations. As the game progresses, you will get more ships, stations, and unique upgrades that make managing your space port easier, but more challenging at the same time! Manage the universe's busiest space station! Help Mr. Warply figure out how to land all the ships coming to land at his stations. Several different stations, ship colors and additional challenges await you as you progress! Can you master this skill? Please let us know your thoughts! Play Space Flight Right Here! Play Space Flight Right Here!
  5. hi all I have some item in some group. How can i find parent group of my item and index of item in this group?
  6. Currently I'm building my games using Haxe / Openfl because I can target Flash, Android, Blackberry adn HTML5 with just one code base. Unfortunatelly despite the fact that Haxe is a marvelous programming language and that Openfl is a great project, I'm having many problems using Haxe so I'm thinking to develop 2 versions of the game: one of them using Haxe / Openfl just for Flash and another version made in HTML5 (with Phaser). Could you please kindly point me tutorials that teach us how to package HTML5 games as native applications (using Cocoonjs, Phonegap, Electra)? I'd appreciate if one could point me tutorials that show not only the integration itself, but how to call native functions (for instace, calling Flurry libray / AdMob libray on Android). Thank you all.
  7. Hi all ! Here is the first game i released using Phaser (amazing tool, thanks rich and all contributors) ! I made it in a week for the Flappy Jam. Save Flappy Birds is simple : you have to jump over running flappy birds. Its originality consists of the possibility to swap between 2 characters of different weight. Master this to make a great score ! The game is also playable on a touchscreen and i'll soon try to make it available on the AppStore and Google Play Store (never did it before, if you have any advice let me know). >> The link of my entry on : << (and soon on my website too) >>> EDIT : to rate the game : <<< EDIT : here is the source on GitHub : Have fun and give me your feedback
  8. Hello, I create a little game for my personal resume. It's in spanish. Fist the instructions. with C and J start to play. the game is to write phrases that appear in screen. For each word a bullet is fired Spanish characters can be replaced by standard character (ñ->n, á->a ...) It can be improved but to be the first one I'm happy Edit link:
  9. Can anyone tell me how I'd go about setting the z-index of emitted particles? Basically, what if I wanted particles emitted behind an object? Or force them in front? Thanks in advance.
  10. I replace a tile with no collision with one that has, but the collision info stays the same. You can reproduce this by using the paint tiles example. Apply collision to a couple of tiles by using setCollisionBetween() and enable debug on the tilemap layer. Paint with tiles that has collision and you'll see the debug lines never update. You can try it yourself at Shift + click the tiles within the green border, click to paint them anywhere. There's also a test for 1.1.3 at I couldn't find any debug drawing for tilemaps in 1.1.3 so I added the race car from another example. Use the arrows to drive around. You'll see the car stop at the tiles that has collision enabled. Painting new tiles and watch the car stop at them too. How come this worked in 1.1.3 and not in 1.1.5? Am I doing something wrong?
  11. EDIT : I found a solution to change the state without any mask problem (even if i don't understand it). I defined the mask for my sprites like this : sprite1.mask = sprite2.mask = sprite3.mask = theMask; and then, before changing state, i can remove all that with : sprite2.mask = null; // (or sprite3.mask = null; BUT NOT sprite1.mask = null; --> Error) Moreover, console.log("YUOIO") from Phaser still triggers. ------------------------------------------------------------------------------ Hi guys! I'm having a problem with mask and states. I'm using a mask for some sprites in-game but when i change the state to go to my title screen, the mask is still staying and makes my title screen only visible through it. When i try to disable it by changing the sprites .mask property to "null", i get : - "YUOIO" in the console for each sprite i try to change the mask to null - "Uncaught TypeError: Cannot set property '_iNext' of null" By the way, when i try to play the game with Canvas instead of Auto (which is WebGL in my case), i get this error (due to masks i think, see , post 8#) : "Uncaught TypeError: Cannot read property 'alpha' of undefined" Can someone help me with that ? Thanks and have a nice day
  12. Hi all, I'm new at phaser and TypeScript. I'm starting to use it following the examples. I try to change the text of a bitmapText object but setText function is not defined. I looked for it in the .d.js but it wasnt there. my code is like .. export class MainMenu extends Phaser.State{ fntDesyrel :Phaser.BitmapText; create() { this.fntDesyrel =, 148, "PHASER", { font: '94px Desyrel', align: 'center' }); } newText(_t : string) { this.fntDesyrel.setText(_t); /* <- Unresolved function or method setText */ }} Can anyone help me?thanks in advance.
  13. Hello. I'm experiencing some issues with collision between sprites and tilemaps, and cannot figure out how to fix it. It used to work in 1.1.3, so I have clearly messed up something. You can see for yourself here: Use WASD to move and click the mouse to shoot a wooden box. I have limited the shooting to only one box, so you have to reload the page to shoot again. It made it easier to track what's happening. I want the collision callback to fire when the sprite hits a wall so that I can kill the box. The callback only triggers when you shoot at the corner of a tile, and never when the box hits a wall perpendicular. I'm using Phaser 1.1.5. View source to see how I did it. Source code pasted here, in case you prefer that. Bullet = function(game) {, game, -100, -100, 'stuff', 0); this.anchor.setTo(0.5, 0.5); this.outOfBoundsKill = true;};Bullet.prototype = Object.create(Phaser.Sprite.prototype);Bullet.prototype.constructor = Bullet;var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'gameContainer', {preload:preload, create:create, update:update, render:render});var map;var layer;var player;var cursors;var bullets;var w, a, s, d;var counter = 0;var fireRate = 100;var nextFire = 0;function preload() { var assets = { spritesheet: { player: ['players.png', 16, 16], bullets: ['bullets.png', 32, 32], stuff: ['jerom_eiyeron.png', 16, 16] }, tilemap: { map01: ['map02.json', null, Phaser.Tilemap.TILED_JSON] }, image: { dungeon: ['DF_Tilemap01.png'] } }; Object.keys(assets).forEach(function(type) { Object.keys(assets[type]).forEach(function(id) { game.load[type].apply(game.load, [id].concat(assets[type][id])); }); });}function create() { map = game.add.tilemap('map01'); map.addTilesetImage('DF_Tilemap01', 'dungeon'); map.setCollisionBetween(0, 15, true, 0); layer = map.createLayer('Walls'); layer.resizeWorld(); layer.debug = true; player = game.add.sprite(48, 48, 'player', 0); cursors = game.input.keyboard.createCursorKeys(); w = game.input.keyboard.addKey(Phaser.Keyboard.W); a = game.input.keyboard.addKey(Phaser.Keyboard.A); s = game.input.keyboard.addKey(Phaser.Keyboard.S); d = game.input.keyboard.addKey(Phaser.Keyboard.D); bullets =; bullets.add(new Bullet(game));}function update() { player.body.velocity.x = 0; player.body.velocity.y = 0; if (w.isDown) { player.body.velocity.y = -200; } else if (s.isDown) { player.body.velocity.y = 200; } if (a.isDown) { player.body.velocity.x = -200; } else if (d.isDown) { player.body.velocity.x = 200; } if (game.input.activePointer.isDown) { var bullet = bullets.getFirstDead(); if (bullet !== null) { fire(bullet); } else { bullet = bullets.getAt(0); bullet.kill(); bullet.revive(1); fire(bullet); } } game.physics.collide(player, layer); game.physics.collide(bullets, layer, bulletHitWalls);}function fire(bullet) { if ( > nextFire && bullets.countDead() > 0) { nextFire = + fireRate; bullet.reset(player.x, player.y); var angle = game.physics.angleToPointer( bullet, game.input.activePointer); bullet.body.velocity.x = Math.cos(angle) * 300; bullet.body.velocity.y = Math.sin(angle) * 300; }}function bulletHitWalls(bullet, wall) { bullet.kill(); console.log('wall tile index',wall.tile.index);}function render() { game.debug.renderText('Active Bullets: ' + bullets.countLiving() + ' / ' +, 32, 32);}
  14. Hi, I just want to mention my Flappy Bird inspired game Tubeyflaps ( I've made it using Phaser. It's far away from a master piece and mainly a proof of concept and proof of my grunt based phaserBoilerplate ( The whole game is MIT licensed and OpenSource. You can find it here: Cheers! Casarock
  15. Hey guys,Ive been working on making a level editor in unity and then storing the resultant transform information like scale,position and rotation in a.json file to be read by phaser.while the position and rotation work perfectly well by changing the pivot of the sprites in unity.the scale doesnt seem to work ie the scaling in unity doesnt show the same result in phaser.if anyone has suggestion on how to calibrate it please let me know.
  16. Hey guys.I wanted to make a fuctionality through which If i select a sprite its gets replaced by a highlighted version of that sprite(the ones with selected in their name) and the other objects become rplaced by their unhighlighted version however with the current code whats happening is when testing the program it seems to be making an stran instance of the unhighlighted versions. function create () { mothership = game.add.sprite(90,100,"mothership"); mothership.inputEnabled=true;,this);;//the bots group bot1=bots.create(400,100,'bot1'); bot1.inputEnabled=true;,this); bot2=bots.create(700,100,'bot2'); bot2.inputEnabled=true;,this); } function listener(sprite, pointer) { if(sprite==mothership) { sprite.kill(); MothershipSelect(); Bot1(); Bot2(); } if(sprite==mothershipSelected) { sprite.kill(); Mothership(); } if(sprite==bot1) { sprite.kill(); Bot1Select(); Mothership(); Bot2(); } if(sprite==bot1Selected) { sprite.kill(); Bot1(); } if(sprite==bot2) { sprite.kill(); Bot2Select(); Mothership(); Bot1(); } if(sprite==bot2Selected) { sprite.kill(); Bot2(); } } function MothershipSelect() { mothership.kill(); mothershipSelected = game.add.sprite(80,100,"mothershipSelected"); mothershipSelected.inputEnabled=true;,this); } function Mothership() { mothershipSelected.kill(); mothership = game.add.sprite(90,100,"mothership"); mothership.inputEnabled=true;,this) } function Bot1() { bot1Selected.kill() bot1=bots.create(400,100,'bot1'); bot1.inputEnabled=true;,this); } function Bot1Select() { bot1.kill(); bot1Selected=bots.create(400,100,'bot1Selected'); bot1Selected.inputEnabled=true;,this); } function Bot2() { bot2Selected.kill(); bot2=bots.create(700,100,'bot2'); bot2.inputEnabled=true;,this); } function Bot2Select() { bot2.kill(); bot2Selected=bots.create(700,100,'bot2Selected'); bot2Selected.inputEnabled=true;,this); }
  17. Guys I have the following code to make a star sprite and 2 firstaidbox(added through group) sprites.what i want is that when i click the star the firstaid boxes should dim(alpha=0.5) and vice versa.however the mouse event doesnt seem to work when I click the firstaid boxes. function create () { starimage = game.add.sprite(100,100,"star"); starimage.inputEnabled=true;,this);//the firstaid boxes for(var i=2;i<4;i++) { var myvar=bots.create(i*100,100,'firstaid'); myvar.inputEnabled=true;,this); } } function listener(sprite, pointer) { if(sprite==starimage) { sprite.alpha = 0.5; bots.alpha=1; } if(sprite==bots) { alert("clicked"); sprite.alpha = 0.5; starimage.alpha=1; } }
  18. I know the number of FlappyBird clones flooding the internet is getting a bit ridiculous, but I couldn't resist making one myself! I made the game with Phaser and was pleasantly surprised at how intuitive it feels - all round a great framework. As it was a learning excercise for myself, I've liberally documented the source so hopefully other phaser beginners can benefit from it. Play it here Hope you enjoy! p.s. my hiscore is 14, can you beat it?
  19. Hi all, Please find the following link which I have done using construct2 game engine and it took me almost a week to do this. Considering my programming skill of a designer(who also codes sometimes) it would take more time in Phaser. Can you help me out with a code snippet which simulates the action shown in the link The algorithm I have used is ... I am storing the trails as the player is touching the screen and storing the X,Y, direction (relation between previous consecutive trails) in an array which I am looping through and then changing the Y position of the main Sprite when the X of the next trail is less than the main sprite. ..if the current direction is LEFT to RIGHT.similarly changing the Y position of the main sprite if the X of next trail is greater than the main sprite ..if the current direction is RIGHT to LEFT sorry if the explanation for the algo is crude thanks
  20. Hello. I know altering the width of the crop of a sprite takes away from the right side of the image. I really need to crop the left side. I've tried altering the crop x properties but just get a kind of black shadow added on the end. I can't make sense of what is going on. Here is an example. I've cropped the left side of the robot arm, but now you can see the black line going onto the pipe. I need to get rid of that.
  21. EDIT: For those still interested in this issue I have revived it with updated code and such here. Heya, this is my first post so I apologize if this has already been covered in another relevant topic. Essentially I am setting up a HUD prototype. I pass the game object to the HUD initially then prototype all of the relevant functions afterword. I am trying to get a timer setup to essentially display a 1 minute countdown. Each time I try to run the game though I get the error... Uncaught TypeError: Cannot call method 'loop' of undefined Here is the code I am using... ~~~ HUD = function(game) { = game;this.score = 0;this.text = null;//this.timer = null;}; var countDown = 60; HUD.prototype = {create: function() {this.text =, 16, 'Score: 0\nTimer: 01:00', { fontSize: '32px', fill: '#000' });, updateText,;}, update: function() { }}; function updateText() {countDown--; if (countDown < 10) {this.text.content = 'Score: 0\nTimer: 00:0' + countDown;} else {this.text.content = 'Score: 0\nTimer: 00:' + countDown;} if (countDown == 0) {endGame();}} function endGame() {game.state.start('GameOver');}~~~Any thoughts?
  22. I'm trying to make a little game using physics, where the user pushes balls around. The balls are defined as Sprite extensions, like this: function Player(game, type) {, game,,, 'player') this.anchor.setTo(0.5, 0.5) this.type = type this.body.collideWorldBounds = true this.body.allowRotation = true this.body.bounce.setTo(0.6, 0.6) this.body.setCircle(50) this.body.angularDrag = 50 this.body.drag = 5 game.add.existing(this) } And the interaction is based on doing: this.players.getAt(0).body.velocity.x -= 10with every one of the directions, depending on the key pressed. It works, I can push elements around. But I'm facing an issue, I don't know it it's a bug or it's just expected to work like this and I'm missing something. The problem is that the elements overlap in some situations. For example, if I keep pressing the key, forcing the sprite against another one, it may finally "break" the collision boundary and overlap. Is there a solution for this? Is it a known issue? Thank you
  23. I'm still new to Phaser and have a concern of best practice for loading up images with my main concern being performance. I understand how to load up images and sprites (for characters and such), but I'm building a game much like Scrabble and I created a spritesheet containing all of the images I would need. I was able to load up the board for the game, but now I want to load up the rest of the images in that spritesheet. The only option I can think of is to cut up the spritesheet in PS and have individual images to load up separately; I don't think a tilemap would work in my situation. I was hoping to have one spritesheet (png) to load and just tell Phaser where all of the images are in that spritesheet. I would think this would be something of a best practice instead of loading each image individually. I'm also experimenting with the Tiled app and generating the tilemap data and then loading whatever individual images I need to load; each image would need to be draggable. What other options are available to me?Is there a plug-in that can extend the functionality of the game.load.image function?What's the best practice in this kind of game scenario? Thanks in advance
  24. Hello everybody, I have an issue with a Sprite vs Sprite collision (Phaser 1.1.4 - Master branch). I don't know why but my player only collides with the bottom of the rock. You can see the problem here : The 2 scripts involved are player.js and rock.js (you can see the code with your developer tools too). The rock is immovable and I call the "game.physics.collide()" in the update function of Rock (in rock.js). As you can see on the image below, my player has a specific bounding box (done with the sprite.body.setRectangle() function). I tried but I can't figure it out. Please, help me Thank you.
  25. I started working on a Sublime Text Package for phaser Phaser Snippets, the objective is to learn more about phaser on the progress, that's why I'm not automating the process and taking long to finish it. The thing is I have some questions for the comunity beacause there are a lot of method's I havn't really used so I don't know the best way to call them for example for the Animation Manager wich I normally use inside a sprite the snippet output is: .add('name',frames,frameRate,'loop',useNumericIndex);But for Utils class is : Phaser.Utils.pad('str',len, pad, dir);So if someone has some feedback feel free to tell me and I will update the package with the best way of the output, also the repo is on Github So if you wan't to make the process faster do a pull request .