Game Development Reference
In-Depth Information
The player gets three rolls during their turn. They may hold dice between rolls, and if they wish, can mark their score
in the appropriate category before all three rolls are used up. The game continues until all 13 categories are scored.
These rules will be periodically reiterated as the development evolves throughout the chapter. Let's start by
setting up the project files.
Setting Up the Project Files
With an understanding of the game that will be built, start by creating your project directory, and adding an
index.html
file that includes the appropriate CreateJS library files (see Listing 7-1). You'll also be writing code in three
separate JavaScript files. Create these files in a new directory named
js
, and name these files
ssData.js
,
Scoring.js
,
and
fakezee.js
.
Listing 7-1.
index.html for the Fakezee Game
<!DOCTYPE html>
<html>
<head>
<title>Fakezee</title>
<script src="lib/easeljs-0.7.1.min.js"></script>
<script src="lib/tweenjs-0.5.1.min.js"></script>
<script src="lib/soundjs-0.5.2.min.js"></script>
<script src="lib/preloadjs-0.4.1.min.js"></script>
<script src="js/ssData.js"></script>
<script src="js/Scoring.js"></script>
<script src="js/fakezee.js"></script>
</head>
<body onload="init()">
<div style="width:550px;margin: 40px auto">
<img src="img/bg.jpg" style="position: absolute;">
<canvas id="canvas" width="550" height="500" style="position: absolute"></canvas>
</div>
</body>
</html>
Reviewing the Sprite Sheet Files
The sprite sheet files for this chapter are available with the topic's source code download. The animation frames for
this sprite sheet were created in FlashCC and imported into TexturePacker using the same procedures learned in
Chapter 6. Start by opening up the sprite sheet image,
fakezee.png
.
Reviewing the Sprite Sheet Image
The
fakezee.png
sprite sheet file contains all graphics needed for the game, with the exception of the background
image, which was added to the DOM under the
canvas
element. Figure
7-2
shows the amount of graphics needed for
the animations and static sprites.
