Search the Community

Showing results for tags 'phaser2'.

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 40 results

  1. Ananth

    Loading image from URL

    hi, I'm try load an image from url for my shows cross origin error. I try like this,(sample code) game.load.baseURL = 'url'; game.load.crossOrigin = 'anonymous'; game.load.image('image', 'assets/images'); If anyone know solution to load image from url please help me. Thanks in advance.
  2. I'm trying to add a bubble-pop spritesheet animation to my game. I have added other sprites fine, and when I add the sprite for the bubble, everything is still good. However, when I go to add the animations, I get an error, "Cannot read property 'add' of undefined. How can I animate the bubble? var config = { type: Phaser.AUTO, width: 1366, height: 768, parent: "canvas", scene: { preload: preload, create: create} }; var game = new Phaser.Game(config); function preload () { this.load.image('freeplayBG', 'images/freeplay-BG.png'); this.load.image('shark', 'images/nice-shark.png'); this.load.spritesheet('bubblePop', 'images/bubble_pop_under_water_spritesheet.png', {frameWidth: 394, frameHeight: 511} ); } function create() { //Set background this.add.image(685, 384, 'freeplayBG'); //Set shark and make draggable var shark = this.add.sprite(200, 300, 'shark').setInteractive(); this.input.setDraggable(shark); this.input.dragDistanceThreshold = 16; this.input.on('drag', function (pointer, gameObject, dragX, dragY) { gameObject.x = dragX; gameObject.y = dragY; }); //create the bubble sprite var bubble = this.add.sprite(700, 300, 'bubblePop'); console.log(bubble); //Sprite {_events: Events, _eventsCount: 0, scene: Scene, type: "Sprite", parentContainer: null, …} console.log(bubble.animations); // undefined console.log(this) //Scene {sys: Systems, game: Game, anims: AnimationManager, cache: CacheManager, plugins: PluginManager, …} bubble.animations.add('pop'); //error happens here'pop', 10, false, true);
  3. Ananth


    How to add and use blendModes in phaser. And how to use blendModes to bitmap images. Thanks,
  4. Ananth


    How can i enable input for bitmap
  5. tanmoy749

    lebeling sprites

    How can I lebel my sprites with a text when I click on them? I have some different sprites that I need to give different names through clicking on them. Thanks in advance.
  6. I'm writing a 2D space shooter. It started as a single player Phaser2 game a couple of years back, and now it's multiplayer with providing the back end on node.js. The game is at the point where performance is starting to matter (and degrade), and I'm having a bad time rendering the of sprites on the screen. I'm probably just writing bad code, and I'm quite happy to work through that myself, but I'm not sure that I'm using the right frameworks underneath, and I'd like some help sorting that out before I start working through the problems I am having. What I'm wondering is whether I should persist with Phaser2 and and debug my performance issues here (Chrome dev-tools reckons that most of my time is being spent in drawImage or textaImage2D in Phaser2), or if I should first upgrade from Phaser2 to something else like Phaser3 or PIXI4? Perhaps socketcluster is not as important as I once thought? Can anyone give me a kick in the right direction on this? Thanks!
  7. vastron

    Phaser 2 PWA Scaling Issue

    Hello, I created a pwa with Phaser 2, following this tutorial I face a problem with how the game scales on mobile. In my game I use these Phaser 2 methods: game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; game.scale.pageAlignHorizontally = true; game.scale.pageAlignVertically = true; When I click the localhost link in my mobile, the game is way too big and when I 'download' it to act like an app, it gets really shaky at first, scaling up and down until it settles to the correct size. The game dimensions are 1280x720. It looked very nice before I converted it to a PWA. I did an audit for a PWA in Chrome's dev tools and it showed this notification: The viewport size is 1280px, whereas the window size is 412px. Do you have any idea on how to fix this issue?
  8. nanaleite

    Glitchy Phaser examples

    Hi everyone! I am quite new to Phaser and javascript and I have been learning it mainly with the examples and library. During my explorations I noticed that some examples do not work when downloaded to my computer (or even my friends' as well), but it does on the phaser page. As an example: - when downloaded to my computer the characters are constantly jumping and going everywhere without any pressed key (video of the glitch). Also, the when opened it just show an empty canvas. When I ran the web console it states 2 errors: the 'game.rnd.between is not a function' and 'sprite is undefined'. These examples were downloaded straight from the page. Am I doing something wrong when testing these examples? I usually create a folder with the assets folder, index.hmtl file, phaser.min.js and sourceexample.js. The files are linked on the html file. Am I missing something or is it just the case these codes are faulty and incorrect from the source? I am running out of ideas here and any help would be much appreciated. :)

    [Phaser2] Astro Ballz

    Hi everyone. I'd like to present Astro Ballz, a space themed breakout game featuring gravity and pinball physics. It's a fast paced game with colorful graphics, cool sounds and music, and lots of levels. Please check it out. INSTRUCTIONS: Playing is easy - position the flying saucer paddle with your mouse (or finger). Smash the astroballz above with the spinning metal ball. Catch any bonuses that fall. Do it fast enough and you can get 3 stars. Restart or replay each level as often as you like. GAME FEATURES: Many levels feature moving and rotating astroballz. There are also exploding suns, teleporting jumpgates, and indestructible asteroids. Each level is different, and they get harder as you progress. There are 160 levels in all. PLAY HERE: Feedback is welcome. Developed with Phaser2. Music by Eric Matyas. AstroBallz was designed to work well on mobile as well as desktop.
  10. I am trying to add a simple countdown timer to a Phaser game. When the timer ends I want the game to restart. After adding the timer code there are no errors in the console but I can't get the timer to appear on the screen. Where I am going wrong please? I am new to Phaser and am still learning Javascript - any help would be greatly appreciated! Please see my code below (for clarity, I have only pasted the relevant code, not the whole thing). Thanks for any help in advance. PlayState = {}; PlayState.init = function () { //.... }; PlayState.preload = function () { //.... }; PlayState.create = function () { //TIMER CODE: this.timeInSeconds = 120; this.timeText =,, "0:00",{font: '15px Arial', fill: '#FFFFFF', align: 'center'}); this.timeText.anchor.set(0.5, 0.5); this.timer =, this.updateTimer, this); }; PlayState.update = function () { //..... }; PlayState.updateTimer = function() { this.timeInSeconds--; var minutes = Math.floor(this.timeInSeconds / 60); var seconds = this.timeInSeconds - (minutes * 60); var timeString = this.addZeros(minutes) + ":" + this.addZeros(seconds); this.timeText.text = timeString; if (this.timeInSeconds == 0) {; } }; //add leading zeros to any number less than 10 //for example turn 1 to 01 PlayState.addZeros = function(num) { if (num < 10) { num = "0" + num; } return num; }; window.onload = function () { let game = new Phaser.Game(1280, 800, Phaser.CANVAS, 'game'); game.state.add('play', PlayState); game.state.start('play'); };
  11. bpdubey87

    Develop billiard (Pool) Game

    Hello, I am just new to phaser2. I want to develop a billiard game, more similar like this:- But I don't know how to start with as there are many physics components in phaser. Any guide or tutorial to develop this game in phaser2?
  12. Hello, I`m just getting started with game development and I`m trying to make a copy of Tetris that can be played on mobile phone as well. I want to be able to move the blocks with left/right/up arrows(from keyboard) and with 3 buttons that are displayd on the screen. Here I`m declaring the buttons(inside create function): create: function(){ //.... rotate_bricks = this.add.button(350, 180, 'rotate-shape', Tetris.Blocks.rotate, this); left_arrow = this.add.button(345, 240, 'left-arrow', Tetris.Blocks.moveLeft, this); right_arrow = this.add.button(345, 300, 'right-arrow', Tetris.Blocks.moveRight, this); //... }, And here is the moveLeft function: Tetris.Blocks = { moveLeft: function(game) { let points = 0; /*make a local variable, if all of the 4 blocks can be moved 30 px left/right then move it, if some of them will get out of the box, then don`t move Test for all blocks available on the map */ for(let i = 0; i < Tetris.allBlocks.children.length; i++) { //test if blocks collide with each others for(let j =0 ; j < Tetris.allBlocks.children[i].children.length; j++) { if(!(Tetris.allBlocks.children[i].children[j].body.velocity.y === 0) || Tetris.allBlocks.children[i].children[j].body.y > 370) { if(Tetris.allBlocks.children[i].children[j].body.x - 30 > 0) { points++; } else { break; } } } } for(let i = 0; i < Tetris.allBlocks.children.length; i++) { //test if blocks collide with each others for(let j =0 ; j < Tetris.allBlocks.children[i].children.length; j++) { if(!(Tetris.allBlocks.children[i].children[j].body.velocity.y === 0) || Tetris.allBlocks.children[i].children[j].body.y > 370) { if(points === 4) { console.log(Tetris.allBlocks.children[i].children[j].body.x);//for test Tetris.allBlocks.children[i].children[j].body.x = Tetris.allBlocks.children[i].children[j].body.x - 30; console.log(Tetris.allBlocks.children[i].children[j].body.x); } else { break; } } } } console.log("moved left"); }, the problem is that the console.log function is executed but the position isn`t changed(I know it works because when I use the keyboard everything is fine, I call the same function) The variable Tetris.allBlocks is declared globally(inside Tetris.Game as: var Tetris.allBlocks = ...); What it`s wrong? I couldn`t find an answer online
  13. traxtrack

    Issue with Obstacle velocity

    Hello, I have an issue which keeps me stuck and I could not yet figure it out after being stuck for quite some time. I have a simple game in which obstacles ( spirtes of other cars) drop down from the top of the screen and I am trying to avoid those with my own car not to crash into them. The issue is that on some mobile devices the cars drop WAY faster than on my own device, I tested this from several different phones, the velocity differs depending on the phone, on some the obstacles drop faster on some they drop really slow. What oculd cause such an issue? I can provide code if it helps. Thanks,
  14. Hi, Is it relevant to apply a pooling system to Phaser's Tweens in optic to reduce the garbage collector invocation ? Because this subject as already been asked but dont find a clear answer : Thanks
  15. Hello! I am trying to make a player to collide with the ground. But the ground has been imported from a tilemap using the tiled program. The collision is not working This is the important part of my code: collisionLayer = map.createStaticLayer('collisionLayer', tileset); var players = findObjectsByType('player', map, 'objectsLayer'); player = this.physics.add.sprite(players[0].x, players[0].y, 'dude'); this.physics.add.collider(player, collisionLayer); findObjectsByType is not a phaser native method, but it is working. The code runs without errors, but the collision is not working. I have attached the code. Thanks!
  16. Question about keyboard controls. I'm working on a simple action game in Phaser CE, the player touches certain parts of the screen to do various actions. The mouse/touch input parts work fine and now I also want to support keyboard input for people playing on desktop. The problem is; the game is running inside an iframe and the keyboard input works correctly until the canvas loses focus. The game pauses which is correct behaviour, then I click inside canvas again, game continues and mouse input still works. But now the keyboard input is not working anymore. When the game is not running inside an iframe this is not a problem, the keyboard continues to work after losing focus, pausing and then continuing. Do I have to use something other than "game.input.keyboard.addCallbacks" to check for keyboard input? This is my code mygame.GameState.prototype = { create: function() { this.stage.backgroundColor = "#f0f"; this._levelindex = 0; // .. // etc. // game input for mouse and keyboard, this); // mouse/touch, this.doGameKeyInput, null, null); // keyboard // .. }, onGameMouseDown: function(evt) { // code.. ok works fine }, doGameKeyInput: function(key) { var kc = key.keyCode; var action = 0; if (kc == 32) {action = 1}; // space if (kc == 90) {action = 2}; // Z if (kc == 88) {action = 3}; // X // etc. this works until canvas loses focus } } FYI i'm using Windows 10 and Chrome
  17. Kiwi404

    Reuse Emitter, bug or bad use ?

    Hi, Is there any method to reset an emitter properly to be reused ? because i reuse a set of emitters but sometimes when i reuse a previously used emitter it show quickly his last state (repartition of particules in their last coordinates) and then restart his animation, so i wonder if is it a bug or a bad use. EDIT : It's a bad. Code used to instanciate the emitters in the poolEmitter (extended instance : em = game.add.emitter(10,16,30) // some emitter settings (minRotation, setXSpeed,makeParticles...) em.kill() this.add(em) Code used in the poolEmitter instance to get a free (dead) emitter : let obj = this.getFirstDead(false) obj.revive() obj.x = x obj.y = y return obj Code used for exploitation of the emitter : let em = poolEmitter.create(player.x ,player.y) em.explode(800,30) setTimeout(function(){ em.kill() em.on = false em.visible = false /* em.forEach(function(p) { // I try this to hide the particule manually to avoid to be showed in their last coord when reuse the emitter, but dont work p.alpha = 0 })*/ },900) Thanks
  18. help in my game I eliminate an enemy with enemy.kill () and deasa appears but the associated weapon keeps firing .. and enemy.destroy () gives me an error ..
  19. Play Cool Math

    Math Mahjong Relax

    Welcome to online Math Mahjong Relax. Math Mahjong Relax is a traditional solitaire game where you have to take apart the construction made of dice. The game helps to improve your attention, speed and math skills. Dice differ in the image on the upper edge. With one move, you can get only two same and open dice. The dice is considered open if its left or right face is open. The game includes 36 levels from simple to complex ones. In the beginner levels you will learn the rules, find out which dice differ and which ones can be interchangeable. Online Math Mahjong Relax iOS Math Mahjong Relax Android Math Mahjong Relax
  20. Hello! I want to use method BringToTop for layer data item. But it doesnt work for me. I have some layers, and i want to hide my character behind some sprites. I need something like that: But i have got it: Here is my code: this.parent.Location.location ='map'); if (!this.parent.Location.props.images) { console.error('Images are empty or undefined read for information'); return false; } _.each(this.parent.Location.props.images, (layer, index) => { this.parent.Location.location.addTilesetImage(,; this.parent.Location[layer.layer] = this.parent.Location.location.createLayer(layer.layer); this.parent.Location[layer.layer].resizeWorld(); if (_.size(layer.bringToTop)) { this.bringToTop(index, layer.bringToTop); // 0, [6,7] } }); bringToTop(index, bringToTopArray) { let gid = this.parent.Location.location.tilesets[index].firstgid; _.each(bringToTopArray, (itemBring) => { _.each(this.parent.Location.location.layers[index].data, (layerData) => { _.each(layerData, (layerDataItem) => { if ((itemBring + gid) === layerDataItem.index) { let timeAfterLoad =, () => {;; }); } }); }) }); } If you know another ways how i can resolve that problem, let me know please.
  21. Doug

    Hi Rich.  @rgk mentioned that you might be able to please add a "patron" badge to my forum profile?  Thanks very much!

  22. Finwillwin

    Animation Problem

    Here is my issue: Uncaught TypeError: Cannot read property 'getFrameIndexes' of null at i.AnimationManager.add (phaser.min.js:3) at Object.create (hub.js:45) at i.StateManager.loadComplete (phaser.min.js:3) at i.StateManager.preUpdate (phaser.min.js:3) at i.Game.updateLogic (phaser.min.js:3) at i.Game.update (phaser.min.js:3) at i.RequestAnimationFrame.updateRAF (phaser.min.js:3) at window.requestAnimationFrame.forceSetTimeOut._onLoop (phaser.min.js:3) Here is my code: if(game.spawn == 0){ player = game.add.sprite(500, 800, 'guy'); } else if(game.spawn == 1){ player = game.add.sprite(1700, 1002, 'guy'); } horn = 0; player.scale.setTo(1,1); game.physics.arcade.enable(player); player.body.collideWorldBounds = true; up = game.input.keyboard.addKey(Phaser.Keyboard.W); down = game.input.keyboard.addKey(Phaser.Keyboard.S); left = game.input.keyboard.addKey(Phaser.Keyboard.A); right = game.input.keyboard.addKey(Phaser.Keyboard.D); y = game.input.keyboard.addKey(Phaser.Keyboard.Y); n = game.input.keyboard.addKey(Phaser.Keyboard.N); f = game.input.keyboard.addKey(Phaser.Keyboard.F); f.onDown.add(hub.gofull, this); q = game.input.keyboard.addKey(Phaser.Keyboard.Q); q.onDown.add(, this); game.scale.fullScreenScaleMode = Phaser.ScaleManager.EXACT_FIT;, Phaser.Camera.FOLLOW_LOCKON, 0.1, 0.1); player.animations.add('right', [14,16], 6, true); player.animations.add('left', [20,22], 6, true); player.animations.add('down', [2,4], 6, true); player.animations.add('up', [10,8], 6, true);
  23. Hello, I am working on a project where i can drag an object in X-direction only(like in a abacus). Is it possible to drag objects in one direction only? I created a simple task where i can move two objects with mouse (link here). The issue is that objects are pushing inside each other if i drag one object to another. I need them to be hard like diamond. Can i achieve that with p2 js or i have to use box2d plugin (like here). Also is box2d will be availabe in phaser v3. Thanks
  24. Всем привет! Если мы напишем let enabled =['UIAtlas', 'InGameAtlas']); в первом состоянии текстуры отображаются нормально. При изменении состояния.'InGame'); текстуры исчезают. информация об отладке в чем проблема? Благодаря!
  25. I'm trying to zoom camera (change its scale) while focused on a player on a tilemap. const speed = 0.01; if (this.cursors.up.isDown) {, speed); } else if (this.cursors.down.isDown) {, -speed); } This is how I create the map: this.map16 ="tilemap16"); this.map16.addTilesetImage("xrpg_tileset", "tileset16"); this.wallsLayer = this.map16.createLayer('Walls'); Both player object and the map layers are placed in the World. But it seems that tilemap layer's position is affected by camera's zoom which looks wrong: To check if something is wrong with the scene I replaced the map with an image and zoom worked correctly: The behaivor is identical in 2.6.2 and 2.10.3.