Clock Project

Link to The Working Project

Description

Overview

This is a real time clock application. The time is based on the time zone of the device viewing the page. It displays the current time, day of the week, and date. There are options to display a settings page and a calendar.

Settings

The settings page is a draggable popup window that allows the user to change the background or text color of the page. There is a grid of colors to pick from or a user can enter a custom hex value for a color option. The settings page also provides a switch to change the time format between a 12 hour and 24 hour format. The clock will display the current format at the bottom of the page.

Calendar

The calendar is a draggable pop up window. There are buttons to show previous and future months. There is also a today button to take the user back to the current month. The calendar will display a full month view with dates from previous and future months grayed out. The current day is highlighted in red on the calendar.

Slideshow Gallery

Video Demo