Card Battle! - HTML5 Game Development - page 71

5. We need to add the health points calculaion in between the batle animaion.
The first step is to add the hurtOpponent method calling after we start the
opponent-shaking animaion:
opponentCard.node.classList.add('shake');//Existing code.
game.HP.hurtOpponent(selectedCard.power(),
opponentCard.power());
6. The second one is the hurtPlayer method calling after the player-shaking
animaion starts:
selectedCard.node.classList.add('shake');//Existing code.
game.HP.hurtPlayer(opponentCard.power(),
selectedCard.power());
7. Now, we have health points, and they will get to zero. Add the following game-over
check ater we complete the player's shake animaion:
selectedCard.node.onAnimationEnd(function(e){
selectedCard.node.classList.remove('shake');
//Existing code.
if (game.HP.isSomeoneDead()) {
game.flow.gameOver();
} else {
//gameScene.restartGame();
}
});
Objective complete - mini debriefing
We have calculated the batle damages and visualized it in the health bar at the top of the
game screen.
The health point module
The first part of the module defines the health point value for the opponent and player.
It also caches the query selector of both the views.
It comes with a reseing method to reset both the health points of the player and opponent
to their iniial state, that is, 100. The method, isSomeoneDead , is to determine if anyone
died with 0 health points. This is useful to determine if the game should end. Then, we have
another similar method, isPlayerDead . This is useful to determine who the winner is, the
opponent or player.