Book Image

HTML5 Game Development Hotshot

By : Seng Hin Mak, Makzan Makzan (Mak Seng Hin)
Book Image

HTML5 Game Development Hotshot

By: Seng Hin Mak, Makzan Makzan (Mak Seng Hin)

Overview of this book

Table of Contents (15 chapters)
HTML5 Game Development HOTSHOT
About the Author
About the Reviewers

Defining levels

In this task, we define multiple levels that contain different combinations of obstacles.

Prepare for lift off

We have successfully put bodies in the physics world in the previous tasks. In this task, we would like to extract the body placement into an easier definition, so that we can massively define a series of levels.

In these levels, we define the position of the hoop and ball. We also define how obstacles are placed in each level.

We define the levels in a new file called level.js. Let's include it in HTML:

<script src="scripts/level.js"></script>

Engage thrusters

We will now work on the newly created level.js file:

  1. In the level.js file, we define the balls and levels data. Most of the data defines the physics properties:

    game.balls = {
      'slow ball': {
        className: 'SlowBall',
        radius: 13,
        density: 0.6,
        friction: 0.8,
        restitution: 0.1
      'bouncy ball': {
        className: 'BouncyBall',
        radius: 10,
        density: 1.1,
        friction: 0.8,