Canvas Game Essentials - HTML5 Canvas - page 418

We will need to loop through each of the various object types that must be checked
against one another. But we do not want to check an object that was previously de-
stroyed against other objects. To ensure we do the fewest amount of collision checks
necessary, we have implemented a routine that employs label and break statements.
Here is the logic behind the routine:
1. Create a rocks: label and then start to loop through the rocks array.
2. Create a missiles: label inside the rocks iteration, and loop through the player
Missiles array.
3. Do a bounding box collision detection between the last rock and the last missile.
Notice that we loop starting at the end of each array so that we can remove elements
(when collisions occur) in the array without affecting array members that have not
been checked yet.
4. If a rock and a missile collide, remove them from their respective arrays, and then
call break rocks and then break missiles . We must break back to the next element
in an array for any object type that is removed.
5. Continue looping through the missiles until they have all been checked against the
current rock (unless break rocks was fired off for a rock/missile collision).
6. Check each saucer, each saucer missile, and the player against each of the rocks.
The player does not need a label because there is only a single instance of the player.
The saucers and saucerMissiles will follow the same logic as missiles . If there is
a collision between one and a rock, break back to their respective labels after re-
moving the objects from their respective arrays.
7. Once we have checked the rocks against all the other game objects, check the
playerMissiles against the saucers using the same basic logic of loop labels, looping
backward through the arrays, and breaking back to the labels once objects are
removed.
8. Check the saucerMissiles against the player in the same manner.
Over the years, we have found this to be a powerful way to check multiple objects'
arrays against one another. It certainly is not the only way to do so. If you are not
comfortable using loop labels, you can employ a method such as the following:
1. Add a Boolean hit attribute to each object and set it to false when an object is
created.
2. Loop through the rocks and check them against the other game objects. This time
the direction (forward or backward) through the loops does not matter.
3. Before calling the boundingBoxCollide() function, be sure that each object's hit
attribute is false . If not, skip the collision check.
4. If the two objects collide, set each object's hit attribute to true . There is no need
to remove objects from the arrays at this time.