Local storage value for different builds

Hi , I am using Local Storage of the browser to keep track of highest score. But it seems if I generate a build lets say Build -Link-1 and score highest score as 10 . browser will store highestScore key with value 10. And If I generate another build say Build-Link-2 . Even though we don’t score any points it shows highest score as 10 of the previous build link since it stores in origin as https://playcanv.as . I feel its strange and want to have highest score for particular build as well.
code which I used is below

var GameScoreManager = pc.createScript('gameScoreManager');

GameScoreManager.attributes.add('scoreEntity', { type: 'entity' });

GameScoreManager.prototype.initialize = function () {
    this.scoreCount = 0;
    this.highestScore = 0;
    this.scoreElement = this.scoreEntity.element;
    this.app.on("update-score", this.updateScore, this);
    if (!localStorage.getItem("highestScore")) {
        localStorage.setItem("highestScore", this.highestScore);
        console.log('Highest score set successfully ')
    }
    this.highestScore = parseInt(localStorage.getItem("highestScore"));

    this.once('destroy', () => {
        this.app.off("update-score", this.updateScore, this);
    });
};

GameScoreManager.prototype.updateScore = function () {
    this.scoreCount++;
    if (this.scoreCount > this.highestScore) {
        this.highestScore = this.scoreCount;
        localStorage.setItem("highestScore", this.highestScore)
    }
    this.scoreElement.text = this.scoreCount.toString();
    this.app.fire("score-updated", this.scoreCount);
};

GameScoreManager.prototype.getCurrentScore = function () {
    return this.scoreCount;
}

if you want to store highestScore for each build separately, you might use the build url as a postfix for the key name

  1. Extract the build postfix (htts://playcanv.as/b/a8dfc8f7) using window.location.href
  2. When reading/writing to localStorage, add it to the highestScore (eg: highestScore_a8dfc8f7)

Then, every build will have its own highestScore

2 Likes

Yes I did same approach now. I thought of any other way to do the same.

 this.buildID = window.location.pathname.split("/").filter(Boolean).pop();
    if (!localStorage.getItem(`Galaxy-Space-Shooter-highestScore:${this.buildID}`)) {
        localStorage.setItem(`Galaxy-Space-Shooter-highestScore:${this.buildID}`, this.highestScore);
        console.log('Highest score set successfully ')
    }

Here is a better approach I came up with
This is a separate logic, and easily extendable
Did not test though, just an idea

class Storage {
    initialize() {
        // try get the storage by build url
        const storageString = localStorage.getItem(window.location.href);

        if (storageString) {
            // parse build storage
            this._storage = JSON.parse(storageString);
        } else {
            // setup build storage
            this._storage = {
                highestScore: 0,
            }
            localStorage.setItem(window.location.href, JSON.stringify(this._storage));
        }
    }    
    
    setItem(key, value) {
       this._storage[key] = value;
       localStorage.setItem(window.location.href, JSON.stringify(this._storage));
    }
    
    getItem(key) {
        return this._storage[key]
    }
}

It seems like this code stores entire URL as key in local storage.

yep, so that every build has its own storage
you could use a postfix as before, if it matters to you

1 Like