Game Development Reference
In-Depth Information
on if the puzzle was solved or if all lives were lost. This message is displayed with a new text object that is formatted,
positioned, and faded up on the stage. Figure
3-10
shows the outcome when a player wins the game.
Figure 3-10.
Game Win message
Finally, the
startGame
function is written to set up the
Ticker
and stage updates; it is the last function called in
the
init
function. Listing 3-20 shows this final function that is used as the heartbeat of the game.
Listing 3-20.
wordGame.js - startGame Function to Set Up Ticker and Stage Updates
function startGame() {
createjs.Ticker.setFPS(60);
createjs.Ticker.addEventListener("tick", function (e) {
stage.update();
});
}
Summary
In this chapter, you started to see your game graphics really come alive by adding interactivity with user input. You
learned how to use both mouse and keyboard events to control game elements on the stage. You also started creating
messages by using the EaselJS
Text
and
DOMElement
classes. A few examples and short games demonstrated how
quickly you can build canvas games using the EaselJS drawing API and its core interaction model.
User input and messaging are crucial aspects to any game, and the lessons learned in this chapter should
already give you the ground needed to start building engaging games using EaselJS graphics. Now that you can
create, animate, and control graphics and text, the next chapter will be a full game project using the skills you've
learned so far.
