diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 6ca81cd3b..f3f597492 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -23,3 +23,53 @@ function pauseAlarm() { } window.onload = setup; + +const timeRemainingElement = document.querySelector("#timeRemaining"); +const alarmSetElement = document.querySelector("#alarmSet"); +const setButtonElement = document.querySelector("#set"); +const stopButtonElement = document.querySelector("#stop"); +const bodyElement = document.querySelector("body"); +const alarmSoundElement = document.querySelector("#alarmSound"); + +let remainingTime; +let intervalID; +function triggerAlarm() { + bodyElement.style.backgroundColor = "yellow"; + alarmSoundElement.play(); +} +function setAlarm() { + clearInterval(intervalID); + const alarmTime = alarmSetElement.value; + remainingTime = Number(alarmTime); + const showTimeMinutes = Math.floor(remainingTime / 60) + .toString() + .padStart(2, "0"); + const showTimeSeconds = (remainingTime % 60).toString().padStart(2, "0"); + timeRemainingElement.innerText = showTimeMinutes + ":" + showTimeSeconds; + if (remainingTime === 0) { + triggerAlarm(); + } else { + intervalID = setInterval(countDown, 1000); + } +} +setButtonElement.addEventListener("click", setAlarm); +function countDown() { + if (remainingTime <= 0) { + clearInterval(intervalID); + triggerAlarm(); + return; + } + remainingTime -= 1; + const remainingMinutes = Math.floor(remainingTime / 60) + .toString() + .padStart(2, "0"); + const remainingSeconds = (remainingTime % 60).toString().padStart(2, "0"); + timeRemainingElement.innerText = remainingMinutes + ":" + remainingSeconds; +} +function stopAlarm() { + clearInterval(intervalID); + alarmSoundElement.pause(); + alarmSoundElement.currentTime = 0; + bodyElement.style.backgroundColor = ""; +} +stopButtonElement.addEventListener("click", stopAlarm); diff --git a/Sprint-3/alarmclock/index.html b/Sprint-3/alarmclock/index.html index 48e2e80d9..2a45c65b1 100644 --- a/Sprint-3/alarmclock/index.html +++ b/Sprint-3/alarmclock/index.html @@ -4,13 +4,14 @@ - Title here + Alarm clock app

Time Remaining: 00:00

+