mcElapsedTime Component

Elapsed time sec =>   days hr min sec

Elapsed time sec =>   days hr min sec


The mcElapsedTime Component You can examine the source for this file to see exactly how the controls above were implemented.

Basic usage - Display Code | Callback | Disable | Method Summary | IE8 Failure and Fix

Basic usage - Display

The component display is implemented in html as The unique field IDs are based on a common string plus qualifiers. This string is passed to the constructor when the object is initialized. If it is omitted, then the default value of mcElapsed_time is used. This following example shows the fields placed is a table. The min & max values are one wider than normal (for minutes and seconds, -1 to 60 instead of 0 to 59) to allow the mouse wheel to add & subtract to/from the next higher position. The associated code ensures that those out-of-range values are never displayed.

Basic usage - Code

Javascript adds functionality to the component, style sheets provide the sunken look and color the background when the component is disabled.


Once the user (or software) has changed the value, the object will call the function specified via the constructor. In the example below, If a callback function is not specified, the code checks to see if mcElapsed_Time_Callback is defined and, if present, uses that. When there are multiple components, each one can (and probably should) have its own callback. However, callback functions are optional, not required. (This page does not have one.)


The example above provides buttons to disable and enable the component. As you can see, the calls are very straight forward.

Method Summary

IE8 Failure and Fix

I used the prototype technique to create objects because the more advanced methods would not work in IE8 - apparently, this technique also fails. According to Microsoft, the prototype property was not supported before IE 11 (Windows 8.1)! The following fixes the problem in IE8, but I have no way of testing it in other IE browsers

Author: Robert Clemenzi
URL: http:// / Languages / Javascript / mcElapsedTime_Component.html