HTML and CSS Reference
In-Depth Information
The scene is set up in the same way as the previous project. However, this ime we simpliied
it into two scenes only. Add the following code in the game.js file:
;(function(){
var game = this.spaceRunner || (this.spaceRunner = {});
// Main Game Flow
game.flow = {
startGame: function() {
game.gameOverScene.hide();
game.gameScene.startOver();
},
gameOver: function() {
game.gameOverScene.show();
}
};
// Entry Point
var init = function() {
console.log("Welcome to Space Runner Game.");
game.isGameOver = true;
game.gameScene.setup();
game.gameOverScene.setup();
};
init();
}).call(this);
Then, we move to the scene.js file to define a scene object. This scene object has basic
abiliies such as showing and hiding itself. Moreover, it provides a hook for the scene
implementaion to add iniializaion logic in the setup funcion and the onShow funcion:
;(function(){
var game = this.spaceRunner = this.spaceRunner || {};
// Generic Scene object.
var scene = game.scene = {
node: document.querySelector('.scene'),
setup: function(){},
onShow: function(){},
show: function() {
this.node.classList.remove('out');
this.node.classList.add('in');
this.onShow();
},
hide: function() {
 
Search WWH ::




Custom Search