Project 4

Due Date: Wednesday, 29 October

Individual Project

Objectives

Familiarity with

• client-side JavaScript
• DOM event handling
• JavaScript timers
• jQuery library
  

Description

In this project, you will implement a simple browser-based timer.

Functional requirements

The timer has the following controls:

• One two-digit display of the form 88.
• One multi-function button.

The timer behaves as follows:

• The timer always displays the remaining time.
• Initially, the timer is stopped and the (remaining) time is zero.
• If the button is pressed when the timer is stopped, the time is incremented by one up to a maximum of 99. (The button acts as an increment button.)
• If the time is greater than zero and three seconds elapse from the most recent time the button was pressed, then the timer beeps once and starts running.
• While running, the timer subtracts one from the time for every second that elapses.
• If the timer is running and the button is pressed, the timer stops and the time is reset to zero. (The button acts as a cancel button.)
• If the timer is running and the time reaches zero by itself (without the button being pressed), then the timer stops and the alarm starts beeping indefinitely two times a second.
• If the alarm is sounding and the button is pressed, the alarm stops sounding; the timer is now stopped and the (remaining) time is zero. (The button acts as a stop button.)
• The label of the multi-function button should indicate the current function of the button, such as increment, cancel, or stop.

Nonfunctional requirements

• All code for dynamic client-side functionality must be provided in the form of external JavaScript source files using components from the jQuery library; embedded JavaScript within XHTML documents is not permitted. Your JavaScript code should include inline comments where appropriate.
  
• All content must be valid XHTML 1.1 documents. You are advised to use a validating editor or the W3C Validation Service to ensure that your content is valid. For convenience, you may want to place a link on each document that runs the validation service on this document. Your document should state the correct document type at the top.
• All rendering styles must be provided using a single shared valid CSS2 style sheet. There must not be any rendering styles in the documents themselves. You are advised to use a validating editor or the W3C CSS Validation Service to verify that your style sheet is valid.

Grading

Total: 10 points

• Increment state /1
• Counting state /1
• Alarm state /1
• Working timers /1
• Error checking (limits checking in increment mode) /1
• Changing Label on button /1
• Visual presentation look/feel /1
• Proper separation of document, styles, and behavior /1
• Proper architecture in behavior part /1
  
• Inline comments /1
  

Submission

Please send the instructor email as soon as your project is ready to be reviewed. The date your message is received counts as the submission date. Be sure to include your departmental Linux ID in your email message.