2

Tengo un JSON que obtengo desde localStorage donde guardo los nombres de los jugadores y sus puntuaciones para un juego, despues los recibo en 2 variables separadas para poder modificar la puntuacion y aumentar su valor si el jugador gana. Lo que quiero hacer es que cuando el jugador gane elimine el elemento del JSON para despues volverlo a insertar con el valor de la puntuacion modificado y volverlo a guardar en localStorage.

Asi obtengo el JSON:

var Jugadores = localStorage.getItem("Jugadores");
Jugadores = JSON.parse(Jugadores);

Este JSON lo lleno en otro html donde se registran los jugadores y en la pagina de juego esto es lo que obtengo en consola:

 ["{"player":"leader","score":0}", 
  "{"player":"lel","score":0}", 
   "{"player":"lol","score":0}"]

Tambien en el html de jugadores guardo individualmente los valores de jugador y puntuacion para poderlos modificar y despues reemplazar el objeto anterior (esto tambien lo uso en un if por si el jugador aun no existe la puntuacion sea de 0 por defecto):

jugador =$('#txtplayer').val();
var player = jugador;
var score = 0;
localStorage.setItem("player",player);
localStorage.setItem("score",score);

Y asi los recibo en el html del juego:

var player = localStorage.getItem("player");
var score = localStorage.getItem("score");

De antemano muchas gracias.

3 respuestas 3

0

Por motivos de seguridad, Javascript del lado del cliente no puede acceder a ficheros del sistema.

La API Storage solo permite acceder o modificar pares de valores que almacena el propio navegador. Sí que puedes almacenar los datos de los jugadores, pero en el navegador, no en un fichero.

Para más información: https://developer.mozilla.org/es/docs/Web/API/Storage

Si es obligatorio que en tu proyecto exista un fichero JSON, necesitarás utilizar un lenguaje de programación del lado del servidor (PHP, NodeJS...).

3
  • De hecho no es que quiera acceder directamente a la informacion que tengo en localStorage. Primero la obtengo, luego la convierto a un arreglo y despues ya la manipulo para poder volverla a guardar en el localStorage. Tengo algo parecido en otro proyecto y funciona: $(document).on('click','#btnBorrar',function(){ fila_borrar = parseInt($(this).attr("alt")); MiAgenda.splice(fila_borrar, 1); localStorage.setItem("MiAgenda", JSON.stringify(MiAgenda)); alert("CONTACTO ELIMINADO"); MostrarAgenda(); //mostramos los contactos }) el 9 jun. 2018 a las 16:29
  • Solo que necesito encontrar la forma de poder obtener la posicion de, digamos, donde esta guardado el nombre del jugador en el arreglo para eliminarlo y despues volver a guardarlo en el localStorage el 9 jun. 2018 a las 16:31
  • En este proyecto jsfiddle.net/c7zsy8uo el boton de borrar hace lo que quiero hacer en el juego pero usando el indice del registro, pero lo que hace el boton de borrar lo necesito hacer obteniendo la posicion de acuerdo al nombre del jugador el 9 jun. 2018 a las 16:49
0

Lo que yo haría sería lo siguiente. El script no puedes ejecutarlo aquí porque no deja jugar con el localstorage.

Un saludo, espero que te sea útil

function addUser() {
  const userFromStorage = localStorage.getItem('players');
   // Si tengo jugadores los convierto en un array si no creo uno
  const USERS = userFromStorage ? JSON.parse(userFromStorage) : [] ;

  const user = document.getElementById('user_name');

  if(user && user.value) {
    
    const userExist = USERS.find( user => {
      return user.player === user.value;
    });
    // si el usuario no existe lo añado al array
    if(!userExist) {
      USERS.push({player:user.value,score:0 });
    }
    
    localStorage.setItem('players', JSON.stringify(USERS));
  } else {
    console.error('El jugador ya existe, escoja otro nombre');
  }

}


function updateScore(user, score) {
  const userFromStorage = localStorage.getItem('players');
  // Si tengo jugadores los convierto en un array si no creo uno
  const USERS = userFromStorage ? JSON.parse(userFromStorage) : [] ;
  if(USERS.length > 0){
    const userIndex = USERS.findIndex(
      u => {
       return u.player === user
      }
    );
    if (userIndex !== -1) {
      USERS[userIndex].score = score;
      // Añade el array al localstorage
      localStorage.setItem('players', JSON.stringify(USERS));
    } else {
      console.error(`El usuario ${user} no existe en el array`);
    }
  } else{
    console.error('no hay jugadores');
  }
} 

function updateUser() {
  const user = document.getElementById('user_name_update');
  const score = document.getElementById('user_score_update');
  updateScore(user.value, score.value);

}
<input type="text" id="user_name">

<button id="addUser" onclick="addUser()">Añadir usuario</button>
<hr>

<input type="text" id="user_name_update">
<input type="number" id="user_score_update">

<button id="updateUser" onclick="updateUser()">Modificar score del usuario</button>

0

Yo estoy con una aplicación que también modifica un JSON

En mi caso si modifico el archivo en el file system y lo que hago es reescribir todo el archivo después de modificar el valor que quiero.


//el archivo JSON lo convierto a un array y lo guardo en la variable series
var series;

//funcion que lee mi archivo JSON
function loadData(){
    let data = JSON.parse(fs.readFileSync(path.resolve('data','series.json'),'utf8' ,(err,data) => {
        if (err){console.error(err); return;}
        return data;
    }));
    series = data.series;
}

//Cuando guardo los cambios se dispara la función save que recibe como párametro el id
//de la serie
function save(index) {
    //Modifico los datos directamente en el array
    series[index] = {
        titulo: `${document.getElementById('titulo').value}`,
        descripcion: `${document.getElementById('descripcion').value}`,
        fecha_emision: `${document.getElementById('fecha_emision').value}`,
        imagen: `${document.getElementById('imagen').getAttribute('src')}`
    };
    
    //creo una variable con un objeto que tiene la estructura del archvo JSON
    let jsonData = {series : series};

    //con la clase fs sobreescribo el archivo ya con los cambios hechos
    fs.writeFileSync(path.resolve('data','series.json'), JSON.stringify(jsonData), (err) => {
        if (err) throw err;
    });
    //metodo para cerrar un modal en materialize css
    instances.close();
    //mando llamar mi fucnion load que es la que vuelve a llenar mis variables globales
    //como la variable series
    loadData();
}

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.