A friend is a teacher who needed a series of alarms to sound from a Chromebox. During the school day, he has multiple periods and he needs an audible alarm to play a short time before the end of the period so that the students are reminded to clean up before they leave for the next class. The schedule of class periods can vary from day to day and week to week, so alarm groups can be created and turned on and off.
This project uses vanilla HTML, JavaScript, and CSS. Once you have pulled the files to a folder on your local computer, the project should run without additional installation steps by pointing your browser to index.html
in that folder.
IMPORTANT: It is necessary to interact with the page so that it can make sounds. Chrome and other browsers prevent webpages from making sounds unless the user has interacted with the webpage. This is the reason for the "CHECK SPEAKERS" button.
When the browser opens the HTML file the first time, there are no alarms set.
Alarms are grouped, so first click the "+ Add Group" button (you can create a group name if you wish, but this is optional). Multiple groups can be created if desired.
Once a group is created, you can add an alarm to the group by entering a time at the "Choose a time for your alarm" prompt then clicking the "+ add alarm" button. Add more alarms if desired using this procedure.
Within a group, it is possible to select active days and to turn the group off or back on again. There is also a button to delete a group.
There's a customized version of this app deployed here.
This project is licensed using an MIT License.
See the license file for license rights and limitations.
Please feel free to contact me if you have questions or would like to contribute.
Thanks to Bimo on stackoverflow and to Carlos Delgado on ourcodeworld for guidance about making sounds.
Thanks to steelwater on codepen for day of week buttons example.
Thanks to Sooraj on DEV for suggestions about element creation.