From bb748b48c68dfdf49f36c4fd75bf62236c1f7632 Mon Sep 17 00:00:00 2001 From: mervereis Date: Wed, 18 Mar 2026 12:58:59 +0000 Subject: [PATCH 1/2] setAlarm function updated & clock app created --- Sprint-3/alarmclock/alarmclock.js | 37 ++++++++++++++++++++++++++++++- Sprint-3/alarmclock/index.html | 37 +++++++++++++++++-------------- 2 files changed, 56 insertions(+), 18 deletions(-) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 6ca81cd3b..be1db5206 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -1,4 +1,39 @@ -function setAlarm() {} +// Turns a number of seconds into "MM:SS" format +// e.g. 75 -> "01:15" +function formatTime(seconds) { + const minutes = Math.floor(seconds / 60); + const remainingSeconds = seconds % 60; + + // padStart makes sure single digits get a leading zero e.g. 5 -> "05" + const mm = String(minutes).padStart(2, "0"); + const ss = String(remainingSeconds).padStart(2, "0"); + + return mm + ":" + ss; +} + +function setAlarm() { + // Get the number the user typed in the input field + let seconds = Number(document.getElementById("alarmSet").value); + + // Update the heading to show the starting time + document.getElementById("timeRemaining").innerText = + "Time Remaining: " + formatTime(seconds); + + // Count down every 1000ms (1 second) + let intervalId = setInterval(function () { + seconds = seconds - 1; + + // Update the heading each second + document.getElementById("timeRemaining").innerText = + "Time Remaining: " + formatTime(seconds); + + // When we reach zero, stop counting and play the alarm + if (seconds === 0) { + clearInterval(intervalId); + playAlarm(); + } + }, 1000); +} // DO NOT EDIT BELOW HERE diff --git a/Sprint-3/alarmclock/index.html b/Sprint-3/alarmclock/index.html index 48e2e80d9..328e06582 100644 --- a/Sprint-3/alarmclock/index.html +++ b/Sprint-3/alarmclock/index.html @@ -1,20 +1,23 @@ - - - - - Title here - - -
-

Time Remaining: 00:00

- - - - -
- - - + + + + + Alarm Clock App + + + +
+

Time Remaining: 00:00

+ + + + + +
+ + + + \ No newline at end of file From 6393e220f78c1feaae89bf00aa35fa11772fd296 Mon Sep 17 00:00:00 2001 From: mervereis Date: Tue, 24 Mar 2026 20:58:39 +0000 Subject: [PATCH 2/2] Improve timer validation, prevent multiple intervals, and reuse DOM element --- Sprint-3/alarmclock/alarmclock.js | 40 +++++++++++++++++++++---------- 1 file changed, 28 insertions(+), 12 deletions(-) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index be1db5206..927dfefd1 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -1,10 +1,16 @@ +let timeRemainingEl = null; + +// Keep track of active timer +let intervalId = null; + // Turns a number of seconds into "MM:SS" format -// e.g. 75 -> "01:15" function formatTime(seconds) { + if (isNaN(seconds) || seconds < 0) { + return "00:00"; + } const minutes = Math.floor(seconds / 60); const remainingSeconds = seconds % 60; - // padStart makes sure single digits get a leading zero e.g. 5 -> "05" const mm = String(minutes).padStart(2, "0"); const ss = String(remainingSeconds).padStart(2, "0"); @@ -12,24 +18,34 @@ function formatTime(seconds) { } function setAlarm() { - // Get the number the user typed in the input field let seconds = Number(document.getElementById("alarmSet").value); - // Update the heading to show the starting time - document.getElementById("timeRemaining").innerText = - "Time Remaining: " + formatTime(seconds); + // Validation + if (isNaN(seconds) || seconds <= 0) { + alert("Please enter a valid positive number of seconds."); + return; + } + + seconds = Math.floor(seconds); + + if (!timeRemainingEl) { + timeRemainingEl = document.getElementById("timeRemaining"); + } + + if (intervalId !== null) { + clearInterval(intervalId); + } + + timeRemainingEl.innerText = "Time Remaining: " + formatTime(seconds); - // Count down every 1000ms (1 second) - let intervalId = setInterval(function () { + intervalId = setInterval(function () { seconds = seconds - 1; - // Update the heading each second - document.getElementById("timeRemaining").innerText = - "Time Remaining: " + formatTime(seconds); + timeRemainingEl.innerText = "Time Remaining: " + formatTime(seconds); - // When we reach zero, stop counting and play the alarm if (seconds === 0) { clearInterval(intervalId); + intervalId = null; playAlarm(); } }, 1000);