Create a High Score in Phaser

Question

This is my first time creating a game via a tutorial which I've coded along with so I am a completely new at this but I am eager to learn.

I've this game "Bunny Defender" and want to create a simple High Score which I can store in some kind of localstorage with XML and display the high score result out on the screen when the game is over. 

I don't know how to do this and where to start. Would be very thankful if someone could point me at the right direction and how to manage this?

// All the game files on github https://github.com/eiffelqiu/bunny-defender

Answer 1

var score =0;
var highscore =0;
var highScoreText;
var scoreText;

//////////////////////////////////////Under the create put

 highScoreText = this.game.add.text(600, 40, 'HS: ' + highscore, {
        font: '25px Arial',
        fill: 'black'
    });


this.score = 0;
    this.labelScore = game.add.text(20, 20, "0", 
    { font: "30px Arial", fill: "black" });

/////////////////////////////////////////////////////////////// //then this in update function

highScoreText.text = 'HS: ' + localStorage.getItem("highscore");
  {
     if (this.score > localStorage.getItem("highscore")) 
        { 
            localStorage.setItem("highscore", this.score);
        }
    }

//////////////////////////////////////////

//Then this part where ever you want to be counting so more than likely you want to put it in the kill bunny function or the where ever you count the points when they are surviving.

this.score += 1;
this.labelScore.text = this.score;  

///////////////////////////and BOOOOOOOOM working high-score

Answer 2

Why would you need XML? Stuff is stored inside localStorage as key-value pairs, so in the general case this would be enough to set it:

var highScore = 100; // you would've set this earlier, of course
localStorage.setItem("bunnyDefenderHighScore", highScore); // game-specific key in case you later run another game on the same domain

... and this - to retrieve it:

var highScoreToDisplay = 0;
if (localStorage.getItem("bunnyDefenderHighScore") !== null) {
    highScoreToDisplay = parseInt(localStorage.getItem("bunnyDefenderHighScore"));
}

Then, whenever you want to display it, do

var gameOverText = this.game.add.text(100, 100, highScoreToDisplay.toString(), {font: "20pt Arial", fill: "#FFFFFF"});