Norsen
Norsen

Reputation: 1

I have a misunderstanding with localStorage

I'm currently beginning to learn how to use javascript, and I have a small problem. I'm making a minigame of 'find the random number', and I'm trying to implement a localStorage savestate that let me keep my game as it was when I closed it, but without success. Here's the part of my JS where I'm stuck.

let Rndm = Math.floor(Math.random() * 100) + 1;

var tentatives = document.querySelector('.tentatives');
var resultat = document.querySelector('.resultat');
var plusoumoins = document.querySelector('.plusoumoins');
var valider = document.querySelector('.valider');
var essai = document.querySelector('.essai');

var nmbrmax = 1000;
var nmbrtent = 1;

let j1 = document.getElementById("j1");
let j2 = document.getElementById("j2");
var joueur1 = document.getElementById("joueur1");
var joueur2 = document.getElementById("joueur2");
let nomsjoueurs = document.getElementById("nomsjoueurs");
let tour = document.getElementById("tour");

var playerTurn = 0;
const partiesauvee = []

function sauvegarder() {
    partiesauvee.push(tentatives.textContent);
    partiesauvee.push(resultat.textContent);
    partiesauvee.push(plusoumoins.textContent);
    partiesauvee.push(nmbrmax);
    partiesauvee.push(nmbrtent);
    partiesauvee.push(joueur1.value);
    partiesauvee.push(joueur2.value);
    
    localStorage.setItem('sauvegard', JSON.stringify(partiesauvee))
}

function refresh() {
    const partiesauvee = JSON.parse(localStorage.getItem('sauvegard'));
    var tentatives = JSON.parse(localStorage.getItem('sauvegard'));
    var resultat = JSON.parse(localStorage.getItem('sauvegard'));
    var plusoumoins = JSON.parse(localStorage.getItem('sauvegard'));

    var nmbrmax = localStorage.getItem('sauvegard');
    var nmbrtent = localStorage.getItem('sauvegard');

    var joueur1 = JSON.parse(localStorage.getItem('sauvegard'));
    var joueur2 = JSON.parse(localStorage.getItem('sauvegard'));
}

window.addEventListener('DOMContentLoaded', refresh);

When the sauvegarder function is activated, the console.log(localstorage) find all the values, but I can't find a way to return them to their places. Someone have an idea? Thanks !

Upvotes: 0

Views: 32

Answers (1)

Barmar
Barmar

Reputation: 780798

You're storing an array. You need to assign each array element to a different DOM element.

function refresh() {
  const storage = localStorage.getItem('sauvegard');
  if (!storage) { // nothing saved
    return;
  }
  const partiesauvee = JSON.parse(storage);
  tentatives.textContent = partiesauvee[0];
  resultat.textContent = partiesauvee[1];
  plusoumoins.textContent = partiesauvee[2];
  nmbrmax.textContent = partiesauvee[3];
  nmbrtent.textContent = partiesauvee[4];
  joueur1.textContent = partiesauvee[5];
  joueur2.textContent = partiesauvee[6];
}

Upvotes: 2

Related Questions