HTML and CSS Reference
With the help of the physics engine, we can focus on defining the game-play rules and the
relaionship between the objects. Without the need to worry about collision and movement,
we can save ime to explore diferent game plays. We then elaborate and develop the setup
further, as we like, among the prototypes.
We deine the posiion of the hoop and the ball. Then, we apply an impulse force to the
ball in the x and y dimensions. The engine will handle all the things in between. Finally,
we get an event trigger if the ball passes through the hoop.
It is worth noing that some blockbuster games are also made with a physics engine.
This includes games such as Angry Birds , Cut the Rope , and Where's My Water .
Your Hotshot objectives
We will divide the project into the following eight tasks:
F Creaing the simulated physics world
F Shooing a ball
F Handling collision detecion
F Defining levels
F Launching a bar with power
F Adding a cross obstacle
F Visualizing graphics
F Choosing a level
Similar to the previous project, we create a project folder that contains the index.html
file and the scripts and styles folders. Inside the scripts folder, we create three files:
physics.js , view.js , and game.js .
The physics.js file is the most important file in this project. It contains all the logic
related to the physics world including creaing level objects, spawning dynamic balls,
applying force to the objects, and handling collision.
The view.js file is a helper for the view logic including the scoreboard and the
The game.js file, as usual, is the entry point of the game. It also manages the levels
and coordinates between the physics world and view.