From 85f593a4856a26505ce1120fe4feea49252bf8ff Mon Sep 17 00:00:00 2001 From: boladjebsoft Date: Tue, 24 Mar 2026 16:48:47 +0000 Subject: [PATCH 1/6] changed the title element to "Alarm clock app" --- Sprint-3/alarmclock/index.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/Sprint-3/alarmclock/index.html b/Sprint-3/alarmclock/index.html index 48e2e80d9..66748001e 100644 --- a/Sprint-3/alarmclock/index.html +++ b/Sprint-3/alarmclock/index.html @@ -1,10 +1,10 @@ - + - Title here + Alarm clock app
From 7b2351ba37dd41becf9c677c54ed0ab64429d9dd Mon Sep 17 00:00:00 2001 From: boladjebsoft Date: Sat, 28 Mar 2026 22:55:47 +0000 Subject: [PATCH 2/6] implementing alarm clock functionality --- Sprint-3/alarmclock/alarmclock.js | 49 ++++++++++++++++++++++++++++++- 1 file changed, 48 insertions(+), 1 deletion(-) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 6ca81cd3b..23fe5681a 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -1,5 +1,52 @@ -function setAlarm() {} +//global variables: 1- userInput, 2- timeRemaining, 3- stop, 4- seconds, 5- minutes +// get access to the "input" element +const userInput = document.querySelector("#alarmSet"); +// get access to the "timeRemaining" element +const timeRemaining = document.querySelector("#timeRemaining"); +// get access to the "stop" button +const stop = document.querySelector("#stop"); +let seconds = 0; +let minutes = 0; + +function main() { + // add an event listener to the "input" element that will call the counterUpdate function when clicked on + document.getElementById("alarmSet").addEventListener("click", counterUpdate); +} + +// define the function that will update the counter +function counterUpdate() { + // local variables: useInputValue + // get the value of the input element. + const userInputValue = userInput.value; + // check if the input is equal to or greater than 0 + if (userInputValue >= 0) { + minutes = Math.floor(userInputValue / 60); + seconds = userInputValue % 60; + // if it is, update the TimeRemaining element to show the real time remaining in minutes and seconds. + timeRemaining.innerText = `Time Remaining: ${minutes.toString().padStart(2, "0")}:${seconds.toString().padStart(2, "0")}`; + } +} + +// define the function that will count down the time remaining every second and update the remaining time on the page +function setAlarm() { + // use setInterval to call a function every second that will decrease the time remaining by 1 second. + const interval = setInterval(() => { + if (seconds > 0) { + seconds--; + timeRemaining.innerText = `Time Remaining: ${minutes.toString().padStart(2, "0")}:${seconds.toString().padStart(2, "0")}`; + } else if (minutes > 0) { + minutes--; + seconds = 59; + timeRemaining.innerText = `Time Remaining: ${minutes.toString().padStart(2, "0")}:${seconds.toString().padStart(2, "0")}`; + } else { + clearInterval(interval); + userInput.value = ""; + playAlarm(); + } + }, 1000); +} +main(); // DO NOT EDIT BELOW HERE var audio = new Audio("alarmsound.mp3"); From adf628aa22899b45e45ab18b2cf913e18a6468ae Mon Sep 17 00:00:00 2001 From: boladjebsoft Date: Tue, 7 Apr 2026 11:30:11 +0100 Subject: [PATCH 3/6] added event listener for keyup to update the counter when the user types in the input field. --- Sprint-2/implement/contains.test.js | 4 +++- Sprint-3/alarmclock/alarmclock.js | 3 ++- 2 files changed, 5 insertions(+), 2 deletions(-) diff --git a/Sprint-2/implement/contains.test.js b/Sprint-2/implement/contains.test.js index 326bdb1f2..633098edf 100644 --- a/Sprint-2/implement/contains.test.js +++ b/Sprint-2/implement/contains.test.js @@ -20,7 +20,9 @@ as the object doesn't contains a key of 'c' // Given an empty object // When passed to contains // Then it should return false -test.todo("contains on empty object returns false"); +test("contains on empty object returns false", () => { + expect(contains({}, "a")).toEqual(false); +}); // Given an object with properties // When passed to contains with an existing property name diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 23fe5681a..2211f867c 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -10,8 +10,9 @@ let seconds = 0; let minutes = 0; function main() { - // add an event listener to the "input" element that will call the counterUpdate function when clicked on + // add an event listener to the "input" element that will call the counterUpdate function when clicked on or when the user types in the input field. document.getElementById("alarmSet").addEventListener("click", counterUpdate); + document.getElementById("alarmSet").addEventListener("keyup", counterUpdate); } // define the function that will update the counter From e629a8560e766eb9d1cc1b07fcc57b1569c8caaa Mon Sep 17 00:00:00 2001 From: boladjebsoft Date: Tue, 7 Apr 2026 13:01:54 +0100 Subject: [PATCH 4/6] storing time in one variable ans implment required chanes. --- Sprint-3/alarmclock/alarmclock.js | 26 +++++++++++++------------- 1 file changed, 13 insertions(+), 13 deletions(-) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 2211f867c..d8c0576f7 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -6,8 +6,7 @@ const userInput = document.querySelector("#alarmSet"); const timeRemaining = document.querySelector("#timeRemaining"); // get access to the "stop" button const stop = document.querySelector("#stop"); -let seconds = 0; -let minutes = 0; +let totalSeconds = 0; function main() { // add an event listener to the "input" element that will call the counterUpdate function when clicked on or when the user types in the input field. @@ -22,24 +21,25 @@ function counterUpdate() { const userInputValue = userInput.value; // check if the input is equal to or greater than 0 if (userInputValue >= 0) { - minutes = Math.floor(userInputValue / 60); - seconds = userInputValue % 60; - // if it is, update the TimeRemaining element to show the real time remaining in minutes and seconds. - timeRemaining.innerText = `Time Remaining: ${minutes.toString().padStart(2, "0")}:${seconds.toString().padStart(2, "0")}`; + totalSeconds = userInputValue; + displyUpdate(); } } +// Update the TimeRemaining element to show the real time remaining in minutes and seconds. +function displyUpdate() { + const minutes = Math.floor(totalSeconds / 60); + const seconds = totalSeconds % 60; + timeRemaining.innerText = `Time Remaining: ${minutes.toString().padStart(2, "0")}:${seconds.toString().padStart(2, "0")}`; +} + // define the function that will count down the time remaining every second and update the remaining time on the page function setAlarm() { // use setInterval to call a function every second that will decrease the time remaining by 1 second. const interval = setInterval(() => { - if (seconds > 0) { - seconds--; - timeRemaining.innerText = `Time Remaining: ${minutes.toString().padStart(2, "0")}:${seconds.toString().padStart(2, "0")}`; - } else if (minutes > 0) { - minutes--; - seconds = 59; - timeRemaining.innerText = `Time Remaining: ${minutes.toString().padStart(2, "0")}:${seconds.toString().padStart(2, "0")}`; + if (totalSeconds > 0) { + totalSeconds--; + displyUpdate(); } else { clearInterval(interval); userInput.value = ""; From b5c7f47c5c501d354c3aafc1a393229a9738efc3 Mon Sep 17 00:00:00 2001 From: boladjebsoft Date: Tue, 7 Apr 2026 13:11:47 +0100 Subject: [PATCH 5/6] Revert "added event listener for keyup to update the counter when the user types in the input field." This reverts commit adf628aa22899b45e45ab18b2cf913e18a6468ae. --- Sprint-2/implement/contains.test.js | 4 +--- Sprint-3/alarmclock/alarmclock.js | 3 +-- 2 files changed, 2 insertions(+), 5 deletions(-) diff --git a/Sprint-2/implement/contains.test.js b/Sprint-2/implement/contains.test.js index 633098edf..326bdb1f2 100644 --- a/Sprint-2/implement/contains.test.js +++ b/Sprint-2/implement/contains.test.js @@ -20,9 +20,7 @@ as the object doesn't contains a key of 'c' // Given an empty object // When passed to contains // Then it should return false -test("contains on empty object returns false", () => { - expect(contains({}, "a")).toEqual(false); -}); +test.todo("contains on empty object returns false"); // Given an object with properties // When passed to contains with an existing property name diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index d8c0576f7..87cde5215 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -9,9 +9,8 @@ const stop = document.querySelector("#stop"); let totalSeconds = 0; function main() { - // add an event listener to the "input" element that will call the counterUpdate function when clicked on or when the user types in the input field. + // add an event listener to the "input" element that will call the counterUpdate function when clicked on document.getElementById("alarmSet").addEventListener("click", counterUpdate); - document.getElementById("alarmSet").addEventListener("keyup", counterUpdate); } // define the function that will update the counter From 8f746981d1e73f3ad0f3c208bb10cea43ddbf621 Mon Sep 17 00:00:00 2001 From: boladjebsoft Date: Tue, 7 Apr 2026 13:15:27 +0100 Subject: [PATCH 6/6] added an event listener for the "keyup" to update the display when the user types in the input field. --- 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 87cde5215..a7b1cf267 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -11,6 +11,7 @@ let totalSeconds = 0; function main() { // add an event listener to the "input" element that will call the counterUpdate function when clicked on document.getElementById("alarmSet").addEventListener("click", counterUpdate); + document.getElementById("alarmSet").addEventListener("keyup", counterUpdate); } // define the function that will update the counter