Building an Isometric City Game - HTML5 Game Development - page 178

// loop the 2D array for visualization
for (var i=0; i<this.rows; i++) {
for (var j=0; j<this.cols; j++) {
if (this.data[i][j] !== newDataMap[i][j]) {
this.tiles.removeChild(this.viewMap[i][j]);
var className = newDataMap[i][j];
// sprite based on the selected building type
var tile = new game[className]();
tile.x = (j-i) * game.Tile.width / 2;
tile.y = (j+i) * game.Tile.height / 2;
this.tiles.addChild(tile);
this.viewMap[i][j] = tile;
}
}
}
this.data = newDataMap;
// Reorder the building based on Y
this.tiles.sortChildren(function(b1, b2) {
if (b1.y > b2.y) { return 1; }
if (b1.y < b2.y) { return -1; }
return 0;
});
};
10. Inside the UILayer constructor funcion add the following lines of code:
var _this = this; // for event handler to refer 'this'
game.on('placedBuilding', function(){
_this.cancelBuildBtn.visible = false;
_this.newBuildingBtn.visible = true;
});
11. Ater the player chooses a building from the building creaion panel, the
readyToPlaceBuilding funcion is invoked. We dispatch the event to
let the city layer know that we have a new building to be placed:
UILayer.prototype.readyToPlaceBuilding = function() {
...
// existing code goes here.
game.dispatchEvent('newBuildingToBePlaced');
};