Multiply Defense - HTML5 Game Development - page 131

Engage thrusters
We have prepared the interface with HTML and CSS. Let's work on the logic by adding
appropriate code to our game.js ile, as menioned in the following steps:
1. We want to provide feedback to players when they click on the inputs. So we will
display an equaion, just like any calculator, that relects the player's inputs:
game.gameView = {
init: function() {
// text for calculation equation
this.calculationText = new createjs.Text('1x1=1', '18px
Impact', 'white');
this.calculationText.textAlign = 'center';
this.calculationText.x = game.setting.gameWidth / 2;
this.calculationText.y = game.setting.gameHeight - game.
setting.controlHeight - 30;
game.stage.addChild(this.calculationText);
// existing init code goes here.
},
// existing gameView code goes here.
}
2. The game view should be able to change the equaion over ime:
game.gameView = {
updateText: function(string) {
this.calculationText.text = string;
},
// existing gameView code goes here.
}
3. The equaion text is placed just above the input controls. We will store the height
of controls under seing for an easier placement of the equaion:
game.setting = {
controlHeight: 100,
// existing settings go here.
}
4. Next, we loop through all the number inputs and handle the click acion:
// Input
;(function(){
var game = this.game || (this.game={});