diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js
index 6ca81cd3b..520eef21f 100644
--- a/Sprint-3/alarmclock/alarmclock.js
+++ b/Sprint-3/alarmclock/alarmclock.js
@@ -1,17 +1,94 @@
-function setAlarm() {}
+// DOM elements
+const setAlarmBtn = document.getElementById("set");
+const stopAlarmBtn = document.getElementById("stop");
+const timeRemaining = document.getElementById("timeRemaining");
+let alarmInterval;
+
+// Update Display function;
+function updateDisplay(secondsValue) {
+ let minutes = Math.floor(secondsValue / 60);
+ let seconds = secondsValue % 60;
+ timeRemaining.innerText = `Time Remaining: ${String(minutes).padStart(2, "0")}:${String(seconds).padStart(2, "0")}`;
+}
+
+// reset function - returns app to clean initial state
+function resetAlarm() {
+ function resetToInitialState() {
+ updateDisplay(0);
+ document.getElementById("alarmSet").value = "";
+ stopAlarmBtn.style.display = "none";
+ setAlarmBtn.style.display = "inline-block"; // ADD THIS - show set button
+ }
+
+ function stopSound() {
+ if (typeof pauseAlarm === "function") {
+ pauseAlarm();
+ }
+ }
+ // Clear any running interval
+ if (alarmInterval) {
+ clearInterval(alarmInterval);
+ alarmInterval = null;
+ }
+
+ resetToInitialState();
+ stopSound();
+}
+
+// Set Alarm function
+function setAlarm() {
+ let totalSeconds;
+ const input = document.getElementById("alarmSet");
+ const timeValue = parseInt(input.value);
+ const hasActiveTimer = alarmInterval !== null;
+
+ function startTimer() {
+ alarmInterval = setInterval(() => {
+ totalSeconds--;
+ updateDisplay(totalSeconds);
+ if (totalSeconds === 0) {
+ clearInterval(alarmInterval);
+ alarmInterval = null;
+
+ // WHEN ALARM STARTS: hide set button, show only stop button
+ setAlarmBtn.style.display = "none";
+ stopAlarmBtn.style.display = "inline-block";
+
+ playAlarm();
+ }
+ }, 1000);
+ }
+
+ resetAlarm();
+
+ if (isNaN(timeValue) || timeValue <= 0) {
+ if (!hasActiveTimer) alert("Please enter a number greater than 0");
+ return;
+ }
+
+ totalSeconds = timeValue;
+ stopAlarmBtn.style.display = "inline-block";
+ setAlarmBtn.style.display = "inline-block"; // Ensure set button is visible
+ updateDisplay(totalSeconds);
+ startTimer();
+}
+
+document.getElementById("stop").addEventListener("click", () => {
+ pauseAlarm();
+ resetAlarm();
+});
// DO NOT EDIT BELOW HERE
var audio = new Audio("alarmsound.mp3");
function setup() {
+ // Ensure clean initial state when page loads
+ resetAlarm();
+
document.getElementById("set").addEventListener("click", () => {
setAlarm();
});
-
- document.getElementById("stop").addEventListener("click", () => {
- pauseAlarm();
- });
}
function playAlarm() {
diff --git a/Sprint-3/alarmclock/index.html b/Sprint-3/alarmclock/index.html
index 48e2e80d9..696febed8 100644
--- a/Sprint-3/alarmclock/index.html
+++ b/Sprint-3/alarmclock/index.html
@@ -1,10 +1,10 @@
-
+
- Title here
+ Alarm Clock
diff --git a/Sprint-3/alarmclock/jest.setup.js b/Sprint-3/alarmclock/jest.setup.js
new file mode 100644
index 000000000..c28d1f644
--- /dev/null
+++ b/Sprint-3/alarmclock/jest.setup.js
@@ -0,0 +1,2 @@
+// jest.setup.js
+require("@testing-library/jest-dom/extend-expect");
diff --git a/Sprint-3/alarmclock/package.json b/Sprint-3/alarmclock/package.json
index e1331e071..46936be07 100644
--- a/Sprint-3/alarmclock/package.json
+++ b/Sprint-3/alarmclock/package.json
@@ -4,7 +4,12 @@
"license": "CC-BY-SA-4.0",
"description": "You must update this package",
"scripts": {
- "test": "jest --config=../jest.config.js alarmclock"
+ "test": "jest"
+ },
+ "jest": {
+ "setupFilesAfterEnv": [
+ "/jest.setup.js"
+ ]
},
"repository": {
"type": "git",
@@ -13,5 +18,10 @@
"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",
+ "devDependencies": {
+ "@testing-library/jest-dom": "^5.16.5",
+ "jest": "^27.5.1",
+ "jsdom": "^19.0.0"
+ }
}
diff --git a/Sprint-3/alarmclock/style.css b/Sprint-3/alarmclock/style.css
index 0c72de38b..a0abb20b4 100644
--- a/Sprint-3/alarmclock/style.css
+++ b/Sprint-3/alarmclock/style.css
@@ -13,3 +13,8 @@
h1 {
text-align: center;
}
+
+/* Both buttons visible by default, but resetAlarm will hide stop initially */
+#stop {
+ display: none;
+}