From 7df742bf603771b18fb9172025f50ade380aca54 Mon Sep 17 00:00:00 2001 From: Damian_Dunkley Date: Tue, 17 Mar 2026 10:09:35 +0000 Subject: [PATCH 1/8] Changes to Alarm Clock --- Sprint-3/alarmclock/alarmclock.js | 45 ++++++++++++++++++++++++++++++- 1 file changed, 44 insertions(+), 1 deletion(-) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 6ca81cd3b..c6119a98e 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -1,4 +1,47 @@ -function setAlarm() {} +let countdownId = null; + +function formatTime(totalSeconds) {// Convert total seconds to minutes and seconds + const minutes = Math.floor(totalSeconds / 60); + const seconds = totalSeconds % 60; + + return `${String(minutes).padStart(2, "0")}:${String(seconds).padStart(2, "0")}`; +} + +function updateHeading(totalSeconds) {// Update the heading with the formatted time remaining + const heading = document.getElementById("timeRemaining");// Get the heading element using its DOM ID + heading.innerText = `Time Remaining: ${formatTime(totalSeconds)}`;// Set the text of the heading to show the time remaining in the format "Time Remaining: MM:SS" +} + +function setAlarm() { + const input = document.getElementById("alarmSet");// Get the input element using its DOM ID + let remainingSeconds = Number(input.value);// Convert the input value to a number representing the total seconds for the countdown + + if (!Number.isFinite(remainingSeconds) || remainingSeconds < 0) {// Check if the input is a valid number and non-negative + remainingSeconds = 0;// If the input is invalid, set remainingSeconds to 0 + } + + if (countdownId !== null) {// If there is an existing countdown, clear it before starting a new one + + clearInterval(countdownId); + } + + updateHeading(remainingSeconds);// Update the heading to show the initial time remaining before starting the countdown + + countdownId = setInterval(() => {// Start a new interval that will execute the provided function every 1000 milliseconds (1 second) + remainingSeconds -= 1; + + if (remainingSeconds <= 0) {// If the remaining seconds reach 0 or below, stop the countdown and play the alarm + updateHeading(0); + clearInterval(countdownId); + countdownId = null; + playAlarm(); + document.body.style.backgroundColor = "red"; // change background colour + return; + } + + updateHeading(remainingSeconds); + }, 1000); +} // DO NOT EDIT BELOW HERE From 8564230e32a2b4209314c046d444670d7ed0b89a Mon Sep 17 00:00:00 2001 From: Damian_Dunkley Date: Wed, 18 Mar 2026 10:34:02 +0000 Subject: [PATCH 2/8] changes to Quote.js to select and display quote --- Sprint-3/quote-generator/quotes.js | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/Sprint-3/quote-generator/quotes.js b/Sprint-3/quote-generator/quotes.js index 4a4d04b72..8e7c61fbb 100644 --- a/Sprint-3/quote-generator/quotes.js +++ b/Sprint-3/quote-generator/quotes.js @@ -17,7 +17,16 @@ // You don't need to change this function function pickFromArray(choices) { - return choices[Math.floor(Math.random() * choices.length)]; + return choices[Math.floor(Math.random() * choices.length)];// Math.random() generates a random number between 0 (inclusive) and 1 (exclusive). Multiplying it by choices.length gives a random number between 0 and the length of the array. Math.floor() rounds it down to the nearest whole number, which is used as an index to pick an item from the array. +} +function setup() { + const button = document.getElementById("new-quote");// Get the button element using its DOM ID + button.addEventListener("click", () => {// Add a click event listener to the button + const quote = pickFromArray(quotes);// Call the pickFromArray function with the quotes array to get a random quote + document.getElementById("quote").innerText = quote.quote; // Display quote + document.getElementById("author").innerText = quote.author; // Display author + + }); } // A list of quotes you can use in your app. @@ -491,3 +500,4 @@ const quotes = [ ]; // call pickFromArray with the quotes array to check you get a random quote +setup(); From 65ca3fd1af6622c928978ffda6482be50ca3e4c1 Mon Sep 17 00:00:00 2001 From: Damian_Dunkley Date: Wed, 18 Mar 2026 10:44:05 +0000 Subject: [PATCH 3/8] changes to add style.css to match background colour and white text box --- Sprint-3/quote-generator/index.html | 13 ++++++---- Sprint-3/quote-generator/style.css | 37 ++++++++++++++++++++++++++++- 2 files changed, 44 insertions(+), 6 deletions(-) diff --git a/Sprint-3/quote-generator/index.html b/Sprint-3/quote-generator/index.html index 30b434bcf..bb97906bc 100644 --- a/Sprint-3/quote-generator/index.html +++ b/Sprint-3/quote-generator/index.html @@ -1,15 +1,18 @@ - + Title here + -

hello there

-

-

- +
+

Quote Generator

+

+

+ +
diff --git a/Sprint-3/quote-generator/style.css b/Sprint-3/quote-generator/style.css index 63cedf2d2..50ac727bf 100644 --- a/Sprint-3/quote-generator/style.css +++ b/Sprint-3/quote-generator/style.css @@ -1 +1,36 @@ -/** Write your CSS in here **/ +body { + margin: 0; + min-height: 100vh; + display: grid; + place-items: center; + background-color: orange; + font-family: Arial, sans-serif; +} + +.quote-box { + width: min(600px, 90vw); + background-color: white; + border-radius: 12px; + padding: 24px; + box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16); + text-align: center; +} + +#quote { + font-size: 1.25rem; + line-height: 1.5; + margin: 20px 0 12px; +} + +#author { + font-weight: 700; + margin-bottom: 20px; +} + +#new-quote { + border: none; + border-radius: 8px; + padding: 10px 16px; + font-size: 1rem; + cursor: pointer; +} From dbfc3bb210f1d40e4208f120d6733328782e09c8 Mon Sep 17 00:00:00 2001 From: Damian_Dunkley Date: Wed, 18 Mar 2026 10:53:57 +0000 Subject: [PATCH 4/8] changes to add style.css to match background colour and white text box --- Sprint-3/quote-generator/index.html | 2 +- Sprint-3/quote-generator/style.css | 6 +++++- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/Sprint-3/quote-generator/index.html b/Sprint-3/quote-generator/index.html index bb97906bc..d897d70ca 100644 --- a/Sprint-3/quote-generator/index.html +++ b/Sprint-3/quote-generator/index.html @@ -9,7 +9,7 @@
-

