Stopwatch Element

An element usable as part of FAPI that shows a box fill up or empty out within a configurable time. Also, on submit of a form with this element, the time elapsed will be available in the values sub array of the form state.

It uses jQuery UI's progress bar to visually represent a stopwatch on your form, so chances are it will sit well with your theme too.

You would use this element in your form as you would use other elements. Here's an example:

$form['my_awesome_stopwatch'] = array(
  '#type' => 'stopwatch_element',
  // How long the timer is set for
  "#stopwatch_element_timespan_secs" => 30,
  // Count up to the time or down from it
  "#stopwatch_element_countdown" => TRUE,
);

This looks like this:

Submitting a form with this yields a $form_state array with an entry for stopwatch_element_elapsedseconds which will contain the number of seconds elapsed from form load to form submit.

Splendid! See you on the issue queue!