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

Adding a cross obstacle

We should be used to the static body by now. It is time to add more types of obstacles to the physics world.

In this task, we add a cross obstacle with motor spinning.

Engage thrusters

Let's execute the following steps to create a spinning cross in the world:

  1. First, we define a new method that creates a cross. It is a long method. A cross is constructed with two fixtures in one body and then a static body with a revolute joint to spin the cross:

    physics.createCross = function(obstacle) {
      var bodyDef = new b2BodyDef;
      var fixDef = new b2FixtureDef;
      // default fixture
      fixDef.density = 0.2;
      fixDef.friction = 0.5;
      fixDef.restitution = 0.2;
      bodyDef.type = b2Body.b2_dynamicBody;
      bodyDef.position.x = obstacle.position.x/pxPerMeter;
      bodyDef.position.y = obstacle.position.y/pxPerMeter;
      fixDef.shape = new b2PolygonShape();
      fixDef.shape.SetAsBox(obstacle.length/pxPerMeter, obstacle.width/pxPerMeter);
      var cross =;