UIZE JavaScript Framework

JAVASCRIPT EXAMPLES Digital Clock

In this example, an instance of the Uize.Widgets.DigitalClock.Hms.Widget widget class is being wired up to create a classic LED style digital clock, with two digit display for hours, minutes, and seconds.

The Uize.Widgets.DigitalClock.Hms.Widget widget relies on the Uize.Widgets.SegmentDisplay.Seven.Widget widget class for displaying the digits of the time. The widget creates six seven segment display widgets - two for the hours display, two for the minutes display, and two for the seconds display.

After the clock widget is created, a timer/interval is started that updates the clock's time every second. Now, because the clock is always updated to the current time when the updater function is triggered by the timer, the clock remains accurate and doesn't drift. The timer may be unreliable as a result of load on the computer, but the worst that will happen is that the clock may not update for a while before once again updating to the correct time.