017 : Friction

So how am I going to fix the player not being able to stop?

You'll fix it by adding friction. The friction will slow the player down and have it come gently to a stop.

So, let me guess, I need to add a variable to keep track of the player's friction, right?

Yep, except it's not the player's friction. The friction is part of the game world, so you should add it in init_game().

script.js: Define a global friction variable.

function init_game() { ... // The keymap keeps track of which keys are currently being pressed. _game.keymap = {}; // Game state. _game.platform = create_platform(0, 360, _game.width, 40); // Global world parameters. _game.friction = 0.15; }

Run your code in a browser and verify that there are no errors.

Where did that 0.15 number come from?

Well, from experimenting, I just happen to know that 0.15 is a reasonably good value. You can choose a different value later if you want, but this is a good starting value.

OK, but how do I use this friction value?

The friction value defines the percentage of velocity that the player loses every time the game state is updated.

But that's not how friction was defined in our physics class...

Yes, we're cheating a bit here to make the math easier. We're not really modeling friction, but it's useful to think of it as friction so that it makes sense when reading the code.

So how do I use this fake friction?

Since the friction is the percentage of the player's velocity that is lost, you need to multiply the player's velocity by (1 - friction) each time you update. In youy case, you'll end up multiplying by 0.85 (= 1 - 0.15).

This will cause the velocity to slowly decrease based on how much friction we specify. Higher friction values will cause the player to slow down more quickly. Lower friction will have the player slide for a longer time before stopping.

script.js: Slow the player down by applying friction.

function update_player() { check_input(); // Apply the global world effects on the player. _player.velocity_x *= (1.0 - _game.friction); // Move the player to the new location. _player.x += _player.velocity_x; _player.y += _player.velocity_y; }

Run your code in a browser and verify that there are no errors.

If I keep multiplying by 0.85, the number will keep getting smaller and smaller, but it'll never reach 0. Doesn't that mean that the player will keep sliding forever?

Mathematically, the velocity won't ever reach 0, but practically once the velocity is less than 0.01 the player won't be moving on the screen anymore.

Congratulations! You've earned the Movement II - Friction badge!

GOTO 016 if you want to experiment with different friction values

GOTO 018