O'Reilly logo

HTML5 Game Development HOTSHOT by Makzan

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Ending the game

In this task, we will add a life system to give the game an ending. For each box that passes through the dead line, we deduce one life. The game continues until a player loses all the life points.

Prepare for lift off

Before we get into the logic, we would like to define how many lives a player gets in each game. We define this value in the setting object, as shown in the following code:

game.setting = {    
  initialLifes: 3,
  // existing settings go here.
};

Engage thrusters

Let's code the game-end logic with the following steps:

  1. We have defined three lives per game so we will use three hearts to represent three lives. Before we add bitmap graphics, we use a RectShape function to represent a heart. Furthermore, we will use a container object ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required