HTML5 offre l'oggetto localStorage, che manterrà le informazioni in modo permanente, se non per cancellazione manuale da parte dell'utente.
Possiamo considerare l'oggetto localStorage alla stregua di un array associativo, pertanto possiamo impostare o ottenere valori semplicemente così:
localStorage["test"] = "Ciao!";quindi possiamo scrivere:
//output in console: Ciao!
console.log(localStorage["test"]);Ogni valore salvato in localStorage viene convertito in stringa, possiamo quindi salvare valori numerici, oggetti o funzioni, utilizzando JSON.
>> Leggi gli approfondimenti su webStorage
Utilizzeremo localStorage per salvare il livello a cui siamo arrivati, inseriamo quindi nell'oggetto Portal, prima della chiamata alla funzione LoadLevel, questo codice:
//ultimo livello completato
localStorage["lastLevel"] = this.level+1;Nell'oggetto MainMenu di hud.js, al click dell'opzione NewGame, rimpiazziamo this.LoadLevel(1) col seguente codice:
//VAI ALL'ULTIMO LIVELLO COMPLETATO
this.LoadLevel(parseInt(localStorage["lastLevel"]));Per cancellare i tutti i dati dal localStorage, sarà sufficiente scrivere:
localStorage.clear();Come esercizio potete espandere il menu principale, aggiungendo una selezione livelli che sfrutta il localStorage, come mostrato nel gioco esempio.
Come al solito, le risorse grafiche sono disponibili in allegato o su github.