Creating a 2-D Platformer - HTML5 Mobile Game Development - page 355

case 'left':
this.colBounds.destX = (tileX+1)*p.tileW + p.x + Q.dx;
this.colBounds.destY = y;
break;
case 'right':
this.colBounds.destX = tileX*p.tileW + p.x - Q.dx;
this.colBounds.destY = y;
break;
}
return this.colBounds;
}
return false;
},
The primary method, checkBounds , takes in a position object and a collision point's object and checks
each of the points against its tiles by calling checkPoints , returning the first collision it finds, otherwise
returning false . To prevent a situation in which a sprite gets caught in a corner and keeps inching through a
wall, the start parameter cycles through the starting edge to check.
The checkPoints method checks one array of points. It does this by looping over the array and calling
checkPoint (singular) and again returning the first result that causes a collision.
Finally, the workhorse checkPoint calculates the tile position of the point, and if a tile is at that position,
it fills in the colBound object, which is an object reused from collision to collision to save garbage collection
time. That method, because it knows the type of point that caused the collision, can move that point to the top,
bottom, or sides of the tile as necessary to resolve the collision.
Stitching It Together with the PlatformStage
To connect the 2d component and the TileLayer , a specialized stage object needs to be created. Its job is
to check the object for collisions against the TileLayer along with a more basic bounding box to check any
other sprites, adjust the position of the sprite if it collides, and then call events on the objects as necessary based
on the collision detected.
This Q.PlatformStage class has the task to handle these different pieces. This stage class, although it
might have multiple tile layers on the screen, is allowed to have only a single tile layer used for collisions,
called the collisionLayer . Sprites that have a matching collisionMask with the collisionLayer
go through the tile collision process.
The stage also performs the normal bounding box check between sprites.
Add the code for Q.PlatformStage from Listing 18-7 to the bottom of quintus_platformer.js
to finish that file's functionality.
Listing 18-7: The PlatformStage Class
Q.PlatformStage = Q.Stage.extend({
collisionLayer: function(layer) {
this.collision = this.insert(layer);
},
_tileCollision: function(obj,start) {