From eb0ec17aa9030b27779370fe0e3daafef75e7e48 Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 21:05:32 +0100 Subject: [PATCH 01/20] updated the Title of alarm clock template file --- Sprint-3/alarmclock/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Sprint-3/alarmclock/index.html b/Sprint-3/alarmclock/index.html index 48e2e80d9..74c068df2 100644 --- a/Sprint-3/alarmclock/index.html +++ b/Sprint-3/alarmclock/index.html @@ -4,7 +4,7 @@ - Title here + "Alarm clock app"
From b45f3d21c6753138079fcb7f990c7f43dedc846a Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 21:15:33 +0100 Subject: [PATCH 02/20] Created a global varible to hold remaining time and the interval id --- Sprint-3/alarmclock/alarmclock.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 6ca81cd3b..e987e572a 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -1,3 +1,6 @@ +let timeRemaining = 0; +let intervalId = null; + function setAlarm() {} // DO NOT EDIT BELOW HERE From 4e3b1d2eb65349f99c7df080405c0806a176ab13 Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 21:19:06 +0100 Subject: [PATCH 03/20] implement a function that set the alarm --- Sprint-3/alarmclock/alarmclock.js | 29 ++++++++++++++++++++++++++++- 1 file changed, 28 insertions(+), 1 deletion(-) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index e987e572a..38ccf432f 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -1,7 +1,34 @@ let timeRemaining = 0; let intervalId = null; -function setAlarm() {} +function setAlarm() { + const input = document.getElementById("alarm-input"); + const seconds = Number(input.value); + + if (isNaN(seconds) || seconds <= 0) { + alert("Please enter a valid number of seconds."); + return; + } + + timeRemaining = seconds; + updateDisplay(timeRemaining); + + // Clear any previous countdown + if (intervalId) { + clearInterval(intervalId); + } + + // Start a new countdown + intervalId = setInterval(() => { + timeRemaining--; + updateDisplay(timeRemaining); + + if (timeRemaining <= 0) { + clearInterval(intervalId); + playAlarm(); + } + }, 1000); +} // DO NOT EDIT BELOW HERE From 51dfb2ead6edb50205b40f1db2c0bc61d3fa67c6 Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 21:20:48 +0100 Subject: [PATCH 04/20] Implements function to display updates on the page --- Sprint-3/alarmclock/alarmclock.js | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 38ccf432f..9c912d5ab 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -30,6 +30,16 @@ function setAlarm() { }, 1000); } +function updateDisplay(seconds) { + const title = document.getElementById("time-remaining"); + + const mins = String(Math.floor(seconds / 60)).padStart(2, "0"); + const secs = String(seconds % 60).padStart(2, "0"); + + title.textContent = `Time Remaining: ${mins}:${secs}`; +} + + // DO NOT EDIT BELOW HERE var audio = new Audio("alarmsound.mp3"); From 55ab31286611593cac40120d177d27c000c645b2 Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 21:23:50 +0100 Subject: [PATCH 05/20] Implement a function that stops the alarm --- Sprint-3/alarmclock/alarmclock.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 9c912d5ab..56b3fc862 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -39,6 +39,12 @@ function updateDisplay(seconds) { title.textContent = `Time Remaining: ${mins}:${secs}`; } +function stopAlarm() { + clearInterval(intervalId); + intervalId = null; + pauseAlarm(); // or stopAlarmSound() depending on your starter code +} + // DO NOT EDIT BELOW HERE From e418ebc69fa2db05531229d499c144eb0c91aa5c Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 21:25:37 +0100 Subject: [PATCH 06/20] set alarm button and add event listener --- Sprint-3/alarmclock/alarmclock.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 56b3fc862..84afa3880 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -45,6 +45,9 @@ function stopAlarm() { pauseAlarm(); // or stopAlarmSound() depending on your starter code } +const setAlarmButton = document.getElementById("set-alarm"); +setAlarmButton.addEventListener("click", setAlarm); + // DO NOT EDIT BELOW HERE From 6a0c87e9e253b986348f8e7696b76c259c659918 Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 21:26:37 +0100 Subject: [PATCH 07/20] add stop alarm button and add event listener --- Sprint-3/alarmclock/alarmclock.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 84afa3880..3eebb5573 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -48,6 +48,10 @@ function stopAlarm() { const setAlarmButton = document.getElementById("set-alarm"); setAlarmButton.addEventListener("click", setAlarm); +const stopAlarmButton = document.getElementById("stop-alarm"); +stopAlarmButton.addEventListener("click", stopAlarm); + + // DO NOT EDIT BELOW HERE From 7b7a44a28e207d1316514a3883a66bb598b8b9a4 Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 21:44:41 +0100 Subject: [PATCH 08/20] updated the wrong name variable in the input variable and Title variable --- Sprint-3/alarmclock/alarmclock.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 3eebb5573..5c727b4b0 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -2,7 +2,8 @@ let timeRemaining = 0; let intervalId = null; function setAlarm() { - const input = document.getElementById("alarm-input"); + const input = document.getElementById("alarmSet"); + const seconds = Number(input.value); if (isNaN(seconds) || seconds <= 0) { @@ -31,7 +32,8 @@ function setAlarm() { } function updateDisplay(seconds) { - const title = document.getElementById("time-remaining"); + const title = document.getElementById("timeRemaining"); + const mins = String(Math.floor(seconds / 60)).padStart(2, "0"); const secs = String(seconds % 60).padStart(2, "0"); From 84985a923a81862d035e0fc26e29a604c1126af2 Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 21:48:07 +0100 Subject: [PATCH 09/20] removed the broken event listeners --- Sprint-3/alarmclock/alarmclock.js | 5 ----- 1 file changed, 5 deletions(-) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 5c727b4b0..2ca3565a4 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -47,11 +47,6 @@ function stopAlarm() { pauseAlarm(); // or stopAlarmSound() depending on your starter code } -const setAlarmButton = document.getElementById("set-alarm"); -setAlarmButton.addEventListener("click", setAlarm); - -const stopAlarmButton = document.getElementById("stop-alarm"); -stopAlarmButton.addEventListener("click", stopAlarm); From dfa54e5df7e5b4398efd173c798754815b6e6aa5 Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 22:02:17 +0100 Subject: [PATCH 10/20] Add Node to interact with the styling document --- Sprint-3/alarmclock/alarmclock.js | 3 ++- Sprint-3/alarmclock/style.css | 8 ++++++++ 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 2ca3565a4..780dc527e 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -44,8 +44,9 @@ function updateDisplay(seconds) { function stopAlarm() { clearInterval(intervalId); intervalId = null; - pauseAlarm(); // or stopAlarmSound() depending on your starter code + pauseAlarm(); } +document.body.classList.add("flash"); diff --git a/Sprint-3/alarmclock/style.css b/Sprint-3/alarmclock/style.css index 0c72de38b..accde4414 100644 --- a/Sprint-3/alarmclock/style.css +++ b/Sprint-3/alarmclock/style.css @@ -13,3 +13,11 @@ h1 { text-align: center; } +.flash { + animation: flash-bg 1s infinite alternate; +} + +@keyframes flash-bg { + from { background-color: white; } + to { background-color: red; } +} From 62088765c6a7a8e5335cdbc73326aa2f067a1dfe Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 22:04:57 +0100 Subject: [PATCH 11/20] declate a booleen varaible an set to false --- Sprint-3/alarmclock/alarmclock.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 780dc527e..07cc401b2 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -48,6 +48,9 @@ function stopAlarm() { } document.body.classList.add("flash"); +let isPaused = false; + + From 7e0857745d1708cd8ea391eef2561b9d13f6b889 Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 22:06:06 +0100 Subject: [PATCH 12/20] add a pause button element in the template --- Sprint-3/alarmclock/index.html | 2 ++ 1 file changed, 2 insertions(+) diff --git a/Sprint-3/alarmclock/index.html b/Sprint-3/alarmclock/index.html index 74c068df2..8da2c0a09 100644 --- a/Sprint-3/alarmclock/index.html +++ b/Sprint-3/alarmclock/index.html @@ -14,6 +14,8 @@

