document.addEventListener('DOMContentLoaded', function() { // DOM Elements const timerDisplay = document.getElementById('timer-display'); const startBtn = document.getElementById('start-btn'); const pauseBtn = document.getElementById('pause-btn'); const resetBtn = document.getElementById('reset-btn'); const hoursInput = document.getElementById('hours-input'); const minutesInput = document.getElementById('minutes-input'); const secondsInput = document.getElementById('seconds-input'); const alarmSelect = document.getElementById('alarm-select'); const volumeControl = document.getElementById('volume-control'); const testAlarmBtn = document.getElementById('test-alarm'); const alarmSound = document.getElementById('alarm-sound'); const themeToggle = document.getElementById('theme-toggle'); // Timer variables let timer; let totalSeconds = 0; let remainingSeconds = 0; let isRunning = false; // Theme toggle themeToggle.addEventListener('click', () => { document.documentElement.classList.toggle('dark'); feather.replace(); }); // Initialize timer display updateTimerDisplay(0); // Start button click handler startBtn.addEventListener('click', () => { if (!isRunning) { if (remainingSeconds === 0) { const hours = parseInt(hoursInput.value) || 0; const minutes = parseInt(minutesInput.value) || 0; const seconds = parseInt(secondsInput.value) || 0; totalSeconds = (hours * 3600) + (minutes * 60) + seconds; remainingSeconds = totalSeconds; } if (remainingSeconds > 0) { isRunning = true; startBtn.disabled = true; pauseBtn.disabled = false; toggleInputs(true); timer = setInterval(() => { remainingSeconds--; updateTimerDisplay(remainingSeconds); if (remainingSeconds <= 0) { clearInterval(timer); isRunning = false; startBtn.disabled = false; pauseBtn.disabled = true; playAlarm(); } }, 1000); } } }); // Pause button click handler pauseBtn.addEventListener('click', () => { if (isRunning) { clearInterval(timer); isRunning = false; startBtn.disabled = false; pauseBtn.disabled = true; } }); // Reset button click handler resetBtn.addEventListener('click', () => { clearInterval(timer); isRunning = false; remainingSeconds = 0; updateTimerDisplay(0); startBtn.disabled = false; pauseBtn.disabled = true; toggleInputs(false); }); // Test alarm button click handler testAlarmBtn.addEventListener('click', () => { playAlarm(); }); // Volume control change handler volumeControl.addEventListener('input', () => { alarmSound.volume = volumeControl.value; }); // Update timer display function updateTimerDisplay(seconds) { const hours = Math.floor(seconds / 3600); const minutes = Math.floor((seconds % 3600) / 60); const secs = seconds % 60; timerDisplay.textContent = `${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}:${String(secs).padStart(2, '0')}`; } // Play alarm sound function playAlarm() { const soundFile = { 'beep': 'https://assets.mixkit.co/sfx/preview/mixkit-alarm-digital-clock-beep-989.mp3', 'bell': 'https://assets.mixkit.co/sfx/preview/mixkit-digital-clock-digital-alarm-buzzer-992.mp3', 'digital': 'https://assets.mixkit.co/sfx/preview/mixkit-simple-digital-clock-alarm-995.mp3' }[alarmSelect.value]; alarmSound.src = soundFile; alarmSound.volume = volumeControl.value; alarmSound.play(); } // Toggle input fields disabled state function toggleInputs(disabled) { hoursInput.disabled = disabled; minutesInput.disabled = disabled; secondsInput.disabled = disabled; } // Input validation function validateInput(input, max) { if (input.value > max) { input.value = max; } else if (input.value < 0) { input.value = 0; } } hoursInput.addEventListener('change', () => validateInput(hoursInput, 23)); minutesInput.addEventListener('change', () => validateInput(minutesInput, 59)); secondsInput.addEventListener('change', () => validateInput(secondsInput, 59)); });