Card Battle! - HTML5 Game Development - page 46

game.flow = {
startOver: function() {
game.startScene.show();
game.gameScene.hide();
game.gameOverScene.hide();
},
startGame: function() {
game.startScene.hide();
game.gameScene.show();
game.gameOverScene.hide();
},
gameOver: function() {
game.startScene.hide();
game.gameScene.hide();
game.gameOverScene.show();
}
}
// Entry Point
var init = function() {
game.startScene.setup();
game.gameScene.setup();
game.gameOverScene.setup();
}
init();
})();
4. Then, we move to define how each scene should behave. Scene management
is a major component worth a dedicated file. We put the following code in the
scenes.js file:
;(function(){
var game = this.cardBattleGame = this.cardBattleGame
|| {};
// Generic Scene object.
var scene = game.scene = {
node: document.querySelector('.scene'),
setup: function(){},
onShow: function(){}, // hook for child objects to
use.
show: function() {
this.node.classList.remove('out');
this.node.classList.add('in');
this.onShow();