This is a clock. Its basic purpose is to show the time, but it does more than that. It also functions
an alarm clock, signalling when any one of multiple alarms goes off. See the section below on Alarm Sets.
When using alarms there is also the option of countdown mode, where the time until the next alarm triggering
is displayed, counting down instead of up, rather than the actual time.
Alarms
Setting an alarm will cause the clock to signal when it expires. Signalling involves flashing the screen and
optionally a custom sound. Alarms can be set up on the configuration Alarm screen. Alarms take a time in
24-hour hh:mm:ss format, and can be defined to be one-time or to renew every day. They can also be enabled
or disabled, allowing a user to define a bunch of times and only enable those that are important.
Alarms are also grouped into alarm sets. An alarm set is several alarms defined together so they can
be enabled or disabled as a group. This app was written to time classes in my school, I have defined
different alarm sets for the different schedule the school has - 8th grade, 6th grade, half days... When
an alarm set is enabled all the active alarms in it are enabled at once. The alarm set is set in the dropdown
on the Alarm config page. There is a special alarm set called
default. These alarms are set at system
startup, and have the added feature that they can be defined to be one-time, in which case they will
quietly delete themselves after going off once. Alarms can optionally have names. If they do the name will
be displayed for the next alarm scheduled.
Config options
Configuration is nested like CSS is. The current alarms is checked first for the value, then
the alarm set, and finally the base configuration. Options set to "inherit" for the alarms or
alarm sets defer their value to the parent one.
- Foreground: the foreground color
- Background: the background color
- Seconds: display (or not) the seconds field
- Count down: if alarms are set count down to the next alarm rather than going forward
- Display: 12 hour or 24 hor format. (AM and PM are not displayed in 12-hour format)
- Font: Select the font to use for display. (monospaced fonts work best)
- Bold: Use the bold version of the font, if available
- Refresh: The number of milliseconds to wait between screen updates. If this were set to
1000 (one refresh a second) it would possibly skip a second, and be inaccurate by up to a seconds.
Setting it too small will slow your browser down. Default is 300ms, about 3 updates per second.
- Fudge: On my school chromebook I found the clock ran late by about 1.5 seconds. This is
particularly obvious when the school bell rings before the clock says it should. The fudge factor
is added to the system time to get a better estimate of the true time. For my school
chromebook, setting this to 1500 (1.5 seconds) makes it run just right
Changes made in this box are implemented immediately. The actions are:
- save config: Writes just these config values in local machine storage. If this
is done the current values will be loaded on next startup. Otherwise changes will be lost
next time the user opens the app
- restore config: Restores just the base configuration values to the last saved state
- save all: Writes the whole configuration, including the state of alarm sets and alarms
- close: Closes the modal window
Alarm options
This allows setting multiple alarms. All defined alarms are listed, they can be edited,
deleted by clicking the "-" button preceding the definition, or added by using the "+"
button. The currrent alarm set is shown at the top of the box on the left. Changing the
value in the dropdown will change the active alarm set (logically this should be, and
can be, done on the
Alarm Set page, but it is convenient to allow it here too)
The fields are:
- -: delete the alarm defined on the current line
- time:
The time the alarm is set to go off (uses 24-hour time for input). It is
allowed but not required to supply HH:MM:SS, but if :SS or :HH:SS are given 0 is used
for the missing fields
- active: if not set the alarm is ignored.
- keep: (only for alarms in the default alarm set) delete the alarm once it has passed.
If checked 24 hours will be added to it and it will be saved for the next day
- bell: the bell to ring when the alarm goes off. The 2 predefined bells ('ding'
and 'bzzzt') are available, as well as 2 special choices, "(none)" and "(default)".
"(none)" will not ring a bell when the alarm goes off, and "(default)" will use the
value configured for Alarm.ding.
- warning: If a number the background will change color that many minutes before the
alarm goes off. If set to "none" it will not change color, if to inherit it will default
to the value for the alarm set
The actions are:
- applyChanges made to the alarms in the alarm table do not immediately take effect.
Once all changes are made click the apply button to update the app
- restoreRestores all alarm definitions to the last saved state
- save all: Writes the whole configuration, including the state of alarm sets and alarms
- closeCloses the modal window
Alarm Set options
The alarm set page lets you choose and manipulate the active alarm set. The set can be
changed by clicking on the desired set in the box on the left. The sections on the right
perform actions.
The top section contains 2 actions that take no arguments:
- restore all: puts the alarm sets back to the state stored locally
- delete: deletes the current alarm sets and all its alarms
The second section contains the two parameters that can be set for each alarm set,
and the button to press to update the values. It is applied dynamically, no button needs
to be pressed to apply the changes. The options are:
- bell: the default bell value for the alarm set. This value is used for all
alarms in the set whose own bell value is set to inherit. Any individual alarm
with a different value set will override this value. A value of inherit means
that it will use the standard system value.
- warning: number of minutes before an alarm going off to display a heads-up
warning. This is currently a yellow background and is not (yet) configurable. Values
from 0 to 5 minutes are offered, along with (none). The value sets holds for all
alarms in the set who have their own warning set to inherit, others override it
with their own values
The third section contains buttons which operate on the active alarm set. They may use a new
name entered in the input field. The options are:
- create: Creates a new, empty alarm set with the values those in the above config
fields. The name must be entered in the input field or else the button is ignored.
- rename: renames the active alarm set to the name given in the input field
- copy: copies the active alarm set to the name given in the input field, or if
none is given generate one based on the active set's name
Keyboard shortcuts
There are a few keyboard shortcuts defined to make using the clock more convenient. These include:
- (space): toggle countdown mode
- u, UpArrow: set Clock mode (count up)
- d, DownArrow: set Timer mode (count down to next alarm)
- Ctrl-A: open the Alarm configuration page
- Ctrl-C: open the configuration page
- Ctrl-H: open the help popup
- Ctrl-S: change the active alarm set
- 1: set the clock in 12-hour mode
- 2: set the clock in 24-hour mode (military time)
- (escape) or (enter): close the configuration page
- ? or ctrl-?: open the shortcut help popup
Startup
There are startup options that make it possible to jump straight to many common configurations.
They are:
- ?up: force the clock to start in up mode, counting up like a regular clock
- ?down: force the clock to start in down mode, counting down like a timer to each
alarm (only if any alarms are set)
- ?curtis: include the standard Curtis Middle School schedule (only needed the first time
if you press save all on the AlarmSet page, which will save your current configuration
so it is loaded by default on startup)
- ?set=SETNAME: load the alarm set given by SETNAME. The set default
is normally activated first.
- ?noread:do not read the locally stored configuation at startup