HTML and CSS Reference
The code for this will be in the createPlayField() function. If you would like to review
it now, go to the section “Micro Tank Maze Complete Game Code” on page 516
( Example 9-3 ).
All the data about the playField will be stored in application scope variables:
var playField = ;
var items = ;
var xMin = 0;
var xMax = 480;
var yMin = 0;
var yMax = 480;
To create the playField , the game code will need to know the maximum number of
each type of tile. These will also be application scope variables:
var wallMax = 20;
var playerMax = 1;
var enemyMax = 20;
var goalMax = 1;
The player and all of its current attributes will be contained in the player object. Even
a game as simple as Micro Tank Maze requires quite a few attributes. Here is a list and
description of each:
The current row on the 15×15 playField grid where the player resides.
The current column on the 15×15 playField grid where the player resides.
The row the player will move to next, after a successful key press in that direction.
The column the player will move to next, after a successful key press in that
The id of the current tile used to display the player from the playerTiles array.
The player starts pointed up, so this will be the 0 rotation. When the player moves
in one of the four basic directions, this rotation will change and will be used to
move the player in the direction it is facing.
The number of pixels the player object will move on each frame tick.