CodeYourFuture · russom-g · Jul 16, 2026 · Jul 16, 2026 · Jul 16, 2026 · Jul 18, 2026
diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js
@@ -1,4 +1,40 @@
-function setAlarm() {}
+let timer;
+
+function updateDisplay(time) {
+
+  let heading = document.getElementById("timeRemaining");
+  let minutes = Math.floor(time / 60);
+  let seconds = time % 60;
+
+  heading.innerText =
+    "Time Remaining: " +
+    String(minutes).padStart(2, "0") +
+    ":" +
+    String(seconds).padStart(2, "0");
+}
+
+function setAlarm() {
+
+  if (timer) clearInterval(timer);
+  audio.pause();
+  audio.currentTime = 0;
+
+  let time = Number(document.getElementById("alarmSet").value);
+  if (isNaN(time) || time <= 0) return;
+
+  updateDisplay(time);
+
+  timer = setInterval(function () {
+    time = time - 1;
+
+    updateDisplay(time);
+
+    if (time === 0) {
+      playAlarm();
+      clearInterval(timer);
+    }
+  }, 1000);
+}
 
 // DO NOT EDIT BELOW HERE
 

diff --git a/Sprint-3/alarmclock/alarmclock.test.js b/Sprint-3/alarmclock/alarmclock.test.js
@@ -102,3 +102,4 @@ test("should play audio when the timer reaches zero", () => {
 
   expect(mockPlayAlarm).toHaveBeenCalledTimes(1);
 });
+
diff --git a/Sprint-3/alarmclock/index.html b/Sprint-3/alarmclock/index.html
@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <link rel="stylesheet" href="style.css" />
-    <title>Title here</title>
+    <title>Alarm clock app</title>
   </head>
   <body>
     <div class="centre">

diff --git a/Sprint-3/alarmclock/package.json b/Sprint-3/alarmclock/package.json
@@ -15,3 +15,4 @@
   },
   "homepage": "https://github.com/CodeYourFuture/CYF-Coursework-Template#readme"
 }
+
diff --git a/Sprint-3/alarmclock/readme.md b/Sprint-3/alarmclock/readme.md
@@ -30,3 +30,4 @@ If you have time and want to do more why not try
 - Make the background change color when the alarm clock finishes
   - Try making the background flash!
 - Could you add `pause` functionality so that the count down stops and then you restart it later?
+
diff --git a/Sprint-3/alarmclock/style.css b/Sprint-3/alarmclock/style.css
@@ -13,3 +13,4 @@
 h1 {
   text-align: center;
 }
+
Original file line number	Diff line number	Diff line change
Expand Up		@@ -102,3 +102,4 @@ test("should play audio when the timer reaches zero", () => {

		expect(mockPlayAlarm).toHaveBeenCalledTimes(1);
		});
Original file line number	Diff line number	Diff line change
Expand Up		@@ -15,3 +15,4 @@
		},
		"homepage": "https://github.com/CodeYourFuture/CYF-Coursework-Template#readme"
		}
Original file line number	Diff line number	Diff line change
Expand Up		@@ -30,3 +30,4 @@ If you have time and want to do more why not try
		- Make the background change color when the alarm clock finishes
		- Try making the background flash!
		- Could you add `pause` functionality so that the count down stops and then you restart it later?