Помогите разобраться в коде [как организовать убывающий таймер на время посещения]

Вопрос-ответ JavaScript
1 
<style>
 #timer {
 font-size: 1em;
 align: center;
font-weight: bold;
 }
 #gbsbm {
 display: none;
 }
 </style>
 <div align="center" id="timer"></div>
<script>
 function checkTimer() {
 const timerElement = document.getElementById('timer');
 const startTimeStored = localStorage.getItem('startTime');
 const endTimeStored = localStorage.getItem('endTime');
 if (startTimeStored) { 
 //
 }
 else { 
 localStorage.setItem('startTime', Date.now());
 }
 document.addEventListener('visibilitychange', () => {
 if (document.visibilityState = 'hidden') {
 if (endTimeStored) { 
  }
 else { 
 localStorage.setItem('endTime', Date.now());
 }
  }
});

 let diffInSecs = endTimeStored - startTimeStored;
 let diffInDays = Math.round(diffInSecs / 60000);

 if (diffInDays < 30) {
 localStorage.setItem('endTime', Date.now());
 } else {
 localStorage.setItem('startTime', endTimeStored);
 localStorage.setItem('endTime', Date.now());
 }
timerElement.textContent = diffInDays

//localStorage.removeItem('endTime');
//localStorage.removeItem('startTime');
}
checkTimer();
 </script>

Код работает, но добавляет 1-2 минуты при обновлении страницы.
Идея кода: при первом заходе на сайт записать время входа. При выходе со страницы записать время выхода. При последующих заходах время входа перезаписывается на время последнего входа, а время выхода перезаписывается на текущую дату…

2

Извини, но я просто перешлю ответ от ИИ. Возможно тебе стоило бы найти какой-нить ИИ (LLM - large language model) инструмент типа DeepSeek, ChatGPT, Claude (Sonnet) и иже с ними чтобы пообщаться с ИИшкой по поводу своего кода. В коде много чего не так, что усложняет для тебя поиск ошибок.

–

Проблемы в коде:
Критичные (вызывают задержки):

  1. Присваивание вместо сравнения: if (document.visibilityState = ‘hidden’) - создает бесконечный цикл
  2. Неправильный порядок выполнения - вычисления происходят до обновления значений
  3. Логическая ошибка - endTimeStored может быть null при первом запуске

Другие проблемы:
4. Деление на 60000 даёт минуты, не дни
5. Логика с 30 днями не соответствует описанию

function checkTimer() {
    const timerElement = document.getElementById('timer');
    const now = Date.now();
    
    // При заходе обновляем время входа
    localStorage.setItem('startTime', now.toString());
    
    // Получаем предыдущее время выхода
    const endTimeStored = localStorage.getItem('endTime');
    const startTimeStored = localStorage.getItem('startTime');
    
    // Вычисляем разность только если есть время выхода
    if (endTimeStored && startTimeStored) {
        const diffInMs = parseInt(endTimeStored) - parseInt(startTimeStored);
        const diffInMinutes = Math.round(diffInMs / (1000 * 60));
        timerElement.textContent = diffInMinutes.toString();
    } else {
        timerElement.textContent = '0';
    }
    
    // При выходе обновляем время выхода
    document.addEventListener('visibilitychange', () => {
        if (document.visibilityState === 'hidden') { // Исправлено сравнение
            localStorage.setItem('endTime', Date.now().toString());
        }
    });
}

checkTimer();

Ключевые исправления:

  1. Исправлено === вместо =
  2. Упрощена логика - время входа всегда обновляется при загрузке
  3. Убрана сложная логика с 30 днями
  4. Правильный расчет времени

Задержка в 1-2 минуты была из-за присваивания в условии, которое могло вызывать блокировку.

3

Благодарю! Но я уже пошёл другим, более простым и лёгким путём. Просто отчитывать время посещения и записывать его в localStorage. И при следующем входе минусовать текущее время с записью в localStorage

1 лайк