Skip to content
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.

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

London 11 | Pezhman-Azizi | Data-Groups | sprint 3 | Alarm Clock #275

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
69 changes: 59 additions & 10 deletions Sprint-3/alarmclock/alarmclock.js

Choose a reason for hiding this comment

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

Your script has some duplicate code lines, please fix it. It's causing some unexpected behaviour.

Copy link
Author

Choose a reason for hiding this comment

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

Thanks very much for taking time reviewing my approach. I just removed the duplicated parts to prevent unexpected behaviors.

Original file line number Diff line number Diff line change
@@ -1,25 +1,74 @@
function setAlarm() {}
// Variables to keep track of the countdown timer
let countdownInterval; // This is where we'll store the timer ID
let remainingTime; // This keeps track of how many seconds are left

// DO NOT EDIT BELOW HERE
// This is the alarm sound
const audio = new Audio("alarmsound.mp3");

var audio = new Audio("alarmsound.mp3");
/**
* This function starts the alarm countdown
*/
function setAlarm() {
const input = document.getElementById("alarmSet").value;
remainingTime = parseInt(input, 10);

function setup() {
document.getElementById("set").addEventListener("click", () => {
setAlarm();
});
// Check if the user entered a valid number
if (isNaN(remainingTime) || remainingTime <= 0) {
alert("Hey, please type a positive number!");
return;
}

// Show the initial countdown time on the screen
updateTimeDisplay(remainingTime);

// Stop any existing countdown
clearInterval(countdownInterval);

document.getElementById("stop").addEventListener("click", () => {
pauseAlarm();
});
// Start a new countdown that updates every second
countdownInterval = setInterval(() => {
remainingTime -= 1;
updateTimeDisplay(remainingTime);

// When the timer hits 0, stop it and play the alarm
if (remainingTime <= 0) {
clearInterval(countdownInterval);
playAlarm();
}
}, 1000);
}

/**
* This function updates the countdown on the screen
* @param {number} seconds - The time left in seconds
*/
function updateTimeDisplay(seconds) {
const minutes = String(Math.floor(seconds / 60)).padStart(2, "0");
const secs = String(seconds % 60).padStart(2, "0");
document.getElementById("timeRemaining").innerText = `Time Remaining: ${minutes}:${secs}`;
}

/**
* This function plays the alarm sound
*/
function playAlarm() {
audio.play();
}

/**
* This function stops the alarm and clears the timer
*/
function pauseAlarm() {
audio.pause();
clearInterval(countdownInterval);
}

/**
* This function sets up the buttons when the page loads
*/
function setup() {
document.getElementById("set").addEventListener("click", setAlarm);
document.getElementById("stop").addEventListener("click", pauseAlarm);
}

// Run the setup function when the page is fully loaded
window.onload = setup;
2 changes: 1 addition & 1 deletion Sprint-3/alarmclock/index.html
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
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