Time Remaining: 00:00

+ +
From d4458e2393ee5734e3c575770a787f448fd3e431 Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 22:38:13 +0100 Subject: [PATCH 13/20] deleted broken functions and updated Id pause name --- Sprint-3/alarmclock/alarmclock.js | 11 ----------- Sprint-3/alarmclock/index.html | 2 +- 2 files changed, 1 insertion(+), 12 deletions(-) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 07cc401b2..636ecd0f9 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -41,17 +41,6 @@ function updateDisplay(seconds) { title.textContent = `Time Remaining: ${mins}:${secs}`; } -function stopAlarm() { - clearInterval(intervalId); - intervalId = null; - pauseAlarm(); -} -document.body.classList.add("flash"); - -let isPaused = false; - - - // DO NOT EDIT BELOW HERE diff --git a/Sprint-3/alarmclock/index.html b/Sprint-3/alarmclock/index.html index 8da2c0a09..215a03c23 100644 --- a/Sprint-3/alarmclock/index.html +++ b/Sprint-3/alarmclock/index.html @@ -14,7 +14,7 @@

Time Remaining: 00:00

- + From 4c8eeb964cf8aecbef599055ed914c2721ebfa3c Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 22:39:37 +0100 Subject: [PATCH 14/20] added into the set alarm function A note for flashing --- Sprint-3/alarmclock/alarmclock.js | 1 + 1 file changed, 1 insertion(+) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 636ecd0f9..67e71d81f 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -27,6 +27,7 @@ function setAlarm() { if (timeRemaining <= 0) { clearInterval(intervalId); playAlarm(); + document.body.classList.add("flash"); } }, 1000); } From 67ca5df982ad37427da0bdb703f8a98924159181 Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 22:45:14 +0100 Subject: [PATCH 15/20] Add event listener to stop the flash --- Sprint-3/alarmclock/alarmclock.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 67e71d81f..41bb84e70 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -42,6 +42,9 @@ function updateDisplay(seconds) { title.textContent = `Time Remaining: ${mins}:${secs}`; } +document.getElementById("stop").addEventListener("click", () => { + document.body.classList.remove("flash"); +}); // DO NOT EDIT BELOW HERE From 0496416d7fac33368f233df0b0ed0d19be47cf05 Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 22:47:41 +0100 Subject: [PATCH 16/20] created a global variable to toggle pause an set it to false --- Sprint-3/alarmclock/alarmclock.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 41bb84e70..70dfd4a38 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -1,5 +1,7 @@ let timeRemaining = 0; let intervalId = null; +let isPaused = false; + function setAlarm() { const input = document.getElementById("alarmSet"); From b2b76381db05e99915ce30e9b7820f31512448d9 Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 22:51:48 +0100 Subject: [PATCH 17/20] created a function to toggle and pause --- Sprint-3/alarmclock/alarmclock.js | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 70dfd4a38..55a229356 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -43,6 +43,25 @@ function updateDisplay(seconds) { title.textContent = `Time Remaining: ${mins}:${secs}`; } +function togglePause() { + if (!isPaused) { + clearInterval(intervalId); + isPaused = true; + } else { + isPaused = false; + intervalId = setInterval(() => { + timeRemaining--; + updateDisplay(timeRemaining); + + if (timeRemaining <= 0) { + clearInterval(intervalId); + playAlarm(); + document.body.classList.add("flash"); + } + }, 1000); + } +} + document.getElementById("stop").addEventListener("click", () => { document.body.classList.remove("flash"); From df1b2f4b2c177ca29da7f427c88e3145a8431369 Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 22:53:35 +0100 Subject: [PATCH 18/20] wire the pause button to togglepause --- Sprint-3/alarmclock/alarmclock.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 55a229356..8f4632462 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -62,6 +62,8 @@ function togglePause() { } } +document.getElementById("pause").addEventListener("click", togglePause); + document.getElementById("stop").addEventListener("click", () => { document.body.classList.remove("flash"); From 5896a93e6e21318704456a96335ccb0d6c565aff Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 22:54:47 +0100 Subject: [PATCH 19/20] updated the style sheet to have the animation --- Sprint-3/alarmclock/style.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Sprint-3/alarmclock/style.css b/Sprint-3/alarmclock/style.css index accde4414..fb1f3b67d 100644 --- a/Sprint-3/alarmclock/style.css +++ b/Sprint-3/alarmclock/style.css @@ -14,7 +14,7 @@ h1 { text-align: center; } .flash { - animation: flash-bg 1s infinite alternate; + animation: flash-bg 0.5s infinite alternate; } @keyframes flash-bg { From a94050130527cac05ab01708a60cb7eda913ddd1 Mon Sep 17 00:00:00 2001 From: Tobias Date: Tue, 28 Jul 2026 23:03:08 +0100 Subject: [PATCH 20/20] changed the Title in the template as Alarm clock app --- Sprint-3/alarmclock/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Sprint-3/alarmclock/index.html b/Sprint-3/alarmclock/index.html index 215a03c23..c4fe7779d 100644 --- a/Sprint-3/alarmclock/index.html +++ b/Sprint-3/alarmclock/index.html @@ -4,7 +4,7 @@ - "Alarm clock app" + Alarm clock app