Using and Managing Bitmap Images - Beginning HTML5 Games with CreateJS - page 105

function evalCardsFlipped() {
if (cardsFlipped[0].key === cardsFlipped[1].key) {
matches++;
evalGame();
}
else {
setTimeout(resetFlippedCards, 1000);
}
}
function resetFlippedCards() {
cardsFlipped[0].mouseEnabled = cardsFlipped[1].mouseEnabled = true;
cardsFlipped[0].getChildByName('back').visible = true;
cardsFlipped[1].getChildByName('back').visible = true;
cardsFlipped = [];
}
function evalGame() {
if (matches === faces.length) {
setTimeout(function () {
alert('YOU WIN!')
}, 300)
}
else {
cardsFlipped = [];
}
}
function startGame() {
createjs.Ticker.setFPS(60);
createjs.Ticker.addEventListener("tick", function (e) {
stage.update();
});
}
These cards should give you an idea of the importance of creating containers. You'll be using them quite a
bit as you move forward with more games. They can quickly become essential to graphic management in game
development, and although this section on containers was rather short, most of your previously learned knowledge
on Stage and the display list carries over.
Summary
In this chapter, you've taken a large step forward in making games look more polished by loading in graphics.
The Bitmap object allows you to easily draw these graphics to the stage, and with some effects and filtering, you can
create some cool and interesting features. You also learned the essential technique of grouping display objects by
using the Container class.
In the next chapter, you will learn how to build sprite sheets, which will pack all bitmaps into a single file. These
sprite sheets will be used to create sprites , which can be simple, static graphics, or full-blown animated sequences.