Pairing the Penguins - Building JavaScript Games for Phones, Tablets, and Desktop - page 290

to move in either the x or y direction and not diagonally, you end up with a vector (1, 0) in the first
example and (0, -1) in the second example. So you set the position of the animal to the position of
the tile it just moved out of, as follows:

var tileField = this.root.find(ID.tiles);
this.velocity.normalize();
var currBlock = this.currentBlock;
this.position = new Vector2(Math.floor(currBlock.x - this.velocity.x) *
tileField.cellWidth, Math.floor(currBlock.y - this.velocity.y) *
tileField.cellHeight);

Note that you multiply the position by the width and height of a cell in the tile field. This is because
tile indices aren't the same as actual pixel positions on the screen. The tile indices only indicate the
location of tiles in the grid, whereas the animal position needs to be expressed as a position on the
screen in pixels.

Finally, you set the animal's velocity to zero so it stays in its new position:

this.velocity = Vector2.zero;

Meeting Other Game Objects
You still need to check whether the animal collides with another game object, such as another
penguin or a shark. There are a few special types of animals:

 Multicolored penguins

 Empty boxes


You can add a few methods to the Animal class to determine whether you're dealing with these
special cases. For example, you're dealing with a seal if the sheet index equals 7 and isn't boxed:

Seals

Animal.prototype.isSeal = function () {
return this.sheetIndex === 7 && !this.boxed;
};

You're dealing with an empty box if the sheet index is 7 and is boxed:

Animal.prototype.isEmptyBox = function () {
return this.sheetIndex === 7 && this.boxed;
};

Finally, you're dealing with a multicolored penguin if the sheet index is 6 and isn't boxed:

Animal.prototype.isMulticolor = function () {
return this.sheetIndex === 6 && !this.boxed;
};