Skip to content

Cape Town | 2026-ITP-Jan | Isaac Abodunrin | Sprint 3 | Grouping data: Alarm Clock #1182

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
bytesandroses wants to merge 18 commits into
base: main
Choose a base branch
from
+61 −4
Open

Cape Town | 2026-ITP-Jan | Isaac Abodunrin | Sprint 3 | Grouping data: Alarm Clock #1182

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
18 commits
Select commit Hold shift + click to select a range
104bc75
Rename app title
bytesandroses Mar 29, 2026
bc9db0d
Implement set Alarm
bytesandroses Apr 5, 2026
2e9abac
Refactor: remove duplicate setAlarm button event listener
bytesandroses Apr 5, 2026
15cd7d0
Refactor: remove duplicate stopAlarm button event listener
bytesandroses Apr 5, 2026
01299b1
Refactor: separate time display into a function
bytesandroses Apr 6, 2026
13a05e6
Refactor: improve readability
bytesandroses Apr 6, 2026
7a55810
Feat: allow alarm to countdown
bytesandroses Apr 6, 2026
d0daf34
Refactor: move timer countdown into separate function
bytesandroses Apr 6, 2026
47e2f22
Refactor alarm countdown
bytesandroses Apr 6, 2026
5fcb0b1
Fix: add 0 in front of minutes when single digit
bytesandroses Apr 6, 2026
98a0a64
Fix: prevent multiple setInterval timers running at the same time
bytesandroses Apr 6, 2026
dfa1f57
Fix: update timer value immediately after button is clicked
bytesandroses Apr 6, 2026
cb65771
Fix: ensure timer stops at 00:00 and doesn't go below
bytesandroses Apr 6, 2026
eeb1c24
Refactor: improve readability of formatTime() function
bytesandroses Apr 6, 2026
f165cf5
Validate and sanitize user's time input
bytesandroses Apr 10, 2026
e903b09
Fix: ensure previous timer is reset before starting a new one
bytesandroses Apr 11, 2026
76e9b57
Fix: remove 1 second delay to ensure alarm sounds at exact 00:00
bytesandroses Apr 11, 2026
5386aff
Fix: ensure alarm plays immediately if user enters a time of 0 second…
bytesandroses Apr 11, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
61 changes: 59 additions & 2 deletions Sprint-3/alarmclock/alarmclock.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,63 @@
function setAlarm() {}
let timeRemaining;
let timerInterval = null;

// DO NOT EDIT BELOW HERE
function formatTime(time) {
const minutes = String(Math.floor(time / 60)).padStart(2, "0");
const seconds = String(time % 60).padStart(2, "0");

return `${minutes}:${seconds}`;
}

function displayAlarm(time) {
const alarmBox = document.getElementById("timeRemaining");
alarmBox.textContent = `Time Remaining: ${formatTime(time)}`;
}

function decreaseAlarmTime() {
timeRemaining--;
displayAlarm(timeRemaining);

if (timeRemaining <= 0) {
clearInterval(timerInterval);
timerInterval = null;
playAlarm();
return;
}
}

function resetAlarm() {
clearInterval(timerInterval);
timerInterval = null;
pauseAlarm();
audio.currentTime = 0;
}
Comment on lines +16 to +26
Copy link
Copy Markdown
Contributor

@cjyuan cjyuan Apr 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

When the countdown reaches 00:00, there is a one second delay before the alarm sound is played. Is this by design?

At line 25, when timeRemaining changes from 1 to 0, the app only changes the display to 00:00. It's only in the next interval, the code on lines 17-22 is executed.

Copy link
Copy Markdown
Member Author

@bytesandroses bytesandroses Apr 11, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No this definitely a bug -- it wasn't by design.

I've applied a fix by changing the order of execution: timeRemaining is first decremented so that the alarm sound can be played at exactly 00:00 without needing to start a new loop.


function setAlarm() {
const setTime = document.getElementById("alarmSet").value;

const numericTime = parseInt(setTime, 10);
if (isNaN(numericTime)) {
alert(
"Please enter your desired time in numbers, e.g., 120 for 2 minutes."
);
return;
}
if (numericTime < 0) {
alert("Please enter a non-negative number.");
return;
}

resetAlarm();
timeRemaining = numericTime;

displayAlarm(timeRemaining);

if (timeRemaining === 0) {
playAlarm();
} else {
timerInterval = setInterval(decreaseAlarmTime, 1000);
}
}

var audio = new Audio("alarmsound.mp3");

Expand Down
4 changes: 2 additions & 2 deletions Sprint-3/alarmclock/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -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">
Expand Down
Loading