From f8431eeeeadb2f155cdad995ecf6fb10729de0ee Mon Sep 17 00:00:00 2001 From: Martin Date: Fri, 13 Mar 2026 16:07:40 +0000 Subject: [PATCH 1/2] tic tock --- .../alarmclock/{index.html => alarClock.html} | 0 Sprint-3/alarmclock/alarmclock.js | 15 ++++++++++++++- 2 files changed, 14 insertions(+), 1 deletion(-) rename Sprint-3/alarmclock/{index.html => alarClock.html} (100%) diff --git a/Sprint-3/alarmclock/index.html b/Sprint-3/alarmclock/alarClock.html similarity index 100% rename from Sprint-3/alarmclock/index.html rename to Sprint-3/alarmclock/alarClock.html diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 6ca81cd3b..039749dbd 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -1,4 +1,17 @@ -function setAlarm() {} +let timeIn = document.getElementById("alarmSet").value; +let countDown = document.getElementById("timeRemaining"); + +function setAlarm() { + timeIn--; + countDown.innerHTML = "timeRemaining " + ":" + timeIn; + if (timeIn < 1) { + playAlarm; + clearInterval(timer); + } +} +const timer = setInterval(setAlarm, 1000); + +// setTimeout(count, 1000); // DO NOT EDIT BELOW HERE From fd7a1c66196e13c9a9738865c1c0b7320cb9bedd Mon Sep 17 00:00:00 2001 From: Martin Date: Thu, 19 Mar 2026 09:33:42 +0000 Subject: [PATCH 2/2] happy with my clock --- Sprint-3/alarmclock/alarmClockApp.html | 20 +++++++++++++ Sprint-3/alarmclock/alarmclock.js | 41 +++++++++++++++++++------- Sprint-3/alarmclock/package.json | 5 +++- Sprint-3/alarmclock/style.css | 15 ++++++++-- 4 files changed, 66 insertions(+), 15 deletions(-) create mode 100644 Sprint-3/alarmclock/alarmClockApp.html diff --git a/Sprint-3/alarmclock/alarmClockApp.html b/Sprint-3/alarmclock/alarmClockApp.html new file mode 100644 index 000000000..91225d4bc --- /dev/null +++ b/Sprint-3/alarmclock/alarmClockApp.html @@ -0,0 +1,20 @@ + + + + + + + Title here + + +
+

Time Remaining: 00:00

+ + + + + +
+ + + diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js index 039749dbd..c1ab938c2 100644 --- a/Sprint-3/alarmclock/alarmclock.js +++ b/Sprint-3/alarmclock/alarmclock.js @@ -1,17 +1,36 @@ -let timeIn = document.getElementById("alarmSet").value; -let countDown = document.getElementById("timeRemaining"); +botton = document.getElementById("set"); +//begins the count down +botton.addEventListener("click", setAlarm); +// document.getElementById("set").addEventListener("click", setAlarm); +const timeRemaining = document.getElementById("timeRemaining"); function setAlarm() { - timeIn--; - countDown.innerHTML = "timeRemaining " + ":" + timeIn; - if (timeIn < 1) { - playAlarm; - clearInterval(timer); - } + // gets the value of the input field and stores it in a variable + let timeInSeconds = document.getElementById("alarmSet").value; + + let clock = setInterval(() => { + function pad(num) { + return num.toString().padStart(2, "0"); + } + + function formatTimeDisplay(timeInSeconds) { + const remainingSeconds = timeInSeconds % 60; + const totalMinutes = (timeInSeconds - remainingSeconds) / 60; + const remainingMinutes = totalMinutes % 60; + const totalHours = (totalMinutes - remainingMinutes) / 60; + + return `${pad(totalHours)}:${pad(remainingMinutes)}:${pad(remainingSeconds)}`; + } + + timeInSecond = timeInSeconds--; + if (timeInSeconds == 0) { + clearInterval(clock); + playAlarm(); + } + timeRemaining.innerHTML = + "time remaining " + formatTimeDisplay(timeInSeconds); + }, 1000); } -const timer = setInterval(setAlarm, 1000); - -// setTimeout(count, 1000); // DO NOT EDIT BELOW HERE diff --git a/Sprint-3/alarmclock/package.json b/Sprint-3/alarmclock/package.json index e1331e071..ec3d3f637 100644 --- a/Sprint-3/alarmclock/package.json +++ b/Sprint-3/alarmclock/package.json @@ -13,5 +13,8 @@ "bugs": { "url": "https://github.com/CodeYourFuture/CYF-Coursework-Template/issues" }, - "homepage": "https://github.com/CodeYourFuture/CYF-Coursework-Template#readme" + "homepage": "https://github.com/CodeYourFuture/CYF-Coursework-Template#readme", + "dependencies": { + "jest": "^30.3.0" + } } diff --git a/Sprint-3/alarmclock/style.css b/Sprint-3/alarmclock/style.css index 0c72de38b..7101d6279 100644 --- a/Sprint-3/alarmclock/style.css +++ b/Sprint-3/alarmclock/style.css @@ -1,3 +1,10 @@ +body { + min-width: fit-content; + font-size: 20px; + background-color: darkorchid; + color: rgb(113, 48, 48); +} + .centre { position: fixed; top: 50%; @@ -5,11 +12,13 @@ -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } - +button { + border-radius: 30px; +} #alarmSet { - margin: 20px; + margin: 0px; } h1 { - text-align: center; + text-align: right; }