HTML and CSS Reference
In-Depth Information
The
heal
method does the reverse and increases the players' health by a set amount. In the case of both
heal
and
interact
, a
health
event fires off for later to use to indicate that the player's health has been
changed.
Extending the Tile Map with Sprites
With the player class updated and the additional sprite classes created, all that's left is to update the
Q.Level
class to add sprites onto the board where necessary. In addition, the viewport for large browsers is currently too
large and allows the player to see too much of the dungeon. A better option would be to narrow down the view-
port so that map tiles are exposed only when the player is near them. If you remember, the
Q.DOMTileMap
class had an option to turn on and off the visibility of individual tiles, and that can now be used to slowly expose
the dungeon as the player goes through it.
To get the additional sprites into the tile map, the legend
Q.Level
class needs to be extended to point to the
new creator methods for the different types of tiles. These new methods, in addition to returning the appropriate
tile, each insert an object into the stage. Add the code highlighted in
Listing 13-12
to the
Q.Level
class.
Listing 13-12:
The final Level class
Q.Level = Q.DOMTileMap.extend({
legend: {
"X": "wall",
".": "floor",
"m": "monster",
"f": "fountain",
"d": "door",
"g": "gold",
"s": "stairs"
},
init:function(asset,stage) {
this.stage = stage;
this.level = [];
this.sprites = [];
var data = Q.asset(asset);
this.extra = [];
_.each(data.split("\n"),function(row) {
var columns = row.split("");
if(columns.length > 1) {
this.level.push(columns);
this.sprites.push([]);
}
},this);
this._super({
cols:this.level[0].length,
rows:this.level.length,
sheet: 'tiles'
})
