LONDON | MAY 2025 | JESUS DEL MORAL | SPRINT3 | ALARM CLOCK by delmorallopez · Pull Request #671 · CodeYourFuture/Module-Data-Groups

delmorallopez · 2025-07-21T18:46:10Z

PR of AlarmClock exercise, include 3 files:

alarmclock.js
alarmclock.test.js
alarmclockapp.html

I setup the option to change the colour background when the timer reach zero

cjyuan

After the user clicks the "Set Alarm" button, there is a one second delay before the clock starts counting down. For example, if the input is 1, then the alarm will only sound 2 seconds after the user clicks the "Set Alarm" button. Can you address this issue?
Branch is not clean. Can you revert the change made in the quote-generator folder?

cjyuan · 2025-07-26T12:47:53Z

+timeSetup = document.querySelector("#alarmSet"); // Access to alarmset
+
+timeCountdown = document.querySelector("#timeRemaining"); // Access to timeRemaining


Where did you first declare these two variables?

I declared at the begining, before setAlarm function()

Lines 1 and 3 are not "variable declaration"; they are merely two assignment statements.
Line 5 is a variable declaration.

cjyuan · 2025-07-26T12:53:27Z

+  const minutes = String(Math.floor(totalSeconds / 60)).padStart(2, "0");
+  const seconds = String(totalSeconds % 60).padStart(2, "0");
+
+  timeCountdown.innerText = `Time Remaining: ${minutes}:${seconds}`;


