home *** CD-ROM | disk | FTP | other *** search
/ CD Actual Thematic 7: Programming / CDAT7.iso / Share / Java / ScriptBuilder / NOSB30_TRIAL.exe / data1.cab / Program_Files / CompLib / DigitalClock / DigitalClock.js < prev    next >
Encoding:
JavaScript  |  1998-10-05  |  9.6 KB  |  259 lines
  1. /* ======================================================================
  2. OBJECT:            com_netobjects_DigitalClock
  3.  
  4. PLATFORMS:        Netscape Navigator 4.01 or higher, 
  5.                     Microsoft Internet Explorer 4.02 or higher
  6.  
  7. DESCRIPTION:    This object displays a digital clock.  The clock digits are
  8.                     represented as individual graphics which the object updates.
  9.                     Image names referenced for individual digits are:
  10.  
  11.                     Digits 0-9:  digitx.gif, where x is 0-9
  12.                     "AM" graphic: digitam.gif
  13.                     "PM" graphic: digitpm.gif
  14.                     Colon image: colon.gif, used for separating hours and minutes, e.g. hh:mm
  15.                     Digit placeholder: digit_.gif, where this graphic has the same background 
  16.                                              and is the same size as the other digit images.  This image
  17.                                              is used as a placeholder for the first hour digit when
  18.                                              the hour is only a single digit, e.g. 1:30.
  19.                     
  20.                       To change the graphics used by the clock, simply replace each of the 
  21.                     14 graphics mentioned in the list above - USE THE SAME FILE NAMES.
  22.  
  23.                     The clock can display 12 or 24 hour time.  For 12 hour time, an am/pm 
  24.                     graphic is added. Note that changing the mode of the clock requires a 
  25.                     reload of the page before 12/24 hour time or displaying/hiding seconds 
  26.                     can be changed on the page itself.
  27. ====================================================================== */
  28. function com_netobjects_DigitalClock(params) {
  29.  
  30.    // Public Properties    
  31.     this.name                 = (params.name != null) ? params.name : "";
  32.     this.testMode            = (params.testMode != null) ? params.testMode : "off";
  33.  
  34.     this.is12hours            = (params.is12hours == "24 Hour") ? false : true;
  35.  
  36.     // Private Properties
  37.     this.colonImagePrefix    = "colon";
  38.     this.imagePrefix            = "digit";
  39.     this.imageExt                = ".gif";    
  40.     this.imageArray            = new Array();
  41.     this.timerID                = null;
  42.     this.rotateNo                = 0;
  43.     this.hh1                        = 0;
  44.     this.hh2                        = 0;
  45.     this.mm1                        = 0;
  46.     this.mm2                        = 0;
  47.     this.ampm                    = "am";
  48.  
  49.     // Public Methods
  50.     this.render             = _digitalclock_render;
  51.     this.start                 = _digitalclock_start;
  52.     this.stop               = _digitalclock_stop;
  53.  
  54.     // Private Methods
  55.     this.validateProperties = _digitalclock_validateProperties;
  56.     this.getDigits                = _digitalclock_getDigits;
  57.  
  58.     // Public Events
  59.     this.onError             = _digitalclock_onError;
  60.     this.onAbort             = _digitalclock_onAbort;
  61.     this.onLoad              = _digitalclock_onLoad;
  62.     this.onRender              = _digitalclock_onRender;
  63.     this.onStart            = _digitalclock_onStart;
  64.     this.onStop             = _digitalclock_onStop;
  65.     this.onRotateImage     = _digitalclock_onRotateImage;
  66.  
  67.     // Private Events (internal event driven functionality)
  68.  
  69.     // Validate object properties when test mode is on
  70.     this.validateProperties();
  71.  
  72.  
  73.     // Public Methods ----------------------------------------
  74.  
  75.     /* ======================================================================
  76.     
  77.    METHOD: _digitalclock_render.  Renders the clock in HTML.
  78.     
  79.     ====================================================================== */
  80.     function _digitalclock_render() {
  81.         // Initialize Variables
  82.         sBorder     = "";
  83.         eError     = "";
  84.         eAbort     = "";
  85.         eLoad     = "";
  86.         
  87.         // Set Variables
  88.         sBorder = " BORDER=0";
  89.     
  90.         // Build Nav & IE shared Image events
  91.         eError         = " onerror=\"" + this.name + ".onError();\""
  92.         eAbort         = " onabort=\"" + this.name + ".onAbort();\""
  93.         eLoad         = " onload=\"" + this.name + ".onLoad();\""
  94.         eImgEvents    = eError + eAbort + eLoad;
  95.  
  96.         // Set the hours, minutes properties
  97.         this.getDigits(true);         
  98.  
  99.         // Write IMG tags
  100.         document.writeln("<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0><TR>");
  101.        document.writeln("<TD><IMG NAME='Img_hh1' SRC='" + this.imagePrefix + this.hh1 + this.imageExt + "' " + sBorder + eImgEvents + "></TD>");
  102.        document.writeln("<TD><IMG NAME='Img_hh2' SRC='" + this.imagePrefix + this.hh2 + this.imageExt + "' " + sBorder + eImgEvents + "></TD>");
  103.         document.writeln("<TD><IMG SRC='" + this.colonImagePrefix + this.imageExt + "'></TD>");    // write out a colon every 2 digits, e.g. hh:mm:ss
  104.        document.writeln("<TD><IMG NAME='Img_mm1' SRC='" + this.imagePrefix + this.mm1 + this.imageExt + "' " + sBorder + eImgEvents + "></TD>");
  105.        document.writeln("<TD><IMG NAME='Img_mm2' SRC='" + this.imagePrefix + this.mm2 + this.imageExt + "' " + sBorder + eImgEvents + "></TD>");
  106.  
  107.         // For 12-hour mode, write out the AM or PM graphic
  108.         if (this.is12hours)
  109.             document.writeln("<TD><IMG NAME='Img_ampm' SRC='" + this.imagePrefix + this.ampm + this.imageExt + "' " + sBorder + eImgEvents + "></TD>");
  110.         document.writeln("</TABLE>");
  111.     
  112.         // Start animation
  113.         this.start();
  114.  
  115.         // Fire public events
  116.         this.onRender(); 
  117.     } // END _digitalclock_render
  118.  
  119.     /* ======================================================================
  120.     
  121.    METHOD: _popupwindow_start.  Starts the timed updates of the clock.  The
  122.     clock is checked to see if it needs to be updated every second.
  123.     The clock graphics are updated every minute.
  124.     
  125.     ====================================================================== */
  126.     function _digitalclock_start(refresh) {
  127.         var rotated = false;
  128.         this.rotateNo++;
  129.         if (refresh+"" == "undefined" || refresh == null)
  130.             refresh = false;
  131.  
  132.         oldmm2 = this.mm2;                
  133.         // Update clock images every minute, which is whenever the current minute, this.mm2, has changed from its previous value
  134.         this.getDigits(refresh);
  135.         if (refresh || (this.mm2 != oldmm2)) {
  136.             eval("window.document.Img_hh1.src=\"" + this.imagePrefix + this.hh1 + this.imageExt + "\"");    
  137.             eval("window.document.Img_hh2.src=\"" + this.imagePrefix + this.hh2 + this.imageExt + "\"");        
  138.             eval("window.document.Img_mm1.src=\"" + this.imagePrefix + this.mm1 + this.imageExt + "\"");        
  139.             eval("window.document.Img_mm2.src=\"" + this.imagePrefix + this.mm2 + this.imageExt + "\"");
  140.             if (this.is12hours)        
  141.                 eval("window.document.Img_ampm.src=\"" + this.imagePrefix + this.ampm + this.imageExt + "\"");
  142.             rotated = true;
  143.         }
  144.  
  145.         window.clearTimeout(this.timerID);
  146.         // Set the JavaScript timer to re-execute this function every second
  147.         this.timerID = window.setTimeout(this.name + ".start()", 1000);
  148.  
  149.         // Fire public events
  150.         if (this.rotateNo == 1) 
  151.             this.onStart(); 
  152.         if (rotated)
  153.             this.onRotateImage();
  154.     } // END _digitalclock_start
  155.     
  156.     /* ======================================================================
  157.     
  158.    METHOD: _digitalclock_start.  Stops the JavaScript timer, and therefore
  159.     will stop the clock.  Note that when the clock is restarted, it will always
  160.     reload the current, correct time.
  161.     
  162.     ====================================================================== */
  163.     function _digitalclock_stop() {
  164.         window.clearTimeout(this.timerID);
  165.         this.rotateNo = 0; 
  166.  
  167.         // Fire public events
  168.         this.onStop(); 
  169.     } // END _digitalclock_stop
  170.  
  171.  
  172.     // Private Methods ----------------------------------------
  173.  
  174.     /* ======================================================================
  175.     
  176.    METHOD: _digitalclock_validateProperties.  Used only in test mode.  Writes out
  177.     error and warning messages if some property values are set with bad
  178.     values.
  179.     
  180.     ====================================================================== */
  181.     function _digitalclock_validateProperties() {
  182.         if ((this.testMode.toLowerCase() == "text") || (this.testMode.toLowerCase() == "alerts")) {
  183.             var errors = new Array();
  184.           iIndex = 0;  
  185.          
  186.             // Check for errors
  187.             if (this.name == "") 
  188.                 errors[iIndex++] = "Name is a required property.";  
  189.  
  190.             // Display errors
  191.             for (var i=0; i<errors.length; i++)  {
  192.                 if (this.testMode.toLowerCase()    == "text") 
  193.                       document.write( "<BR><HR><B><FONT COLOR=RED>TEST MODE, com_netobjects_DigitalClock, '" + this.name + "' : </FONT> " + errors[i] + "</B><HR>\n");
  194.                 else
  195.                       alert("TEST MODE, com_netobjects_DigitalClock, '" + this.name + "' : " + errors[i]);
  196.             }            
  197.         } 
  198.     } // END _digitalclock_validateProperties
  199.  
  200.  
  201.     /* ======================================================================
  202.     
  203.    METHOD: _digitalclock_getDigits.  Gets the current time and parses out the
  204.     individual digits for the hours and seconds.  Sets object properties to store
  205.     the parsed digits.
  206.     
  207.     ====================================================================== */
  208.     function _digitalclock_getDigits(init) {
  209.         rightNow = new Date();
  210.         hh = rightNow.getHours();
  211.         mm = rightNow.getMinutes()+"";
  212.         seconds = rightNow.getSeconds();
  213.  
  214.         // Only update properties every minute, or if this is the first
  215.         // time the function is called, as flagged by the init parameter.
  216.         if (seconds == 0 || init) {        
  217.             this.ampm = "am";
  218.             // If hours == 12, it's noon so set PM
  219.             if (hh == 12)
  220.                 this.ampm = "pm";
  221.             // if hours == 0, it's midnight so set to 12 hours for string parsing below
  222.             if (this.is12hours && (hh == 0))
  223.                 hh = 12;
  224.             // Convert 24-hour time to 12-hour am/pm time
  225.             if (this.is12hours && (hh / 12 > 1)) {
  226.                 hh = (hh % 12);
  227.                 this.ampm = "pm";
  228.             }
  229.             hh += "";    // convert to string
  230.             this.hh1 = (hh.length == 1) ? "_" : hh.charAt(0);
  231.             this.hh2 = (hh.length == 1) ? hh.charAt(0) : hh.charAt(1);
  232.             this.mm1 = (mm.length == 1) ? "0" : mm.charAt(0);
  233.             this.mm2 = (mm.length == 1) ? mm.charAt(0) : mm.charAt(1);
  234.         } // end if
  235.     } // END _digitalclock_getDigits
  236.     
  237.  
  238.     // Public Event Handlers ----------------------------------------
  239.  
  240.     // Default handlers for each event, which can be overridden in the calling page.
  241.     function _digitalclock_onError() {
  242.     }
  243.     function _digitalclock_onAbort() {
  244.     }
  245.     function _digitalclock_onLoad() {
  246.     }
  247.     function _digitalclock_onRender() {
  248.     }
  249.     function _digitalclock_onStart() {
  250.     }
  251.     function _digitalclock_onStop() {
  252.     }
  253.     function _digitalclock_onRotateImage() {
  254.     }
  255.   
  256. } // END CONSTRUCTOR com_netobjects_DigitalClock
  257.  
  258.  
  259.