Added alarmclock functionality

A-Moiz · A-Moiz · commit eb5bdbdc0ad1 · 2026-02-13T17:42:51.000Z
diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js
@@ -1,4 +1,45 @@
-function setAlarm() {}
+const alarmInput = document.getElementById("alarmSet");
+const timeRemaining = document.getElementById("timeRemaining");
+const setButton = document.getElementById("set");
+const stopButton = document.getElementById("stop");
+
+let counter;
+
+setButton.addEventListener("click", setAlarm);
+stopButton.addEventListener("click", pauseAlarm);
+
+function setText() {
+  const alarmValue = parseInt(alarmInput.value) || 0;
+
+  const minutes = Math.floor(alarmValue / 60);
+  const seconds = alarmValue % 60;
+
+  const displayM = String(minutes).padStart(2, "0");
+  const displayS = String(seconds).padStart(2, "0");
+
+  timeRemaining.textContent = `Time Remaining: ${displayM}:${displayS}`;
+}
+
+function countdown() {
+  let alarmValue = parseInt(alarmInput.value) || 0;
+
+  if (alarmValue <= 0) {
+    playAlarm();
+    clearInterval(counter);
+    return;
+  }
+
+  alarmInput.value = alarmValue - 1;
+  setText();
+}
+
+function setAlarm() {
+  clearInterval(counter);
+
+  setText();
+
+  counter = setInterval(countdown, 1000);
+}
 
 // DO NOT EDIT BELOW HERE
 
diff --git a/Sprint-3/alarmclock/index.html b/Sprint-3/alarmclock/index.html
@@ -1,10 +1,10 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <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">
