diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js
index 6ca81cd3b..64a6feac9 100644
--- a/Sprint-3/alarmclock/alarmclock.js
+++ b/Sprint-3/alarmclock/alarmclock.js
@@ -1,4 +1,33 @@
-function setAlarm() {}
+function setAlarm() {
+ const alarmSetEl = document.getElementById("alarmSet");
+ const timeRemainingEl = document.getElementById("timeRemaining");
+ let totalSeconds = +alarmSetEl.value;
+ let intervalId;
+ function updateCountDown() {
+ let seconds = totalSeconds % 60;
+ let minutes = (totalSeconds - seconds) / 60;
+
+ let paddedSeconds = seconds.toString().padStart(2, "0");
+ let paddedMinutes = minutes.toString().padStart(2, "0");
+ timeRemainingEl.innerHTML = `Time Remaining: ${paddedMinutes}:${paddedSeconds}`;
+ alarmSetEl.value = null;
+
+ if (totalSeconds === 0) {
+ document.body.classList.add("finish-countdown")
+
+ playAlarm();
+ clearInterval(intervalId);
+
+ return;
+ }
+ totalSeconds -= 1;
+ }
+
+ updateCountDown();
+ intervalId = setInterval(updateCountDown, 1000);
+}
+
+
// DO NOT EDIT BELOW HERE
diff --git a/Sprint-3/alarmclock/index.html b/Sprint-3/alarmclock/index.html
index 48e2e80d9..ff2d3b453 100644
--- a/Sprint-3/alarmclock/index.html
+++ b/Sprint-3/alarmclock/index.html
@@ -4,7 +4,7 @@
- Title here
+ Alarm clock app
diff --git a/Sprint-3/alarmclock/readme.md b/Sprint-3/alarmclock/readme.md
index c00a20c9c..3ff659297 100644
--- a/Sprint-3/alarmclock/readme.md
+++ b/Sprint-3/alarmclock/readme.md
@@ -6,7 +6,7 @@ First off, once you've branched off `main`, then update the title element in `in
You will need to write your implementation in `alarmclock.js`.
## How the clock should work
-
+
When you click the `Set Alarm` button the counter at the top of the screen should change to the number you entered in the `input` field. For example, if the `input` field says `10` then the title should say `Time Remaining: 00:10`.
Every one second the title should count down by one.
diff --git a/Sprint-3/alarmclock/style.css b/Sprint-3/alarmclock/style.css
index 0c72de38b..6e5bc4424 100644
--- a/Sprint-3/alarmclock/style.css
+++ b/Sprint-3/alarmclock/style.css
@@ -13,3 +13,16 @@
h1 {
text-align: center;
}
+
+.finish-countdown {
+animation: police 0.5s infinite;
+}
+
+@keyframes police {
+ from{
+ background-color:blue;
+ }
+ to{
+ background-color: red;
+ }
+}