TacoCoder Posted December 19, 2016 Share Posted December 19, 2016 Hi I'm writing a endless runner with typescript+phaser. I haven't made much progress yet, right now it only generates an infinite platform and has a running player that can jump. Now its the jumping I'm having issues with... when the game starts, the bottom of the player (which is its Y anchor) is at 400, which is the top of the platform. The player runs along fine and has no issues what so ever till I jump. Once the player lands after jumping, it starts jumping up and down (a little bit, only noticeable by looking at its Y through console.log), and the collision bool (from game.physics.arcade.collide) starts to switch between true and false every frame. Also, after landing a jump the players Y is a little bit under the platform top. Here is the code: /// <reference path="defs/phaser.d.ts" /> class Game { game: Phaser.Game; player: Phaser.Sprite; platform: Phaser.Group; constructor() { this.game = new Phaser.Game(800, 600, Phaser.AUTO, '', { preload: this.preload, create: this.create, update: this.update }) } preload() { this.game.load.atlasJSONHash('player', '/assets/player.png', '/assets/player.json'); this.game.load.image('grass_left', '/assets/grass_left.png'); this.game.load.image('grass_middle', '/assets/grass_middle.png'); this.game.load.image('grass_right', '/assets/grass_right.png'); } create() { this.game.physics.startSystem(Phaser.Physics.ARCADE); // Create player this.player = this.game.add.sprite(20, 400, 'player'); this.player.anchor.set(0.5, 1); this.player.animations.add('jump', [3]); this.player.animations.add('walk', [5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]); this.player.animations.play('walk', 20, true); this.game.physics.arcade.enable(this.player); this.player.body.gravity.y = 400; this.player.body.bounce.y = 0; this.player.body.velocity.x = 200; // Create platform this.platform = this.game.add.group(); this.platform.enableBody = true; var block = this.platform.create(0, 400, 'grass_left'); block.body.immovable = true; for(var i = 0; i < 10; i++) { block = this.platform.create((i + 1) * 70, 400, 'grass_middle'); block.body.immovable = true; } this.game.world.setBounds(0, 0, 999999999999999999, 600); } update() { if(this.platform.right < this.game.camera.x + 800) { var block = this.platform.create(this.platform.right, 400, 'grass_middle'); block.body.immovable = true; } console.log(this.player.y); var onPlatform = this.game.physics.arcade.collide(this.player, this.platform); if(!onPlatform) { this.player.animations.play('jump', 20, true); } else { this.player.animations.play('walk', 20, true); } // Input var cursors = this.game.input.keyboard.createCursorKeys(); // Jump if(onPlatform && cursors.up.isDown && this.player.body.touching.down) { this.player.body.velocity.y = -450; } this.game.camera.x = this.player.x - 200; } } window.onload = () => { var game = new Game(); } Here is some values each frame after landing a jump: Frame 1 Player Y: 397 Collision with platform: false Frame 2 Player Y: 397.1111111111111 Collision with platform: true Frame 3 Player Y: 397 Collision with platform: false Frame 4 Player Y: 397.1111111111111 Collision with platform: true Hopefully you can help me, I've been bashing my head on it for hours now, and its starting to hurt! Thanks in advance Link to comment Share on other sites More sharing options...
drhayes Posted December 19, 2016 Share Posted December 19, 2016 It sounds like you care about those two values because that's what you're gating your jumps on: if the y is too big, or collision is false, no jump possible. Why not change that around? On first collision with a platform, set a boolean to true (you could use the |= operator to set it). That boolean stays true until the player hits the jump key. It won't turn true again until the player hits a platform. I've seen this called the "sticky" bit before. Link to comment Share on other sites More sharing options...
TacoCoder Posted December 19, 2016 Author Share Posted December 19, 2016 6 hours ago, drhayes said: It sounds like you care about those two values because that's what you're gating your jumps on: if the y is too big, or collision is false, no jump possible. Why not change that around? On first collision with a platform, set a boolean to true (you could use the |= operator to set it). That boolean stays true until the player hits the jump key. It won't turn true again until the player hits a platform. I've seen this called the "sticky" bit before. Thanks for the reply I've taken the jump code from the "Your first game" tutorial, so it should work... I'll try your suggest out and let you know how it goes Link to comment Share on other sites More sharing options...
TacoCoder Posted December 19, 2016 Author Share Posted December 19, 2016 6 hours ago, drhayes said: It sounds like you care about those two values because that's what you're gating your jumps on: if the y is too big, or collision is false, no jump possible. Why not change that around? On first collision with a platform, set a boolean to true (you could use the |= operator to set it). That boolean stays true until the player hits the jump key. It won't turn true again until the player hits a platform. I've seen this called the "sticky" bit before. Also not really... I don't really care about the y value, just posted it there to show what I meant by moving up and down. And jumping still seems to work fine, its more animations that are an issue. Link to comment Share on other sites More sharing options...
samme Posted December 19, 2016 Share Posted December 19, 2016 I'm not sure I see it (I don't know your asset dimensions though): Link to comment Share on other sites More sharing options...
TacoCoder Posted December 19, 2016 Author Share Posted December 19, 2016 44 minutes ago, samme said: I'm not sure I see it (I don't know your asset dimensions though): Yeah, the problem is with the animations. When the collision with platform changes every frame, the animation is switched from jump to run quickly every frame. See if you get the varying collision... -- EDIT -- Just sure the data down the bottom... all looks fine in the codepen. Interesting... Link to comment Share on other sites More sharing options...
samme Posted December 20, 2016 Share Posted December 20, 2016 Are there gaps between your platforms? Link to comment Share on other sites More sharing options...
TacoCoder Posted December 20, 2016 Author Share Posted December 20, 2016 4 hours ago, samme said: Are there gaps between your platforms? Yes. Its a group of single blocks together. Also the issue doesn't occur before the first jump. Link to comment Share on other sites More sharing options...
Tom Atom Posted December 20, 2016 Share Posted December 20, 2016 Hi, are all your player sprites in atlas of exactly the same size? Link to comment Share on other sites More sharing options...
drhayes Posted December 20, 2016 Share Posted December 20, 2016 I think my "sticky bit" advice still applies. Instead of relying on y velocity or body.touching to determine animation state you rely on the sticky bit instead..? Link to comment Share on other sites More sharing options...
Recommended Posts