HTML and CSS Reference
In-Depth Information
The next function loads sprite file names and a corresponding two-dimensional array of names; to skip a row, use “” .
This function is used later, in the default configuration (see the section “Basic Tileset Configuration”). You arrange
all the tile images into a number of files. Each file contains a grid with 32 × 32 cells that hold a number of images. For
each file with images, you will call that function. The function OnComplete will be called after all images are loaded:
addSpriteSheet: function(filename, names) {
var self = this;
var img = new Image();
img.onload = function() {
if (self.loaded == && self.onComplete) //Are all images loaded?
img.src = filename;
// Parsing 2-dimension array of names and generating sprites objects
for (var i=0; i<names.length; i++)
for (var j=0;j<names[i].length;j++) {
var name = names[i][j];
if (name != "") {
this.add(new Sprite(name, img, j*TILE_SIZE, i*TILE_SIZE));
Basic Tileset Configuration
Why bother to creating tiles and sprites separately? Most tile editors use integers to enumerate the tiles and store a
maplike array of integers. In real life, however, sad things happen. One moment your artist friend makes you a pretty
tileset (see Figure 22-3 ), and the next, she completely reorders the tiles while adding new ones (see Figure 22-4 ). This
is why you must create a configuration that allows for easy migration. Also, people who make modifications to your
game will be grateful if you implement it in this manner.
Figure 22-3. Pretty tileset
Search WWH ::

Custom Search