HTML and CSS Reference
In-Depth Information
2. Add the saving funcion to the icker so that it can autosave:
cjs.Ticker.addEventListener('tick', game.autoSave);
3. Now, we can load the saved game using the following code:
if (localStorage['city.buildinglist']) {
game.buildingsList = JSON.parse(localStorage['city.
buildinglist']);
} else {
game.buildingsList = [];
}
4. When we iniialize coins and diamonds, we load the values from the local storage:
game.coins = localStorage['city.coins']*1 || 10; // *1 to force
converting string to number
game.diamonds = localStorage['city.diamonds']*1 || 0;
Now, try to play the game in a browser with the latest code loaded. Place some buildings
in the city and close the browser. Reopening the game will load the buildings. The game
coninues from where it stopped the last ime. Try to create another building and leave the
game once it starts the irst step of construcion. Then come back to the game 30 seconds
later and you will see that your building construcion is now complete.
Objective complete - mini debriefing
We have saved and loaded our game. When we saved the building list locally, we saved the
staring ime of the construcion as well. Ater the game has been closed for a while and the
player reopens the game, we load the building list and the city redraw method will calculate to
see whether the building was 100 percent constructed during the ime the game was oline.
Using local storage
Local storage allows a website to store data persistently in the browser. It uilizes very
simple key-value access. LocalStorage uses only string type for both keys and values.
The following is the syntax to save, load, and remove the stored items.
// save a string.
localStorage.setItem(key, value);
// load a string.
localStorage.getItem(key);
// remove an item.
localStorage.removeItem(key);
 
Search WWH ::




Custom Search