Skip to content

West Midlands | 25-ITP-Sept | Mustaf Asani | Sprint 3 | Feature/alarmclock #921

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

Closed
asaniDev wants to merge 15 commits into from
Closed

West Midlands | 25-ITP-Sept | Mustaf Asani | Sprint 3 | Feature/alarmclock #921

Show file tree
Hide file tree
Changes from 12 commits
Commits
Show all changes
15 commits
Select commit Hold shift + click to select a range
5007c4b
added all tests to test, started mean.js but not finished
asaniDev Oct 30, 2025
f21c96e
predicted the result of each file before fixing them
asaniDev Nov 15, 2025
b058970
installed dependencies
asaniDev Nov 15, 2025
b63c6de
made up tests and then created functions to pass the required tests i…
asaniDev Nov 23, 2025
e17bf30
fixed invert function,answered questions and added tests to check it …
asaniDev Nov 29, 2025
8196fd6
made alarm clock countdown from user input number and alarm sound whe…
asaniDev Dec 8, 2025
29cacc9
made sure when input time is 0, alarm still works and added backgroun…
asaniDev Dec 8, 2025
250453e
Revert "added all tests to test, started mean.js but not finished"
asaniDev Dec 8, 2025
9819f2c
Revert "predicted the result of each file before fixing them"
asaniDev Dec 8, 2025
6c486d4
Revert "installed dependencies"
asaniDev Dec 8, 2025
3e235c6
Revert "made up tests and then created functions to pass the required…
asaniDev Dec 8, 2025
9725399
Revert "fixed invert function,answered questions and added tests to c…
asaniDev Dec 8, 2025
da00a5e
removed unnecesary functions and reset timer
asaniDev Dec 16, 2025
2454086
removed redundant code, added code to stop alarm if runnng
asaniDev Dec 16, 2025
b03f445
reordered the statements to flow in a logical way
asaniDev Dec 20, 2025
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
86 changes: 85 additions & 1 deletion Sprint-3/alarmclock/alarmclock.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,60 @@
function setAlarm() {}
let inputTime = 0;
let timer = null;
let changeBgColor = false;

function setAlarm() {
inputTime = Number(document.querySelector("#alarmSet").value);

if (Number.isInteger(inputTime) && !isNaN(inputTime) && inputTime >= 0) {
if (inputTime === 10) {
changeBgColor = true;
} else if (inputTime === 0) {
displayTime(inputTime);
playAlarm();
}
displayTime(inputTime);
if (timer) clearInterval(timer);
timer = setInterval(countDown, 1000);
Copy link
Copy Markdown
Contributor

@cjyuan cjyuan Dec 16, 2025

Choose a reason for hiding this comment

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

Line 20 will still get executed even when inputTime is 0.

Copy link
Copy Markdown
Author

@asaniDev asaniDev Dec 16, 2025

Choose a reason for hiding this comment

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

removed redundant code

}
}
Comment on lines +13 to +21
Copy link
Copy Markdown
Contributor

@cjyuan cjyuan Dec 17, 2025

Choose a reason for hiding this comment

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

When inputTime is 0, can you identify all the code between line 11 and 30 that will be executed? And among them, which code are unnecessarily executed?

Consider organising the code in the following maner:

  // Step 1: Reset everything (timer, audio, background, ...) before starting a new countdown
  // Note: Can also consider implement a function to reset everything and then call the function here
  ...
  
  // Step 2; Validate input
  ...
  
  // Step 3: Start a new countdown depending on the value of `inputTime`
  ...


function displayTime(totalTime) {
const seconds = totalTime % 60;
const minutes = (totalTime - seconds) / 60;
const timeLeft = document.querySelector("#timeRemaining");
timeLeft.innerText = `Time Remaining: ${minutes
.toString()
.padStart(2, 0)}:${seconds.toString().padStart(2, 0)}`;
}

function countDown() {
inputTime--;
if (inputTime >= 0) {
displayTime(inputTime);
}

if (inputTime === 0) {
playAlarm();

if (changeBgColor) {
changeColor();
changeBgColor = false;
}

clearInterval(timer);
timer = null;
}
}

function changeColor() {
const bgColor = document.querySelector("div");
bgColor.classList.add("myBgColor");
}
/*
the the value for time remaining
check its a valid time (greater than 00:00)
decrease value of time remaining by 1 sec for each sec that passes
*/

// DO NOT EDIT BELOW HERE

Expand All @@ -23,3 +79,31 @@ function pauseAlarm() {
}

window.onload = setup;

/*
Given the user has entered a number in the input field When the user clicks the “Set Alarm” button Then the “Time Remaining” title should update to show the entered number in mm:ss format
take value from in input field and store it in a variable inputTime
check inputTime value is within the accepted range?
take variable inputTime and display it in time remaining section


Given the alarm is set with a valid time When one second passes Then the “Time Remaining” title should decrement by 1 second
the the value for time remaining
check its a valid time (greater than 00:00)
decrease value of time remaining by 1 sec for each sec that passes

Given the alarm is set with a time of 00:00 When the timer reaches 00:00 Then the alarm sound should play continuously
check time remaining, if it is equal to 00:00 then sound alarm


Given the alarm sound is currently playing When the user clicks the “Stop Alarm” button Then the alarm sound should stop playing
check if stop alarm button has been pressed
if true then check if alarm sound is playing then stop alarm sound if true

Given the alarm is set with a time of 00:10 When the timer reaches 00:00 Then the background color should change And the alarm sound should play
if inputTime is 00:10 and timer reaches 0 the change background color
play alarm sound

Given the user has not set an alarm When the page first loads Then the “Time Remaining” title should show 00:00 And no alarm sound should play
when page loads time remaining should 0 and no alarm sound should play
*/
2 changes: 1 addition & 1 deletion Sprint-3/alarmclock/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<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
4 changes: 4 additions & 0 deletions Sprint-3/alarmclock/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,10 @@
transform: translate(-50%, -50%);
}

.myBgColor {
background-color: #f0f8ff;
}

#alarmSet {
margin: 20px;
}
Expand Down