• Content count

  • Joined

  • Last visited

  1. I have a top-down game where I want most objects aligned to tiles. They can be moved(by having a velocity applied to them) but when they do they need to end exactly within a tile when they are stopped. Let's say I have a sprite that is moving across the screen and it detects that the next tile it will try to enter is occupied by some other object. In that scenario I would like to manually stop the sprite at exactly the location of the tile it's in. Currently I have collision on blue and red in the picture and blue would then be manually aligned at the previous tile which looks bad animation wise as it sort of jumps backwards. So what I think I need is a sort of predictive method where before blue enters the next tile it checks if that tile is occupied and if so stops. Any suggestions on the best way to handle this?
  2. Gamepad Disconnection Problems

    Well I spent some time investigating and I'm just frustrated to no end right now. Perhaps someone else has setup multiple gamepad support in there game and could help both of us out. It might not be something that can be solved within Phaser either as I tested on 2 different PC's to different results just using this site here: PC #1 When I hook up 2 controllers they both show and work fine. If I unplug controller 2 then controller 1 still works fine. If I replug in controller 2 they both work fine. If I unplug controller 1 it disconnects BOTH controllers PC #2 When I hook up 1 controller it works fine When I connect the second controller I get a third random invalid controller showing which you can see a screenshot of here When I unplug either controller the third random one disappears I do see the exception you got but it seems to only occur in certain scenarios for me. I was able to avoid the game crashing by just adding an extra check in the pollStatus function in SinglePad like so: if (!this.connected || ! || ! || !this._rawPad || (this._rawPad.timestamp && (this._rawPad.timestamp === this._prevTimestamp))) The disconnect callback is still called properly and I can reconnect the controller and keep playing just fine. This seems to avoid any crashes or ill effects and might just be what you need if your game only supports a single player. If your game is meant for up to 4 people locally then you will still probably have some issues like I'm experiencing in the PC #1 and #2 descriptions above
  3. This is the exact tutorial I used to start my game in TypeScript a few months back. Most of it is still relevant and some pages have comments with modifications to things that are outdated. Highly recommended.
  4. Gamepad Disconnection Problems

    So I confirmed that I get the same error you do on the example page but I know I don't in my game. So that's a good thing. I'll compare my code to the example and try to see why that would happen. It's Valentine's Day today though so I'll have to properly look into this issue tomorrow night as my girlfriend will murder me otherwise .
  5. Gamepad Disconnection Problems

    HTML5 gamepad support is still in an experimental stage and I'm just talking about in general, not Phaser itself. I just added Gamepad support to my game yesterday and I never had that issue. Perhaps it's the gamepad you used? I tested with an XBOX ONE and PS4 controller and both worked fine connecting/disconnecting. Also might depend on the browser you were testing with
  6. Okay I figured out a nice, easy solution at least for my situation (top-down tiled game). If the overlap callback is triggered then for sprite3 (which is the one I'm manually putting a velocity on) I just manually set velocity to 0 and then x, y to be outside of sprite2. In my case I actually have a helper function where I determine which tile the object is in and then i can just set sprite3 to those coordinates but that won't work for most games so I made a little snippet of code as an example of what people can use. I renamed sprite3 to be moveableSprite and sprite2 to be stationarySprite so the code reads better. Also I converted some code from TypeScript to JS for the example so it might not work in JS exactly as is shown this.stationarySprite.immovable = true; this.moveableSprite.immovable = true;, this.moveableSprite, this.immovableOverlap, null, this); // at some point a velocity is applied to moveableSprite this.moveableSprite.body.velocity.x = 50; // Manually place moveableSprite beside stationarySprite. This isn't a full example since I'm using my own // tile helper functions in my game but it shows how someone would likely do it. immovableOverlap(stationarySprite, moveableSprite) { moveableSprite.body.velocity.x = 0; moveableSprite.body.velocity.y = 0; var moveableSpriteXLeft = moveableSprite.x; var moveableSpriteXRight = moveableSpriteXLeft + moveableSprite.width; var stationarySpriteXLeft = stationarySprite.x; var stationarySpriteXRight = stationarySprite.x + stationarySprite.width; // Test if moveableSprite has collided with the left side of stationarySprite if (moveableSpriteXRight > stationarySpriteXLeft && moveableSpriteXRight < stationarySpriteXRight) { moveableSprite.x = stationarySpriteXLeft - moveableSprite.width; } // More tests for other sides/directions if () {} } Honestly now that I've written this I bet the Phaser library itself has this exact type of code only better so maybe it's worth actually looking at the Phaser source code to see if some code can be reused.
  7. Yeah unfortunately I thought that was the case drhayes. I agree that I think I will have to do the collision manually myself. What I have tried is when sprite2 and sprite3 do collide phaser still calls the collide callback and then I set sprite3.body.velocity.x = 0; The sprite stops moving as expected but it's like <=1pixel into sprite2. I'm guessing I would then have to manually separate the two objects myself there. Hmm... I wonder if there is an easy/proper way to do that. I'll give it a go and then maybe get it into the sandbox if I still can't get a proper solution going. Thanks
  8. I have 3 sprites: spritePlayer is my main sprite I control sprite2 will NEVER move. sprite3 will only move when spritePlayer moves against it AND presses a key. Then I want it to have a constant velocity in that direction and if it comes across sprite2 then it collides/separates and loses it's velocity. I set sprites 2 and 3 to have body.immovable = true so if spritePlayer touches either of them they don't move and spritePlayer can't move through them either which is exactly what I want. If I press a key to trigger sprite3 to move I set sprite3.body.velocity.x = 50 and it moves right through sprite 2 when it comes across it which is what I don't want. I know two immovable objects don't separate as programmed in phaser so there must be some other way to get the desired effect I need. Perhaps I'm going about this the wrong way but I'm having a hard time figuring out any other way.
  9. Okay I finally got it working. You need to reset the currentAnim object on the animation manager back to anim1 after pausing anim2 and it starts right where it left off. var anim1 = this.animations.getAnimation("animation1"); var anim2 = this.animations.getAnimation("animation2");"animation1", 10); // Sometime later anim1.paused = true;"animation2", 10); // Sometime later anim2.paused = true; this.animations.currentAnim = anim1; anim1.paused = false;
  10. Hey samme, while that does work in the sense that it does replay the first animation it unfortunately starts it over from the beginning again when I need it to start where it was paused from.
  11. So I have 2 animations that both work independently. I can pause and unpause either of them fine but I can't pause one, play the other and then unpause the first. This doesn't and no animations play in the end Any ideas?
  12. How to center a Tilemap and everything inside?

    Okay, I figured it out. new Phaser.Game(((window.innerWidth * window.devicePixelRatio) / (window.innerHeight * window.devicePixelRatio)) * 240, 240, Phaser.AUTO) = Phaser.ScaleManager.SHOW_ALL; backgroundLayer.fixedToCamera = false; backgroundLayer.scrollFactorX = 0; backgroundLayer.scrollFactorY = 0; this.collisionLayer.fixedToCamera = false; this.collisionLayer.scrollFactorX = 0; this.collisionLayer.scrollFactorY = 0; this.mapOffsetX = ( - / 2; backgroundLayer.position.set(this.mapOffsetX, 0); this.collisionLayer.position.set(this.mapOffsetX, 0); I'm using Typescript so I'm just including the important snippets from various files. Create the height of the game to be the size of your tilemap. In my case I'm using 240 currently and then calculate the width based on the height as you can see above. Scale the game using SHOW_ALL so it will take full vertical space and not stretch. Then for each layer you create you must set the fixedToCamera and scrollFactor to be 0. Without these it won't work. I don't know why and would love an explanation as to why. Then finally calculate the X offset needed to center everything horizontally and apply it to the tilemap layers. Everything else you place in your game will need to be offset as well.
  13. How to center a Tilemap and everything inside?

    The only thing I could get to somewhat work was using world.setBounds() and supplying a negative number to x but I'm guessing that is not the proper way to do it... Pretty much all examples out there I see are creating a game with specific dimensions like so: new Phaser.Game(800, 600, Phaser.AUTO, and then the tile-map they put in scales to 800/600 so it just fits the whole area. I want to have a game like this Tetris screenshot where the Tetris board is my tile-map in the center of the screen and then I can have the area on either side to put whatever I want.
  14. How to center a Tilemap and everything inside?

    So I don't have a camera that moves, everything will be in view at all times. I plan on having a full screen game where the center is a gameboard and then I can wrap the left/right sides of the gameboard with info like a scoreboard or a timer etc. So let's say someone is playing on a 1920x1080 screen. I could then calculate my gameboard to be 1080x1080 centered in the screen leaving 420 pixels on either side. The issue is that when I add the tilemap layer it is always added to (0,0) so instead of it being centered with 420px on either side I have 840px on the right.
  15. Looking at this example here you will see that the loaded tilemap layer doesn't actually fill the whole canvas leaving behind the black background. I want exactly this but I'd like the layer and everything inside to be centered horizontally instead of aligned to the top left of the canvas. Anyone able to help?