Quote Generator

+

diff --git a/Sprint-3/quote-generator/style.css b/Sprint-3/quote-generator/style.css index 50ac727bf..6792d7ac8 100644 --- a/Sprint-3/quote-generator/style.css +++ b/Sprint-3/quote-generator/style.css @@ -17,14 +17,18 @@ body { } #quote { - font-size: 1.25rem; + font-size: 1.25rem; + color :orange; line-height: 1.5; margin: 20px 0 12px; + text-align: left; } #author { font-weight: 700; + color :orange; margin-bottom: 20px; + text-align: right; } #new-quote { From c615b8fc855a36808c4b410379ee71eecc0e8b7f Mon Sep 17 00:00:00 2001 From: Damian_Dunkley Date: Wed, 18 Mar 2026 11:10:33 +0000 Subject: [PATCH 5/8] changes to remove style.css background and colours remain defaultx --- Sprint-3/quote-generator/index.html | 2 +- Sprint-3/quote-generator/quotes.js | 21 +++++++++++++-------- Sprint-3/quote-generator/style.css | 6 +++--- 3 files changed, 17 insertions(+), 12 deletions(-) diff --git a/Sprint-3/quote-generator/index.html b/Sprint-3/quote-generator/index.html index d897d70ca..559ceebd0 100644 --- a/Sprint-3/quote-generator/index.html +++ b/Sprint-3/quote-generator/index.html @@ -4,7 +4,7 @@ Title here - + diff --git a/Sprint-3/quote-generator/quotes.js b/Sprint-3/quote-generator/quotes.js index 8e7c61fbb..17a17b351 100644 --- a/Sprint-3/quote-generator/quotes.js +++ b/Sprint-3/quote-generator/quotes.js @@ -17,16 +17,21 @@ // You don't need to change this function function pickFromArray(choices) { - return choices[Math.floor(Math.random() * choices.length)];// Math.random() generates a random number between 0 (inclusive) and 1 (exclusive). Multiplying it by choices.length gives a random number between 0 and the length of the array. Math.floor() rounds it down to the nearest whole number, which is used as an index to pick an item from the array. + return choices[Math.floor(Math.random() * choices.length)]; // Math.random() generates a random number between 0 (inclusive) and 1 (exclusive). Multiplying it by choices.length gives a random number between 0 and the length of the array. Math.floor() rounds it down to the nearest whole number, which is used as an index to pick an item from the array. } function setup() { - const button = document.getElementById("new-quote");// Get the button element using its DOM ID - button.addEventListener("click", () => {// Add a click event listener to the button - const quote = pickFromArray(quotes);// Call the pickFromArray function with the quotes array to get a random quote - document.getElementById("quote").innerText = quote.quote; // Display quote - document.getElementById("author").innerText = quote.author; // Display author - - }); + const button = document.getElementById("new-quote"); // Get the button element using its DOM ID + const quoteElement = document.getElementById("quote"); + const authorElement = document.getElementById("author"); + + function renderRandomQuote() { + const selectedQuote = pickFromArray(quotes); // Call the pickFromArray function with the quotes array to get a random quote + quoteElement.innerText = selectedQuote.quote; // Display quote + authorElement.innerText = selectedQuote.author; // Display author + } + + renderRandomQuote(); + button.addEventListener("click", renderRandomQuote); // Add a click event listener to the button } // A list of quotes you can use in your app. diff --git a/Sprint-3/quote-generator/style.css b/Sprint-3/quote-generator/style.css index 6792d7ac8..0cf31b97b 100644 --- a/Sprint-3/quote-generator/style.css +++ b/Sprint-3/quote-generator/style.css @@ -17,8 +17,8 @@ body { } #quote { - font-size: 1.25rem; - color :orange; + font-size: 1.25rem; + color: orange; line-height: 1.5; margin: 20px 0 12px; text-align: left; @@ -26,7 +26,7 @@ body { #author { font-weight: 700; - color :orange; + color: orange; margin-bottom: 20px; text-align: right; } From c5d759a2ea5f85c25afdbb30cc152838714e0d88 Mon Sep 17 00:00:00 2001 From: Damian_Dunkley Date: Wed, 18 Mar 2026 11:13:59 +0000 Subject: [PATCH 6/8] changes to remove style.css background and colours remain defaultx --- Sprint-3/quote-generator/style.css | 40 ------------------------------ 1 file changed, 40 deletions(-) delete mode 100644 Sprint-3/quote-generator/style.css diff --git a/Sprint-3/quote-generator/style.css b/Sprint-3/quote-generator/style.css deleted file mode 100644 index 0cf31b97b..000000000 --- a/Sprint-3/quote-generator/style.css +++ /dev/null @@ -1,40 +0,0 @@ -body { - margin: 0; - min-height: 100vh; - display: grid; - place-items: center; - background-color: orange; - font-family: Arial, sans-serif; -} - -.quote-box { - width: min(600px, 90vw); - background-color: white; - border-radius: 12px; - padding: 24px; - box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16); - text-align: center; -} - -#quote { - font-size: 1.25rem; - color: orange; - line-height: 1.5; - margin: 20px 0 12px; - text-align: left; -} - -#author { - font-weight: 700; - color: orange; - margin-bottom: 20px; - text-align: right; -} - -#new-quote { - border: none; - border-radius: 8px; - padding: 10px 16px; - font-size: 1rem; - cursor: pointer; -} From 257852659da3ec5c674c2f5b2949e51361dd4109 Mon Sep 17 00:00:00 2001 From: Damian_Dunkley Date: Wed, 18 Mar 2026 11:18:10 +0000 Subject: [PATCH 7/8] restoring origional alarmclock.js file --- Sprint-3/alarmclock/alarmclock.js | 45 +------------------------------ 1 file changed, 1 insertion(+), 44 deletions(-) diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index c6119a98e..6ca81cd3b 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -1,47 +1,4 @@ -let countdownId = null; - -function formatTime(totalSeconds) {// Convert total seconds to minutes and seconds - const minutes = Math.floor(totalSeconds / 60); - const seconds = totalSeconds % 60; - - return `${String(minutes).padStart(2, "0")}:${String(seconds).padStart(2, "0")}`; -} - -function updateHeading(totalSeconds) {// Update the heading with the formatted time remaining - const heading = document.getElementById("timeRemaining");// Get the heading element using its DOM ID - heading.innerText = `Time Remaining: ${formatTime(totalSeconds)}`;// Set the text of the heading to show the time remaining in the format "Time Remaining: MM:SS" -} - -function setAlarm() { - const input = document.getElementById("alarmSet");// Get the input element using its DOM ID - let remainingSeconds = Number(input.value);// Convert the input value to a number representing the total seconds for the countdown - - if (!Number.isFinite(remainingSeconds) || remainingSeconds < 0) {// Check if the input is a valid number and non-negative - remainingSeconds = 0;// If the input is invalid, set remainingSeconds to 0 - } - - if (countdownId !== null) {// If there is an existing countdown, clear it before starting a new one - - clearInterval(countdownId); - } - - updateHeading(remainingSeconds);// Update the heading to show the initial time remaining before starting the countdown - - countdownId = setInterval(() => {// Start a new interval that will execute the provided function every 1000 milliseconds (1 second) - remainingSeconds -= 1; - - if (remainingSeconds <= 0) {// If the remaining seconds reach 0 or below, stop the countdown and play the alarm - updateHeading(0); - clearInterval(countdownId); - countdownId = null; - playAlarm(); - document.body.style.backgroundColor = "red"; // change background colour - return; - } - - updateHeading(remainingSeconds); - }, 1000); -} +function setAlarm() {} // DO NOT EDIT BELOW HERE From 951a6995d8acd90b2159f467d961f9058601a832 Mon Sep 17 00:00:00 2001 From: Damian_Dunkley Date: Thu, 26 Mar 2026 15:00:56 +0000 Subject: [PATCH 8/8] updating index.html as per Readme with title --- Sprint-3/quote-generator/index.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/Sprint-3/quote-generator/index.html b/Sprint-3/quote-generator/index.html index 559ceebd0..37799738b 100644 --- a/Sprint-3/quote-generator/index.html +++ b/Sprint-3/quote-generator/index.html @@ -3,8 +3,8 @@ - Title here - + Quote generator app +