HTML and CSS Reference
In-Depth Information
Micro Tank Maze Description
Micro Tank Maze
is a simple turn-based strategy game played on a 15×15 tile-based grid. At
the beginning of each game, the player (the green tank), 20 enemy tanks (the blue tanks), 25
wall tiles, and a single goal tile (the phoenix) are randomly placed on the grid. The rest of
the grid is simply road tiles on which the tanks move. The player must get to the goal object
without running into any walls or any of the enemy tanks. On each turn, the player and all
enemytanksmoveasinglespace(tile)onthegrid.Neithertheplayernortheenemytankscan
move off the grid edges. If the player runs into a wall tile or an enemy tank, his game is over.
If an enemy tank runs into a wall or another tank, it is destroyed and removed from the game
board. If an enemy tank runs into the player tank, it and the player are destroyed. If the player
hits the goal tile without an enemy tank also hitting the tile on the same turn, the player wins.
Game progression
Each time the player collects the goal object and wins the game, the next game starts with
one more enemy tank (up to 50 enemy tanks). The ultimate goal of the game is to see how
many times you (the player) can win before your tank is finally destroyed. The game keeps a
session-based highscore,andevenifyoulose,youalwaysstartfromthelastcompleted level.
This is a simple game, and much more can be added to it to enhance the gaming experience.
In this chapter, though, we want to cover the basics of creating a tile-based game on HTML5
Canvas. By combining what you have learned throughout this topic, you should have enough
skill and knowledge to extend this simple contest into a much more robust game-play experi-
ence.
Game strategy
The player must try to reach the goal while avoiding the enemy tanks. The enemy follows or
chases the player to a fault. Most of the time (75%), each enemy tank stupidly follows the
player,evenifthatmeansmovingintoawallanddestroyingitself.Theplayerthenhasthead-
vantage of intelligence to compensate for the large number of tanks the enemy employs. The
other 25% of the time, an enemy tank randomly chooses a direction to move in.
Now, let's get into the game by looking at the tile sheet we will be using.
