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
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Shooting the ball


In this task, we create a hoop and allow the player to throw the ball by clicking the mouse button. The ball may or may not pass through the hoop based on the throwing angle and power.

Prepare for lift off

We remove the two bodies that were created in the first task. Those two bodies were just an experiment and we don't need them anymore.

Engage thrusters

In the following steps, we will create the core part of this project—shooting the ball:

  1. We will create a hoop and spawn a ball in the physics world. We create a function for these two tasks:

    physics.createLevel = function() {
      this.createHoop();
    
      // the first ball
      this.spawnBall();
    };
  2. We are going to spawn many balls. We define the following method for this task. In this task, we hardcode the position, ball size, and fixture properties. The ball is spawned as a static object until the player throws the ball out:

    physics.spawnBall = function() {
      var positionX = 300;
      var positionY = 200;
      var radius = 13;
    
      var bodyDef...