toto88x

How to make the player do small / medium / long jumps?

Recommended Posts

Hi,

 

I'm building a mario like. Right now I'm doing this to make the player jump:

if (cursor.up.isDown && player.body.touching.down)        player.body.velocity.y = -100;

It's simple, and it works. What I'm trying to do now is to make the player do small / medium / long jumps, depending on how long the player press on the up arrow key. And I'm not sure what's the best way to do this. Any idea?

 

Thanks! 

Share this post


Link to post
Share on other sites

I'm still new to phaser so there is most likely a better way of doing this..
 
Quick and messy but this should work:
In the preload():

var timer = 0;var loadingJump = false;

In update()

    if (cursors.up.isDown && player.body.touching.down) {        loadingJump = true;        timer += game.time.elapsed; // time is in ms                    } else if (loadingJump == true) {                    if (timer < 300) {                // small jump                player.body.velocity.y = -150;            }            else if (timer < 600) {                 // medium jump                player.body.velocity.y = -250;            }            else if (timer > 600) {                // longjump                player.body.velocity.y = -350;            }            loadingJump = false;            timer = 0;        }

Edit: changed the timing

Share this post


Link to post
Share on other sites

Thanks! But I dont want the player to hold a key, and after see the player jump.

 

I want to make it like mario: while the button is pressed, the player jump. And depending on how long the button is pressed, the player will jump more or less high.

 

With your code:

1) if (cursors.up.isDown && player.body.touching.down), will be true only before the player jumps (when it touches the ground)

2) if (timer < 600), we cannot know in advance if the player is going for a medium jump 

 

Thanks!

Share this post


Link to post
Share on other sites

I think that if you will modify the gravity:

1. Player started jump and holds his finger on the screen then gravity is 0.5 of normal garvity

2. Player released his finger then back gravity to the normal value

 

Then effect should be close to what you want to achieve. Sorry that I can't give you code example in Phaser but I am not familiar with it:)

Share this post


Link to post
Share on other sites

Ah okay now I understand what you want.

 

My old code lets the player "charge" a jump while standing on the ground. Upon release the jump is executed based on how long the button was pressed.

 

----

 

You want to change the gravity for your longer jumps while holding the jump key after the initial jump.

Again quick working code based on my limited knowledge about the engine:

 

preload():

var globalGravity = 9; // or any value you needvar playerJumped = false;

update():

    if (cursors.up.isDown && player.body.touching.down) {        //  Allow the player to jump if they are touching the ground.        player.body.velocity.y = -200;        playerJumped = true;            } else if (cursors.up.isDown && playerJumped == true )  {          // reduce players gravity if player recently jumped and jump key is down         player.body.gravity.y = globalGravity - 4;    } else {        // reset gravity once the jump key is released to prevent prolongation        playerJumped = false;        player.body.gravity.y = globalGravity;    }

Here is a working example:

https://dl.dropboxusercontent.com/u/7910081/html5examples/longjump/longjump.html

 

Edit: Jorasso beat me to it :)

Share this post


Link to post
Share on other sites

Setting the velocity is not impossible by any means but a bit awkward to do.

You would have to compute a velocity bleed by yourself the longer the jump persists instead of letting the physics engine do the work.

 

At least I think it's the best way altering the gravity.

Please correct me if I'm wrong :)

Share this post


Link to post
Share on other sites

I have another solution, it goes like this:

 

        var jumptimer = 0;

 

        function update() {
            if (cursors.up.isDown && player.body.touching.down)
            {   //player is on the ground, so he is allowed to start a jump
                jumptimer = 1;
                player.body.velocity.y = -250;
            } else if (cursors.up.isDown && (jumptimer != 0))
            { //player is no longer on the ground, but is still holding the jump key
                if (jumptimer > 30) { // player has been holding jump for over 30 frames, it's time to stop him
                    jumptimer = 0;
                } else { // player is allowed to jump higher (not yet 30 frames of jumping)
                    jumptimer++;
                    player.body.velocity.y = -250;
                }
            } else if (jumptimer != 0) { //reset jumptimer since the player is no longer holding the jump key
                jumptimer = 0;
            }
}

 

With this code (and a gravity of 9.8) my Player sprites jumps ~70 pixels high when you just quickly press jump.

If you hold jump, he does jump around 4 times as high. You can adjust by limiting the jump timer to more or less then 30 frames.

Share this post


Link to post
Share on other sites

