In this task, we are going to show how to advance to the next level when the player's composition matches that of the quest compositions in the current level.
This time, we need quest-level data in the quest.js file to be accessible from another file, so we need to attach the questLevels and questData methods to the game scope rather than the original local scope:
In the
quest.jsfile, we change thequestLevelsdeclaration fromvar questLevelstogame.questLevels.We apply the same to
questData:// from var questData = questLevels[level]; // to var questData = game.questLevels[level];
In the
scenes.jsfile, we display the level with the following function:gameScene.updateLevelInfo = function(level) { document.getElementById('stage').textContent = "Stage "+ level; };At last, we modify the game flow in the
game.jsfile to count the level:game.flow = { currentLevel: -1, maxLevel: game.questLevels.length - 1, startOver: function() { ... this.currentLevel = -1; }, nextLevel: function() { this.currentLevel+=1; if (this.currentLevel>= this.maxLevel) this.currentLevel = this.maxLevel; game.gameScene.updateLevelInfo(this.currentLevel+1); // when displaying level, we start from 1 instead of 0, so +1 here. ... }, ... }
The level up is done by counting the current level and selecting the level from the questLevels array. The nextLevel method is used to increase the currentLevel counter. Moreover, this method is called once startButton is clicked from the menu. Therefore, it will increase the currentLevel counter at the beginning. This is why we set the initial value of currentLevel to -1. This will ensure that it selects the first level once the game starts that is at index 0 of the level array. We reset currentLevel in the startOver method once the game is over. On the other hand, we display the current level at the top of the game inside the #stage element. Therefore, we also update that wording every time the level is up.