Skip to content

Sheffield|May-2025|Sheida Shabankari|Module-Data -Groups| Sprint-3|Alarm Clock #631

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
wants to merge 15 commits into
base: main
Choose a base branch
from
+6,725 −3
Open

Sheffield|May-2025|Sheida Shabankari|Module-Data -Groups| Sprint-3|Alarm Clock #631

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
15 commits
Select commit Hold shift + click to select a range
abdcbfd
Rename Title,Get elements , Try to get the input
sheida-shab Jul 16, 2025
3e2debe
updating the time remaining content
sheida-shab Jul 16, 2025
32f9d24
implement function updateDisplayTime
sheida-shab Jul 16, 2025
55f13a4
add and testing interval
sheida-shab Jul 16, 2025
a674f0b
using interval function to count down the seconds
sheida-shab Jul 16, 2025
e2eb3bb
change the background color of page and the stop button
sheida-shab Jul 16, 2025
244219b
some little changes
sheida-shab Jul 16, 2025
8d01d83
flash page color using set interval and global var
sheida-shab Jul 16, 2025
35c72e7
checked all test cases and passed
sheida-shab Jul 16, 2025
5879ef2
delete repeated functions and fix the bug of click set button multip…
sheida-shab Jul 18, 2025
f589b5e
replace var with let
sheida-shab Jul 18, 2025
380fa7e
declare variables min and sec as const
sheida-shab Jul 18, 2025
dcd9cfc
fix global variable declaration
sheida-shab Jul 20, 2025
a3cf780
fix indentation
sheida-shab Jul 20, 2025
d718785
Revert the quotes.js changes
sheida-shab Jul 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
45 changes: 44 additions & 1 deletion Sprint-3/alarmclock/alarmclock.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,36 @@
function setAlarm() {}
let flashColor, secondsInterval;
Copy link
Contributor

Choose a reason for hiding this comment

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

Since they both hold interval ID, can you keep the naming convention consistent?

Note: When I first saw the name flashColor, I cannot figure out the purpose of the variable.


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

const inputTime = parseInt(userInput.value);
if (inputTime <= 0 || isNaN(inputTime)) {
alert("invalid input!!!");
return;
}

clearInterval(secondsInterval);
clearInterval(flashColor);
pauseAlarm();
let remainingTime = inputTime;
updateDisplayTime(remainingTime);

secondsInterval = setInterval(() => {
remainingTime--;
updateDisplayTime(remainingTime);
if (remainingTime === 0) {
clearInterval(secondsInterval);
playAlarm();
}
}, 1000);
}

function updateDisplayTime(inputTime) {
const timeRemain = document.getElementById("timeRemaining");
const min = String(Math.floor(inputTime / 60)).padStart(2, "0");
const sec = String(inputTime % 60).padStart(2, "0");
timeRemain.textContent = `Time Remaining: ${min}:${sec}`;
}
// DO NOT EDIT BELOW HERE

var audio = new Audio("alarmsound.mp3");
Expand All @@ -16,10 +47,22 @@ function setup() {

function playAlarm() {
audio.play();
document.getElementById("stop").style.backgroundColor = "rgb(191, 115, 47)";
document.body.style.backgroundColor = "rgb(218, 178, 119)";
flashColor = setInterval(() => {
if (document.body.style.backgroundColor === "rgb(218, 178, 119)") {
document.body.style.backgroundColor = "white";
} else {
document.body.style.backgroundColor = "rgb(218, 178, 119)";
}
}, 500);
}

function pauseAlarm() {
audio.pause();
document.getElementById("stop").style.backgroundColor = "rgb(239, 239, 239)";
clearInterval(flashColor);
document.body.style.backgroundColor = "white";
}

window.onload = setup;
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
2 changes: 1 addition & 1 deletion Sprint-3/alarmclock/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
"homepage": "https://github.com/CodeYourFuture/CYF-Coursework-Template#readme",
"devDependencies": {
"@testing-library/dom": "^8.19.0",
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/jest-dom": "^5.17.0",
"@testing-library/user-event": "^13.5.0",
"jest": "^29.2.2",
"jest-environment-jsdom": "^29.2.2"
Expand Down
Loading