HTML and CSS Reference
In-Depth Information
cancelBuildBtn.on('click', function() {
game.isCreatingNewBuilding = false;
cancelBuildBtn.visible = false;
_this.newBuildingBtn.visible = true;
});
// Cancel button inside building panel
var cancelButton = game.helper.createButton
('images/cancel-sprite.png', 128, 62);
cancelButton.x = 820;
cancelButton.y = 400;
this.buildingPanel.addChild(cancelButton);
cancelButton.on('click', function() {
_this.hideBuildingPanel();
});
// New Building button on stage
this.newBuildingBtn = game.helper.createButton
('images/add-building-sprite.png', 124, 42);
this.newBuildingBtn.x = 820
;
this.newBuildingBtn.y = 420;
this.addChild(this.newBuildingBtn);
this.newBuildingBtn.on('click', function() {
_this.showBuildingPanel();
});
};
10. We extract the visible panel to show or hide the logic and create a funcion
for easier invoking. When displaying the panel, we check the condiion of
each building:
UILayer.prototype.showBuildingPanel = function() {
this.newBuildingBtn.visible = false;
this.buildingPanel.visible = true;
var buildings =
['Merchant', 'PowerSupply', 'CoinsGenerator'];
for (var i=0, len=buildings.length; i<len; i++) {
var name = buildings[i];
// The Boolean determines that the player has enough power
supplies to build that building. It returns true if the building
doesn't need any population requirement.
