Card Battle! - HTML5 Game Development - page 59

text-align: center;
bottom: 30px;
font-size: 2em;
}
Engage thrusters
The core part of this task is the JavaScript logic, explained as follows:
1. First, we create a new module to randomize all the power values. Prepend the
following code in the game-scene.js ile. The beneit of separaing this logic
is to make changing the power formula easy in the future:
;(function() {
var game = this.cardBattleGame = this.cardBattleGame
|| {};
// Cache elements query
var allPowerElms = document.querySelectorAll('.power');
game.randomizePower = function() {
allPowerElms.forEach(function(elm){
elm.textContent = Math.round(Math.random() * 60)
+ 40;
});
}
})();
2. The power value is stored as a text value inside the power elements. We need
an easy way to get the value to be used in the batle formula later. Create the
following Card deiniion inside the gameScene object:
var Card = (function(){
function Card(node) {
this.node = node;
}
Card.prototype.power = function() {
return 1 *
this.node.querySelector('.power').textContent
// convert string to integer
}
return Card;
})();