W3C International Internationalization

parent i18n/Time/clocks

Manual for the clock applet

This manual describes how to install and configure the clock applet.

Copying and license

You are free to download and use the clock applet, without charge, provided you keep the copyright statements intact and with the code. The clock applet consists of two parts: a tz.class file (source code: tz.java) and a Clock.class file (source code: Clock.java). The former is copyright W3C. The latter is an adaptation of code provided by Sun and is therefore copyright Sun Microsystems (see inside Clock.java for the full copyright and license statement).

Using the clock in a Web page

First you must decide if you want to download the clock and install it on your own site, or if you simply want to link to it. Let's assume for the moment that you just link to them. In that case the only thing you need to add a piece of HTML similar to the one below to your own HTML page:

<APPLET CODE="tz.class"
    CODEBASE="http://www.w3.org/Protocols/Time/"
    WIDTH="81" HEIGHT="115">
  <PARAM NAME="tz" VALUE="CST">
  <PARAM NAME="country" VALUE="GB">
  <PARAM NAME="language" VALUE="en">
  <PARAM NAME="color" VALUE="0000ff">
  <PARAM NAME="textcolor" VALUE="000000">
  <PARAM NAME="bgcolor" VALUE="fbfbff">
  <PARAM NAME="daycolor" VALUE="fff030">
  <PARAM NAME="nightcolor" VALUE="6040a0">
  <PARAM NAME="seconds" VALUE="off">
  Your browser is not configured to show
  Java applets. This would show a clock with
  the US Central Time.
</APPLET>

I'll explain the meaning of the parameters further down.

If you decide to download the clock to your own site (so that it starts faster, or to safeguard against somebody at W3C changing it), then you need to download two files:

(Right-click on them to download, or whatever command your browser provides.) When you put these two files in the same directory as the HTML file, you can remove the CODEBASE attribute from the code fragment above. If you put them somewhere else, you have to adapt the CODEBASE accordingly.

You may optionally also download the source code (just to have a look at it, or if you want to modify the way the clock works):

That's all! It should work now, but let's look at the parameters you can set.

Configuring the clock

The clock has a large set of parameters to specify how it looks and what time it displays. Refer to the HTML fragment above for an example of the syntax.

WIDTH
The WIDTH attribute gives the width of the clock in pixels. The size of the digits also depend on this: the larger you make the clock, the larger the digits will be as well.
HEIGHT
The HEIGHT attribute gives the height of the clock in pixels. If you make the HEIGHT equal to the WIDTH, you will see just the dial. If you make the HEIGHT larger than the WIDTH you will see the date displayed below the dial as well.
CODEBASE
CODEBASE was explained in the previous section. If the two .class files are in the same directory as the HTML file, you can omit this attribute.
tz
"tz" is the timezone parameter. It determines which timezone the clock shows the time of. The values are 3-letter codes, such as CST for US Central Time, or pairs of the form "continent/city". See below for a list.
language
"language" determines the language of the date display below the dial. It is a 2-letter code such as "en" for English, "fr" for French, etc.
country
"country" is a further modifier on "language" in the case the language is spoken in several countries. E.g., if you set "language" to "en" and "country" to "gb" (as in the example above) you will get a slightly different-looking date than when you set "country" to "us". The differences are usually minor, though.
color
"color" is the color of the hands during daytime. (The color may automatically change in nighttime, if the contrast with the dial is not high enough.) It must be an HTML-style 6-digit color in hexadecimal. E.g., 0000ff is blue, 00ff00 is green, ff0000 is red, 000000 is black and ffffff is white.
textcolor
"textcolor" is the color of the text, both the digits and the date. It, too, is a 6-digit hexadecimal color.
bgcolor
"bgcolor" is the color of the area outside the dial. Typically you would choose that to be the same as the color of the HTML page, but any color is fine.
daycolor
"daycolor" is the color of the dial at noon. if it is different from "nightcolor", the dial will change colors slowly in the course of the day, from daycolor to nightcolor and back again.
nightcolor
"nightcolor" is the color of the dial at midnight. In the example above, the color at noon is yellowish and the color at midnight is purple, which causes the clock to pass through several brownish colors. Since the purple is quite close to the color of the hands (blue at noon), the hands will switch to yellow sometime in the evening, and back again in the morning, to keep them visible against the background.
seconds
"seconds" can be either "on" or "off". If you omit the parameter, it will be "off". This determines whether there is a seconds hand visible or not.
style
"style" is not shown in the example, but it can be set to either "0", "1", "2", or "3" to determine how long the date will be. "3" is shortest and makes the date look something like "12/7/99". "2" is medium length and looks something like "25-Oct-99". "1" is long format and looks like "25 October 1999", "0" is full format and is probably too wide to be useful. It looks like "Monday, October 25th, 1999". The default is "2".

Time zones

Time zones are indicated by 3-letter codes. Going eastwards round the globe (roughly), the known time zones are the following:

Branko Dimitrijevic made an applet that lists all the time zones available in your browser. Netscape 4 is restricted to the above list, but newer Java implementations should support more, such as "Australia/Brisbane" or "Africa/Algiers".

Feedback

Please let me know if you find any errors in the clock itself or in this manual.

But be aware that an error in the time shown by the clock may also be caused by a misconfiguration of your computer, so first check that your computer's clock is correct and that the computer is correctly configured for the actual time zone that you are in.

W3C Bert Bos,
Webmaster
Last updated $Date: 2008/01/29 18:26:03 $