Manchester | 25-ITP-Sep | Mahtem T. Mengstu | Sprint 3 | Alarmclock

[Mahtem]

Learners, PR Template

Self checklist

• I have titled my PR with Region | Cohort | FirstName LastName | Sprint | Assignment Title
• My changes meet the requirements of the task
• I have tested my changes
• My changes follow the style guide

Changelist

Alarm clock, implemented its index.html modified and styles added.

Questions

Question will be forwarded to slack.

[cjyuan]

Regardless of whether the input is 0 or 1, the alarm sounds 1 second later. Can you address this inconsistency?

[cjyuan]

Could consider implementing the "flashing background" effect using only CSS, and then add/remove a class to start/stop flashing.

[Mahtem]

Could consider implementing the "flashing background" effect using only CSS, and then add/remove a class to start/stop flashing.

Thank you @cjyuan, it has been implemented using only css.
function startFlashing() {
document.body.classList.add("alarm-flashing");
}

function stopFlashing() {
document.body.classList.remove("alarm-flashing");
document.body.style.backgroundColor = "white";
}

[cjyuan]

Could also consider calling resetAlarm() (even if it performs something extra).

[Mahtem]

Could also consider calling resetAlarm() (even if it performs something extra).

It has been made to reset everything completely.

[cjyuan]

Why not just write audio.pause() (without the if statement)?

[Mahtem]

Why not just write audio.pause() (without the if statement)?

Yes, it's correct... calling "audio.pause()" alone is enough and works normally.

[cjyuan]

Suggestion: Consider loading script.js as an ES module to isolate its scope from the global context as:

<script src="script.js" type="module"></script>

This ensures that variables, functions, and imports in script.js don't leak into the global namespace,
helps prevent naming conflicts, and enables the use of modern JavaScript features like import and export.

Note: With type="module", defer is automatically enforced.

[Mahtem]

Suggestion: Consider loading script.js as an ES module to isolate its scope from the global context as:

<script src="script.js" type="module"></script>

This ensures that variables, functions, and imports in script.js don't leak into the global namespace, helps prevent naming conflicts, and enables the use of modern JavaScript features like import and export.

Note: With type="module", defer is automatically enforced.

script has been updated in the index.html as :

<script src="alarmclock.js" type="module"></script>

[Mahtem]

Regardless of whether the input is 0 or 1, the alarm sounds 1 second later. Can you address this inconsistency?

Thank you @cjyuan , for pointing that out, now the alarm has been made to sound for >=1 sec.

[cjyuan]

Changes look great. Excellent work.

Suggestion: Check out what Markdown syntax is supported by GitHub (especially for embedding code and code block). You will likely need them in the future.
https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax