Book Image

HTML5 Game Development by Example: Beginner's Guide

By : Seng Hin Mak
Book Image

HTML5 Game Development by Example: Beginner's Guide

By: Seng Hin Mak

Overview of this book

Table of Contents (18 chapters)
HTML5 Game Development by Example Beginner's Guide Second Edition
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
9
Building a Physics Car Game with Box2D and Canvas
Index

Time for action – loading the game with levels data


We will refractor our code to support the loading of static ground bodies from a levels data structure. Let's work on it by carrying out the following steps:

  1. Open the box2dcargame.js JavaScript file in a text editor.

  2. We will need each ground setup on each level. Put the following code at the top of the JavaScript file. It is an array of levels. Each level is another array of objects with the position, dimension, and rotation of the static ground body:

    var carGame = {
       currentLevel: 0
    }
    carGame.levels = new Array();
    carGame.levels[0] = [{"type":"car","x":50,"y":210,"fuel":20},
    {"type":"box","x":250, "y":270, "width":250, "height":25, "rotation":0},
    {"type":"box","x":500,"y":250,"width":65,"height":15, "rotation":-10},
    {"type":"box","x":600,"y":225,"width":80,"height":15, "rotation":-20},
    {"type":"box","x":950,"y":225,"width":80,"height":15, "rotation":20},
    {"type":"box","x":1100,"y":250,"width":100,"height":15, "rotation":0},
    {"type":"win...