Game Development Reference
In-Depth Information
After the long set of local variables, the scorecard container is created and set to the game variable
scoreCard
.
The scorecard's buttons won't always be enabled during gameplay so you can quickly disable them by setting
mouseEnabled
to false for entire container. It's then positioned using some game constants declared earlier. Next, the
score buttons are added to the container (see Listing 7-14).
Listing 7-14.
The buildScoreCard Function Continued: Creating the Category Buttons
...
// score buttons
for (i = 0; i < scorecardButtons.length; i++) {
btn = new createjs.Sprite(spritesheet, scorecardButtons[i]);
//btn.paused = true;
btn.name = scorecardButtons[i];
btn.key = scorecardButtonKeys[i];
btn.section = section;
btn.y = yPos;
btn.x = xPos;
btn.framerate = 30;
btn.on('animationend', function (e) {
this.stop();
});
btn.on('click', onScoreCardBtnClick);
scoreCard.addChild(btn);
yPos += hGap;
row++;
if (row === btnsPerRow) {
section++;
row = 0;
yPos = 0;
xPos += vGap;
}
}
...
Each score button is a sprite with multiple frames for its revealing animation. As mentioned earlier, the
scorecardButtons
game array will dictate what animation object to use for each sprite. The loop is used to access
those values. Figure
7-7
shows the frames in one of the scorecard category buttons.
Figure 7-7.
The frames for the large straight category sprite
Each category button will start paused so you can dictate when you want to actually reveal each one. This
is now commented out in the same manner as many other visual properties to help position each element as you
create them.
The buttons are given a name and the two custom properties,
key
and
section
. Their keys come from the
scorebuttonKeys
game array, and are helpers to decide how to evaluate the dice when calculating the category score.
