Canvas Games: Part II - HTML5 Canvas - page 788

The Tile Sheet for Our Game
Make sure you've read Chapter 4 and the Chapter 8 section, A Basic Game Framework , be-
fore moving on. Even though Micro Tank Maze is a relatively simple game, it is still quite a
few lines of code. We hit the major points, but we don't have space to discuss every detail.
The tile sheet ( tanks_sheet.png ) we use looks very familiar if you've read Chapter 4 . Fig-
ure 9-11 shows tanks_sheet.png .
Figure 9-11. The Micro Tank Maze tile sheet
We are using only a very small portion of these tiles for Micro Tank Maze .
Road tile
This is the tile on which the player and the enemy tanks can move. Tile 0, the road tile, is
in the top-left corner.
Wall tile
The wall tile causes any tank moving on it to be destroyed. Tile 30, the second-to-last tile
on the sheet, is the wall tile.
Goal tile
Thisisthetiletheplayermustreachtowinthegame.Itisthelasttileinthesecond-to-last
row (the phoenix).
Player tiles
The player is made up of the eight green tank tiles. Each tile simulates the tank treads
moving from tile to tile.
Enemy tiles
The enemy is made up of the eight blue tank tiles. These tiles animate the tank treads as
the tank moves from tile to tile.