HTML and CSS Reference
Next, we will examine the entire game flow and state machine to give you an overall
look at how the game logic is designed.
Turn-Based Game Flow and the State Machine
Our game logic and flow is separated into 16 discrete states. The entire application runs
on a 40 frames per second interval timer:
const FRAME_RATE = 40;
var intervalTime = 1000/FRAME_RATE;
setInterval(runGame, intervalTime )
As with the other games, in Chapter 8 and earlier in this chapter, we will use a function
reference state machine to run our current game state. The switchGameState()
function will be used to transition to a new game state. Let's begin by discussing
this function briefly, and then moving through the rest of the game functions.
We will not reprint each line of code or dissect it in detail here. Use this
section as a guide for perusing the entire set of game code included at
the end of this chapter (in Example 9-3 ). By now, you have seen most
of the code and ideas used to create this game logic. We will break out
the new ideas and code in the sections that follow.
This state loads in the assets we need for our game. We are loading in only a single tile
sheet and no sounds for Micro Tank Maze .
After the initial load, it sends the state machine to the GAME_STATE_WAIT_FOR_LOAD state
until the load event has occurred.
This state simply makes sure that all the items in GAME_STATE_INIT have loaded properly.
It then sends the state machine to the GAME_STATE_TITLE state.
This state shows the title screen and then waits for the space bar to be pressed. When
this happens, it sends the state machine to GAME_STATE_NEW_GAME .
This state resets all of the game arrays and objects and then calls the createPlay
Field() function. The createPlayField() function creates the playField and enemy ar-
rays for the new game, as well as sets the player object's starting location. Once it has