LocalStorage in phaser

[Horizonicblue]

Hi,

 

How to display best score in game using local storage?

or is there any other better way I can do this with Phaser?

If possible give a example code. 

 

I used method from this tutorial

http://www.codevinsky.com/phaser-2-0-tutorial-flappy-bird-part-5/

but it give error: Localstorage is undefined

 

Thanks

[shohan4556]

// declare globally

var score = 0;

// increment your score

// game hero hit by something that kill him

function gameOver(){

if(localStorage.getItem('highscore') === null){

localStorage.setItem('highscore',score);

}

else if(score > localStorage.getItem('highscore')){

localStorage.setItem('highscore',score);

}

}

[tips4design]

Note that you have to do something like:

var highScore = localStorage.getItem('highscore');if(highScore  === null) { // If there is no highScore (game is started for the first time on this device)    localStorage.setItem('highscore', 0);    highScore = 0;}

So that when the game loads you also load the high score. If you do exactly how shonan exemplified, then each time you launch the game the high score will reset to 0, which then makes the use of localStorage useless.

 

Also, instead of declaring them globally I recommend adding them either to your game object or to a custom namespace so you don't pollute the global namespace.

 

Something like:

// On game load or initgame.score = 0;game.highScore = localStorage.getItem('highscore');if(game.highScore  === null) {    localStorage.setItem('highscore', 0);    game.highScore = 0;}

[MichaelD]

or create a function in order to not pollute the global space

var score = score || {};score = { saveScore: function(amount){ window.localstorage.setItem("game-score",amount);},getScore: function(){ var result = window.localstorage.getItem("game-score"); if(result === "null" || result === "undefined") {   localStorage.setItem("game-score", 0);   result = window.localstorage.getItem("game-score"); } return result;}};// call it like thisscore.saveScore(10);window.console.log("THE SCORE IS: ",score.getScore());

[tips4design]

 

or create a function in order to not pollute the global space

 var result = window.localstorage.getItem("game-score"); if(result === null || result === undefined) {

 

I don't think result can ever be undefined. If the key does not exist, than it will be null as per localStorage.getItem specs. If the key exist and for some reason undefined is stored there, then it will be stored as a String, as every data stored in localStorage is a String.  Thus result will be equal to 'undefined' and undefined == 'undefined' returns false.

[MichaelD]

Thanks I edited my answer 

[shohan4556]

 

Note that you have to do something like:

var highScore = localStorage.getItem('highscore');if(highScore  === null) { // If there is no highScore (game is started for the first time on this device)    localStorage.setItem('highscore', 0);    highScore = 0;}

So that when the game loads you also load the high score. If you do exactly how shonan exemplified, then each time you launch the game the high score will reset to 0, which then makes the use of localStorage useless.

 

Also, instead of declaring them globally I recommend adding them either to your game object or to a custom namespace so you don't pollute the global namespace.

 

Something like:

// On game load or initgame.score = 0;game.highScore = localStorage.getItem('highscore');if(game.highScore  === null) {    localStorage.setItem('highscore', 0);    game.highScore = 0;}

if I follow your way is the score will be preserved if I reload my game ? 

[tips4design]

 

 

if I follow your way is the score will be preserved if I reload my game ? 

 

Yes, that's the whole point of localStorage: it's persistent. It makes no sense to use localStorage if you only use it as an Object which gets reset when the app loads.

[Horizonicblue]

Hey,Thanks everyone for the replies,

All your replies helped me to successfully implement the high score storage for the game.