If input is an invalid number, we should avoid changing the clock display (and then immediately replace the clock display by another text (at line 24).

Line 24 has been modified, if is an invalid number, the display clock won't change

if (isNaN(totalSeconds) || totalSeconds <= 0) {
timeCountdown.innerText = "Time Remaining: 00:00"; // Return if the input is not a number or less than or equal to 0
return;
}

cjyuan · 2025-07-26T12:57:01Z

+let countdownInterval; // Variable to setup to 0 the countdown
+
+function setAlarm() {
+  const totalSeconds = parseInt(timeSetup.value, 10);


Without sanitizing the input, the display could get corrupted.

I validate the input

const rawInput = timeSetup.value.trim(); // Remove surrounding spaces
const totalSeconds = parseInt(rawInput, 10);

// Validate the input
if (isNaN(totalSeconds) || totalSeconds < 0) {
timeCountdown.innerText = "Please enter a valid number of seconds.";
document.body.style.backgroundColor = "";
return;
}

cjyuan

These two issues still have not yet been addressed:

After the user clicks the "Set Alarm" button, there is a one second delay before the clock starts counting down. For example, if the input is 1, then the alarm will only sound 2 seconds after the user clicks the "Set Alarm" button. Can you address this issue?
Branch is not clean. Can you revert the change made in the quote-generator folder?

cjyuan · 2025-07-27T21:24:59Z

+timeSetup = document.querySelector("#alarmSet"); // Access to alarmset
+
+timeCountdown = document.querySelector("#timeRemaining"); // Access to timeRemaining


Lines 1 and 3 are not "variable declaration"; they are merely two assignment statements.
Line 5 is a variable declaration.

cjyuan · 2025-07-27T21:30:23Z

+  const minutes = String(Math.floor(totalSeconds / 60)).padStart(2, "0");
+  const seconds = String(totalSeconds % 60).padStart(2, "0");
+
+  timeCountdown.innerText = `Time Remaining: ${minutes}:${seconds}`;


If you define updateDisplay() with a parameter (and define it in the outer scope), you could replace these three lines of code with a function call.

I called the function updateDisplay() passing the parameter -- updateDisplay(totalSeconds);
I declarated the variable total second in the outer scope, its working fine

cjyuan · 2025-07-27T21:34:02Z

+   const updateDisplay = () => {
+   const minutes = String(Math.floor(totalSeconds / 60)).padStart(2, "0");
+   const seconds = String(totalSeconds % 60).padStart(2, "0");
+   timeCountdown.innerText = `Time Remaining: ${minutes}:${seconds}`;
+};
+
+    updateDisplay(); // Show first tick instantly   
+
+    countdownInterval = setInterval(() => {
+      totalSeconds--;
+
+      if (totalSeconds < 0) {
+        clearInterval(countdownInterval);
+        timeCountdown.innerText = "Time's up!";
+        document.body.style.backgroundColor = "#ff4c4c";
+        playAlarm();
+        return;
+      }
+
+      updateDisplay();
+    }, 1000);
+  }


Can you improve the indentation of this code?

cjyuan · 2025-07-27T21:48:57Z

+
+  // Validate the input
+  if (isNaN(totalSeconds) || totalSeconds < 0) {
+    timeCountdown.innerText = "Please enter a valid number of seconds.";


Did you ever see your app displaying ""Please enter a valid number of seconds."? (If not, it may imply the code is not needed)

What does the function setAlarm() do? (It currently does not actually set any alarm)
The code that actually set the alarm is in startCountDown().

If you combine the code in setAlarm() and the code in startCountDown(), you should discover some redundant code.

I modified setalarm(), where the function will call updateDisplay()....
No redundancy code now!

I commited the last changes....

I am struggling to changes made in the previous commit in order to remove the quote generator files... I will ask for help on Saturday to a volunteer

cjyuan · 2025-07-28T17:15:03Z

+function startCountdown() {
+  let totalSeconds = isValidInput(timeSetup.value);
+
+  if (totalSeconds === null) {
+    timeCountdown.innerText = "Time Remaining: 00:00";
+    return;
+  }
+
+  clearInterval(countdownInterval); // Stop previous countdown
+  updateDisplay(totalSeconds);      // Show first tick immediately


You can consider implementing startCountdown() in the following way:

function startCountDown(totalSeconds) { // take a parameter // Delete the code on lines 32-38, 40 (The code in setAlarm() has performed those tasks) .. }

Then instead of calling startCountDown() on line 65, call it at the end of setAlarm() with the appropriate argument.

cjyuan

I just noticed currently when the timer reaches zero, the alarm will only sound 1 second later (and not immediately). Can you address this issue?

cjyuan · 2025-07-30T14:53:43Z

+  }
+
+  startCountdown(totalSeconds); // Start the countdown timer
+  updateDisplay(totalSeconds);


You are already calling updateDisplay() in startCoutndown(). There is no need to call it again.

delmorallopez · 2025-07-30T17:46:57Z

I moved the totalSeconds-- after the if check. That way, when totalSeconds reaches 0, the alarm triggers immediately.

cjyuan · 2025-07-30T20:59:32Z

Did you push you changes to GitHub?

delmorallopez · 2025-07-30T21:11:26Z

The changes has been pushed

cjyuan · 2025-07-30T22:25:35Z

The latest copy of the file you pushed to GitHub looks like an older version of the file. The recent changes you made are all gone. The current version is like the first version I reviewed. Can you double check to see if you have submitted the correct file?

delmorallopez · 2025-07-31T17:24:29Z

Last commit has been uploaded, I am sorry @cjyuan

cjyuan · 2025-08-01T12:03:15Z

Changes look good. Well done

cjyuan · 2025-08-01T12:05:28Z

+  if (!/^\d+$/.test(trimmed)) return null;

+  const num = Number(trimmed);
+  return num > 0 ? num : null;


I think NaN is better than null because NaN is also of type number.

delmorallopez added 2 commits July 21, 2025 19:34

Sprint3-alarmclock

f622d48

Sprint3-AlarmClock

d23f10a

delmorallopez added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jul 21, 2025

Sprint3/quote-generator

712efa4

cjyuan reviewed Jul 26, 2025

View reviewed changes

cjyuan added Reviewed Volunteer to add when completing a review with trainee action still to take. and removed Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. labels Jul 26, 2025

Sprint3-alarmaclock-review

92881f4

delmorallopez added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jul 27, 2025

cjyuan reviewed Jul 27, 2025

View reviewed changes

cjyuan removed the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jul 27, 2025

Sprint-3/alamarclock-review

b41e30b

delmorallopez added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jul 28, 2025

cjyuan reviewed Jul 28, 2025

View reviewed changes

cjyuan removed the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jul 28, 2025

Sprint3-alamarclock/Review

7cc8268

delmorallopez added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jul 28, 2025

Quote-generator-remove

f641ff3

cjyuan reviewed Jul 30, 2025

View reviewed changes

cjyuan removed the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jul 30, 2025

delmorallopez added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jul 30, 2025

Sprint3-Alarmclock-Review

49aeb27

Sprint3-Alarmclock/Review

3886e8c

cjyuan reviewed Aug 1, 2025

View reviewed changes

delmorallopez mentioned this pull request Aug 6, 2025

Step 3 Submission delmorallopez/My-Coursework-Planner#82

Open

illicitonion closed this Sep 1, 2025

		timeSetup = document.querySelector("#alarmSet"); // Access to alarmset

		timeCountdown = document.querySelector("#timeRemaining"); // Access to timeRemaining

Uh oh!

Conversation

delmorallopez commented Jul 21, 2025

Uh oh!

cjyuan left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

cjyuan left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

cjyuan Jul 27, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

delmorallopez Jul 28, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

cjyuan Jul 28, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

cjyuan left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

delmorallopez commented Jul 30, 2025

Uh oh!

cjyuan commented Jul 30, 2025

Uh oh!

delmorallopez commented Jul 30, 2025

Uh oh!

cjyuan commented Jul 30, 2025

Uh oh!

delmorallopez commented Jul 31, 2025

Uh oh!

cjyuan commented Aug 1, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

cjyuan Jul 27, 2025 •

edited

Loading

delmorallopez Jul 28, 2025 •

edited

Loading

cjyuan Jul 28, 2025 •

edited

Loading

cjyuan left a comment •

edited

Loading