currently I'm doing something roughly similar. I use finite state machines to track & control sprite's behaviour. when the player sprite is in a 'jumping' state, but the jump key is no longer being held, I reduce the sprites velocity slowly (halve it each update, actually). when it reaches (more accurately when it closely approaches) zero, the sprite's state changes to 'falling'. yes, this circumvents the physics engine to some extent, but it gets me the 'feel' to the controls that I wanted.

 

the problem with all the approaches shown, including mine, is that the distance that the sprite can jump changes with the frame-rate of the game. if you depend on the sprite being able to jump a certain height to clear game obstacles, this can be a major problem - even a high-powered desktop machine will occasionally drop frames. the right way to do it would be to modify gravity or velocity based on the game time elapsed, not the number of frames.

Share this post


Link to post
Share on other sites

jcs, you are correct.

 

I wasn't sure of this - I thought maybe on dropping framerate only the drawing functions gets dropped (is called less), but you are right, the "update" method is called less too.

 

here is my test:

 

http://janpeter.net/alien/speedtest/speedtest2.html - 2 sprites running, one velocity 60, the other x+1 each tick

 

http://janpeter.net/alien/speedtest/speedtest.html - 2 sprites running, one velocity 60, the other x+1 each tick - SAME CODE WITH MORE Sprites "watching" (e.g. with lag)

 

So it's true, we can't rely on a counter for our jump-timing.

 

I will instead try to do it with game.time when I have a solution.

Share this post


Link to post
Share on other sites

This yields way better results in jumping while lagging.


 


It is not 100% - if the lags are so heavy, that the physics engine moves the player too far without calling update() he jumps higher than intended - but: at maximum this has the error of the movement that occurs between two frames, instead of having the error of all dropped frames while doing the jump (as the simple counter solution has).


 


        var jumptimer = 0;


 


        function update() {

            if (cursors.up.isDown && player.body.touching.down)

            {   //player is on the ground, so he is allowed to start a jump

                jumptimer = game.time.time;

                player.body.velocity.y = -250;

            } else if (cursors.up.isDown && (jumptimer != 0))

            { //player is no longer on the ground, but is still holding the jump key

                if (jumptimer > 600) { // player has been holding jump for over 600 millliseconds, it's time to stop him

                    jumptimer = 0;

                } else { // player is allowed to jump higher, not yet 600 milliseconds of jumping

                    player.body.velocity.y = -250;

                }

            } else if (jumptimer != 0) { //reset jumptimer since the player is no longer holding the jump key

                jumptimer = 0;

            }

}

 


 


I have just tested this in my jump and run (by adding lag with 5000 sprites).


Results are as expected.


Old Counter solution: You can jump as high as you want, because you have 30 frames to jump.. and framerate is low, so physics covers alot of ground in 30 frames


New Game.time.time Solution: You don't notice a difference, you lag, but you jump just as high as without the lag.


Share this post


Link to post
Share on other sites

 

This yields way better results in jumping while lagging.

 

It is not 100% - if the lags are so heavy, that the physics engine moves the player too far without calling update() he jumps higher than intended - but: at maximum this has the error of the movement that occurs between two frames, instead of having the error of all dropped frames while doing the jump (as the simple counter solution has).

 

        var jumptimer = 0;

 

        function update() {
            if (cursors.up.isDown && player.body.touching.down)
            {   //player is on the ground, so he is allowed to start a jump
                jumptimer = game.time.time;
                player.body.velocity.y = -250;
            } else if (cursors.up.isDown && (jumptimer != 0))
            { //player is no longer on the ground, but is still holding the jump key
                if (jumptimer > 600) { // player has been holding jump for over 600 millliseconds, it's time to stop him
                    jumptimer = 0;
                } else { // player is allowed to jump higher, not yet 600 milliseconds of jumping
                    player.body.velocity.y = -250;
                }
            } else if (jumptimer != 0) { //reset jumptimer since the player is no longer holding the jump key
                jumptimer = 0;
            }
}

 

 

I have just tested this in my jump and run (by adding lag with 5000 sprites).

Results are as expected.

Old Counter solution: You can jump as high as you want, because you have 30 frames to jump.. and framerate is low, so physics covers alot of ground in 30 frames

New Game.time.time Solution: You don't notice a difference, you lag, but you jump just as high as without the lag.

 

 

This is exactly what i needed! Thanks :D

Share this post


Link to post
Share on other sites

Hello everyone, 

Was wondering if someone found a solution for this specific problem on phaser 3, cause if we call the stage.time method in the update function, the time will update everyframe so it wont work at all.

 

Thx

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.