Adding Player Interaction - Building JavaScript Games for Phones, Tablets, and Desktop - page 352

Later, you can determine whether the level is completed by checking the visibility of each water
drop. If all the water drops are invisible, you know the player has collected all of them.

Ice Blocks
Another type of interaction you can add to the game is special behavior when the player is walking
over ice. When the player moves over ice, you want the character to continue sliding at a constant
rate and not stop moving when the player releases the arrow key. Even though continuing to slide
isn't completely realistic (in real life you would slide and slow down), it does lead to predictable
behavior that the player can easily understand, which in many cases is more important than
achieving realism. To implement this, you have to do two things:

handleInput method to deal with moving over ice.
Calculate whether the player is standing on ice.

 Extend the


You keep track of whether the player is standing on ice in a member variable walkingOnIce in the
Player class. Let's assume for now that this variable is updated somewhere else, and let's look at
extending the handleInput method. The first thing you want to do is increase the player's walking
speed when the character is walking on ice. You can do that as follows:

var walkingSpeed = 400;
if (this.walkingOnIce) {
walkingSpeed *= 1.5;
}

The value by which the speed is multiplied is a variable that influences the gameplay. Choosing
the right value is important—too fast, and the level becomes unplayable; too slow, and the ice isn't
different from a regular walking surface in any meaningful way.

If the player isn't walking on ice but is instead standing on the ground, you need to set the x velocity
to zero so the character stops moving when the player is no longer pressing an arrow key or one of
the touch buttons. To achieve this, you extend the earlier if instruction as follows:

var walkingSpeed = 400;
if (this.walkingOnIce) {
walkingSpeed *= 1.5;
this.velocity.x = Math.sign(this.velocity.x) * walkingSpeed;
} else if (this.onTheGround)
this.velocity.x = 0;

Then you handle the player input. If the player is pressing the left or right arrow key, you set the
appropriate x velocity:

if (powerupjs.Keyboard.down(powerupjs.Keys.left))
this.velocity.x = -walkingSpeed;
else if (powerupjs.Keyboard.down(powerupjs.Keys.right))
this.velocity.x = walkingSpeed;