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/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 6ca81cd3b..c1ab938c2 100644
--- a/Sprint-3/alarmclock/alarmclock.js
+++ b/Sprint-3/alarmclock/alarmclock.js
@@ -1,4 +1,36 @@
-function setAlarm() {}
+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() {
+ // 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);
+}
// 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;
}