es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Restablecer la variable localstorage en un momento específico

06 Aug, 2023 Programación

Cómo puedo reiniciar una variable localStorage que es un booleano y que realiza un seguimiento de si un usuario ha completado una acción ese día. Cuando llega la hora, por ejemplo, 8 a. m. hora local, se restablece el booleano a false para mostrar que la acción aún no se ha completado.

Si el usuario ha completado la acción ese día, la variable localStorage se establece en true y mostramos la cuenta regresiva hasta las 8 a. m..

Aquí están mis métodos que verifican la hora actual y el tiempo restante hasta las 8 a. m..

const setActionCompleted = () => {
    var hasCompleted = true;
    localStorage.setItem("action-completed-today", JSON.stringify(hasCompleted));
}

const twoDigits = (number) => {
    return (number < 10 ? '0' : '') + number;
}

const countDown = () => {
    var reset = new Date();
    var now = new Date();
    reset.setHours(8, 0, 0);
    if(now > reset){
        reset.setDate(reset.getDate() + 1);
    }

    var timeToReset = ((reset - now) / 1000);

    var hours = ~~(timeToReset / 60 / 60) % 60;
    var minutes = ~~(timeToReset / 60) % 60;
    var seconds = ~~timeToReset % 60;

    return `${twoDigits(hours)}:${twoDigits(minutes)}:${twoDigits(seconds)}`;
}

const intervalId = setInterval(() => {
  console.log(countDown());
}, 1000);

// clear interval after 10 seconds so its not running indefinitely
setTimeout(() => {clearInterval(intervalId)}, 10000);
Tags:  , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para restablecer la variable localStorage, podemos agregar una condición en la función countDown para ver si la hora actual es las 8 a. m. o posterior. Si lo es, restablecemos la variable a false. Aquí está la función countDown modificada:

    const countDown = () => {
    var reset = new Date();
    var now = new Date();
    reset.setHours(8, 0, 0);
    if(now > reset){
        reset.setDate(reset.getDate() + 1);
        localStorage.setItem("action-completed-today", JSON.stringify(false)); // restablecer la variable a false
    }

    var timeToReset = ((reset - now) / 1000);

    var hours = ~~(timeToReset / 60 / 60) % 60;
    var minutes = ~~(timeToReset / 60) % 60;
    var seconds = ~~timeToReset % 60;

    return `${twoDigits(hours)}:${twoDigits(minutes)}:${twoDigits(seconds)}`;
}

    La condición if(now > reset) compara la hora actual con las 8 a. m. del mismo día. Si la hora actual es posterior, establecemos la hora de restablecimiento en las 8 a. m. del día siguiente y también establecemos la variable localStorage en false usando localStorage.setItem("action-completed-today", JSON.stringify(false));. Esto asegura que la variable se restablezca a las 8 a. m. del día siguiente.

    Alternativamente, también podemos agregar otra condición antes de establecer la variable localStorage en true para ver si la hora actual es posterior a las 8 a. m. y restablecer la variable a false antes de establecerla en true. Esto asegura que la variable se restablezca siempre a las 8 a. m. todos los días, incluso si el usuario ha completado la acción tarde en el día.

    const setActionCompleted = () => {
    var reset = new Date();
    reset.setHours(8, 0, 0);
    var hasCompleted = true;
    if (new Date() > reset) {
        hasCompleted = false;
    }
    localStorage.setItem("action-completed-today", JSON.stringify(hasCompleted));
}

    Con esta modificación, la variable localStorage se restablecerá a false todos los días a las 8 a. m. y se establecerá en true si el usuario completa la acción, con la cuenta regresiva mostrada hasta el próximo restablecimiento a las 8 a. m.

Comments are closed.