Hosting a Clock
adding one to your own page
is nearly easy as pie
 
 
if you'd like to attach a WRLD.time clock to your web page, read on.     without much effort, you can configure the color, font and position of the digits being displayed.     add a background color or image to give it flair.     and if you wanna go hog-wild, you can create a configuration file.
 
totally insane people may go so far as to download the class files so they can use the command-line version.
   
 
 
Attaching a Clock how to put a WRLD.time clock on your web page
Config Files making your clock look as groovy as possible
On the Desktop fun with WRLD.time clocks executed from the command line
UTC Sites a list of sites which support the UTC protocol
 
 
 
    Contents          Previous    Next  Attaching a Clock     
 
       Basically, what you need to do is create an applet which references the WRLD.time class files. The most direct way of doing this is referring to the class files on sleepbot.com.
 
Here's an example of what you'd put in your web page:
   <APPLET
    CODEBASE="http://www.sleepbot.com/WRLDtime/lib"
    CODE="com.sleepbot.WRLDtime.app.WRLDtimeApplet"
    WIDTH=***
    HEIGHT=***
   >
      <PARAM NAME="config" VALUE="***">
      <PARAM NAME="bg" VALUE="***">
      <PARAM NAME="fg" VALUE="***">
      <PARAM NAME="cron" VALUE="***">
   </APPLET>
Don't worry about the carriage returns & indentation... that's just there for visual effect. I'll explain the blue asterisks in just a moment.
 
First of all, the <APPLET /> tag tells the browser that an applet should be put in place. APPLET needs a closing tag, which you see on the last line of the example.
 
The basic stuff that an applet needs to know are the name of the applet class and where it's located. The CODE portion identifies the name of the class to display, and CODEBASE indicates where the classes are located. In this example, you're referencing the standard WRLD.time applet class (WRLDtimeApplet) from the sleepbot.com domain. That way you don't have to set them up on your own server, and you always get the latest version of the classes.
 
The WIDTH and HEIGHT portions are defined by you... experiment with the applet sizing until you get something that looks nice. When sizing your window, keep in mind that the standard WRLD.time applet class reserves a 25-pixel-high row at the bottom of the applet so that it can display the WRLD.time logo. For this reason, you may disregard the 'window' line described in the standard configuration. It has no purpose in an a applet context; the clock face dimensions are specified via the <APPLET /> tag.
 
The standard time-piece accepts parameters from the applet definition.... that's what the <PARAM /> tags are for. All of the parameters are optional... you could just as easily have no <PARAM /> tags if you wish. If you don't provide any parameters, you'll get the standard black-on-grey clock.
 
One clean way to configure your clock is to provide a reference to an external configuration file via the config parameter. The applet will fetch and parse the file, and configure itself accordingly. The external file may contain the bg, fg and cron lines, as well as many others. However, it's nice to provide at least the bg configuration up-front so that the Applet has that information during its initial rendering.
 
Unfortunately, there's one little issue with the example I've shown above. Unless the example is hosted from sleepbot.com, the configuration file won't be loadable. It's a Java security thing; the applet can't go around referencing random files on random web hosts -- it can only grab files from its own host. So unless you're also hosting the classes locally, this will be an issue. As of WRLD.time version 1.3 I've introduced a work-around so that you don't have to download and host the classes just so that you can make a complex configuration.
 
You may explicitly include all of your configuration in the <PARAM /> tags. You can provide everything -- bg (background), fg (foreground), cron (chronometer), digits, tablets, separators, aliases -- the whole nine yards. You could end up with a lot of tags, but it gives you that full flexibility! But depending upon how much you customize the face of the clock, you'll need to be aware of these lines:
  • d.list - the digit configuration listing (eg. 'd3, d3.0, d3.1, d3.2')
  • t.list - the tablet configuration listing (eg. 't2, t2.00, t2.01.99')
  • sep.list - the separator configuration listing (eg. 'sep0, sep1')
  • alias.list - the alias configuration listing (eg. 'zero, one, two')
They're simply comma-delimited a list of your other entity lines (digits, tablets, separators and aliases... respectively). And here's why that's an issue. In a configuration file context -- or virtually any context -- all lines are parsed. The code recognizes each of your entity line configuration when it sees it. Thus, no need to explicitly list them.
 
However, in an applet, there's no way to get all of your <PARAM /> tags. You have to explicitly ask for them by name. So, these lines tell the time-piece about all the other entity lines to be parsed. Remember to keep your list up-to-date... if it doesn't contain a new (or modified) entity line name, the applet won't parse it!
 
See configuration files below for full details on all these parameters and the default values for the time-piece.
 
You'll probably have noticed that there's a pair of WRLD.time clocks on each of the pages you've been looking at here. They're identical across each page, except for the background color. All that was needed to make these clocks is the fg and bg parameters... do a View Source and see for yourself.
   
 
 
 
    Contents          Previous    Next  Config Files     
 
       If all clocks looked the same, it'd be a boring, boring world. So, in the interest of preventing such boredom, the standard time-piece determines its appearance according to a configuration file.
 
You may configure the time-piece via a simple text file. Each line in the file that is not blank and not a comment denotes a configuration setting. A line can be marked as a comment by making its first character a semicolon (';').
 
In an applet context, you may configure this time-piece via the <PARAM /> tags. The tag's NAME attribute is the configuration line name, and its VALUE attribute is the line to be parsed. There's really no use for comments in this context.
 
Configuration settings have the following general format:
   NAME=KEY:VALUE, KEY:VALUE, ...
NAME is the name of the setting and it is followed by an equal sign ('='); you'll see more on the individual settings below. The setting contains a series of key-value pairs, each separated by a comma (','). The KEY is separated from its VALUE by a colon (':'). If you need to include a comma (or leading or trailing whitespace) within your setting, then enclose the entire KEY:VALUE setting in full quotes ('"').
 
The applicable key-value combinations are defined by the setting itself. The settings are grouped below by a rough classification. Each setting can accept certain key types. Each key type is made up of one or more key-value pairs. You'll probably have to scroll around this document a while to figure out the full inter-relationships between these things.
 
Now, before I go into great technical detail, I'll refer you to the configuration files I've already created. They're all sitting in the same directory, and the best ones to look at are Green, jonathan and Ambience. If you want to actually see one of them in action, choose it from the many faces.
 
 
Okay, the fun starts here. First, we have what I call the Global Settings which are used to describe general display components. All Global Settings are optional... the defaults for each setting are described below.
bg
the background setting.
this setting can accept the following key types:
 
a color - the background color. if not specified, it defaults to lightGrey.
an image - the background image. if specified, it's rendered on top of the background color.
fg
the foreground setting.
this setting can accept the following key types:
 
a color - the global (default) color. its key-value pairs override the default of black.
a font - the global (default) font. its key-value pairs override the default of 16-point Courier Bold.
a point - the global (reference) point. its key-value pairs override the default of (0, 0). now... this may sound strange, but if you don't supply either coordinate, it actually defaults to (5, -2) so that the generic clock will look right.
cron
the chronometer setting.
this setting can accept the following key-value pairs:
 
factor - the chronometer factor.
divisor - the chronometer radix (or so jonathan called it).
fromGMT - the chronometer GMT offset.
utchost - the hostname of a UTC server. the resulting UTC code is used to align the chronometer. if not specified, the chronometer is not aligned via a UTC server. there's a nice list of UTC hosts down here.
utcport - the proper port of the UTC server. if not specified, it defaults to 13.
utccgi - a URL which points to a script that returns a UTC code.
 
it turns out that utchost and utcport don't work in an applet context. that's due to security hobbling in Java... the applet isn't allowed to go off to another site and make a request. however, you can use this setting to reference a local CGI script which will proxy the response from a UTC server. if the configuration contains both a utccgi and a utchost setting, the script is referenced first, and if it fails, the host is referenced.
 
for a complete understanding of this setting's key types, please take a look at the WRLDcron class documentation.
window
the window setting.
this setting can accept the following key types:
 
a rectangle - the window position and dimensions. its key-value pairs override the default of ((30, 0) - (50, 50)).
 
this setting is only put to use by the command-line version. the applet version relies upon the WIDTH and HEIGHT of the applet tag to determine its size.
draworder
the draworder setting.
there are no key types associated with this setting. instead, it can accept the following keys:
 
    d#, where '#' is the index of a digit.
    sep, or sep#, where '#' is the index of a separator.
 
though accurate, those descriptions are pretty obtuse... see the Digit Settings below for more details.
 
basically, you're describing the order in which its core entities (tablets, digits and separators) should be rendered. this would probably only be useful if your images overlapped strangely. all tablets are rendered first (in specified draw-order by digit), followed by the digits and separators in the specified draw-order.
 
by default, the draw-order is; all separators (from lowest to highest), then all digits (from lowest to highest). any clock component not specified in this line is rendered in its default order. for instance, if the line contained "d1, sep", then the second digit would be rendered, followed by the first separator; everything else would be rendered normally.
 
Other than that, we have what I call the Digit Settings, which are used to define the individual rendering elements of the clock. All Digit Settings are optional... if none are provided, then the time-piece assumes the text types 0-9 for each digit and a period ('.') for the separator.
 
However, it's all-or-nothing; if even one Digit Setting is provided, then all digits which are not explicitly specified via a setting are not displayed.
 
Now, when I talk about measures and beats and digit groups and indexes here, I mean the following... A standard WRLD.time clock is expressed in the format "XX.XX". The measure is on the left and it's made up of digits 3 and 2; digit 3 is the highest digit in the clock, and it changest the slowest. The beat is on the right and it's made up of digits 1 and 0; digit 0 is the lowest digit, and it changest the fastest. Also, there's a single separator ('.') between the measure and the beat.
 
Here's the format for a separator setting:
sep, or sep#, where '#' is the index of a separator
the separator settings.
indexes for separators range from 0 to... well, as many as you want. the "sep" and "sep0" settings are identical, and either one is recognized. if you want more than one separator, then create settings named "sep1", "sep2", etc. until you've done. the indexes must be in sequence; if you have a "sep2" without a "sep1", you'll never see it.
 
this setting can accept the following key types:
 
hide - nothing is rendered.
 
a text - the separator text.
an image - the separator image.
an alias reference to another setting.
 
if not specified, a separator will not be displayed.
Here's the formats for the two kinds of digit setting - digit groups and digits:
d#, where '#' is the index of a digit
the digit groups.
indexes for digit groups range from 0 to as many digits as there are in the clock, based on its precision. for example, when a default WRLD.time clock displays "12:34", the highest digit (d3) = 1 and the lowest digit (d0) = 4.
 
these group settings allow you to generally over-ride the global settings for all digits in the group. each of these group settings can accept the following key types:
 
a point - the group point. its key-value pairs override the global point.
a color - the group color. its key-value pairs override the global color.
a font - the group font. its key-value pairs override the global font.
 
if not specified, then the global settings are used for digit-specific references.
.0 thru .9 for each digit group
the digit settings.
each digit group has ten different digits... 0 thru 9. so, when a standard WRLD.time clock displays "98:76", the settings named d3.9, d2.8, d1.7 and d0.6 are displayed.
 
this setting can accept the following key types:
 
hide - nothing is rendered.
 
a text - the digit text.
an image - the digit image.
an alias reference to another setting.
 
any digit which is not explicitly specified will not be displayed (eg. it's assumed to be hidden).
Here's the format for a tablet. It's sort of an 'expert' feature, so you may want to skip over this if you're new to config files:
t#.SS.EE, where '#' is the index of a digit
the tablet.
a tablet is a basically a 'composite' digit, a sequence of digits to be handled together, an exception case handler. indexes for tablets groups range from 0 to as many digits as there are in the clock (same as with digit groups).
 
this setting can accept the following key types:
 
a point - the group point. its key-value pairs override the global point.
a color - the group color. its key-value pairs override the global color.
a font - the group font. its key-value pairs override the global font.
 
the '#' indicates the highest digit represented by the tablet. the 'SS' indicates the first sequence of digits which cause the tablet to be rendered. the 'EE' indicates the last sequence of digits which cause the tablet to be rendered. if your tablet doesn't have a range, then you only have to provide the first sequence, and the format of the setting is "t#.SS".
 
a few quick examples: assuming a standard WRLD.time clock, a tablet setting named "t3.50" would be rendered while the measure was 50 -- neither d3.5 nor d2.0 would be rendered. a tablet setting named "t0.1.9" means that the lowest digit in the clock (d0, the beat's right digit) would only be rendered when the beat was divisible by 10 -- the rest of the time, the tablet would be rendered.
 
the draw-order for a tablet comes at the time that its highest digit is rendered. a tablet setting that starts with 't2' is rendered in place of the third digit in the clock.
 
tablets are not by any means required. they were added to the config file to support a 12-hour old-style clock. first, you'll need to hide (or just not specify) the digits for d3 and d2. then, you configure inidividual tablets from t3.00 through t3.23 to display 1 through 12, respectively. if you're really adventurous, provide an AM or PM indicator.
Now you know the names of each individual setting. Plus, you have the option to set up named alias references, which can be called anything you want.
 
If you had set up text settings for the measure's left digit, and you wanted all the digits to have the same settings, you'd could write your file with things like "d2.0=alias:d3.0" and "d1.4=alias:d3.4", etcetera.
 
Or you could write it another way by creating a new alias setting called "one" and referring to it like "d3.1=alias:one", "d2.1=alias:one" and "d1.1=alias:one". They're not necessary, but they make the file a little more legible and provide for re-usability.
 
Any point, font or color key-value pairs in the 'alias' setting override the group settings, and any key-value pairs for the digit itself override the respecitve key-values of the 'alias' settings. Just like layers on an onion.
 
Oh... and one more thing. 'Alias' settings don't cascade, so if you know what what means, don't do it.
 
 
Okay, now you know about the settings. Here are the individual key types and the key-value pairs that are used to define each:
hide
nothing is rendered.
this is a way to explicitly state that the component should not be displayed.
image
the image type.
this setting can accept the following key-value pairs:
 
image - the name of the image file. if you don't specify a protocol'd URL, it's assumed to be within the document's address and port. if the filename starts with "/", it's assumed to be an absolute reference from the root of your web server. if not, then it's assumed to be relative to the directory in which the page containing the applet tag resides, or the directory where the class files reside if you're running it from the command line.
 
this setting can also accept the following key types:
 
a point - where the image should be displayed.
text
the text type.
this setting can accept the following key-value pairs:
 
text - the text to display.
 
this setting can also accept the following key types:
 
a point - where the text should be displayed.
a color - what color the text should be.
a font - font characteristics of the text.
point
the point type.
this setting can accept the following key-value pairs:
 
x - the horizontal position. this value can be either absolute, or relative to the value it is overriding. for example, "x:10" sets the horizontal position to 10, whereas "x:+10" sets the horizontal position to 10 pixels to the right of the point it is overriding.
y - the vertical position. this value can be either absolute, or relative to the value it is overriding, just like x.
color
the color type.
this setting can accept the following key-value pairs:
 
color - a hexidecimal representation of the RGB color to be used. it's just like HTML... for example, '000000' is black, 'FF0000' is bright red and '000080' is dark green.
font
the font type.
this setting can accept the following key-value pairs:
 
face - the name of the font face to be used. unfortunately, i don't have a full list of font names to give you. all i know is that 'Courier' and 'Times' are the standard fixed and proportional fonts (respectively) for Java.
size - the size of the font face to be used. this value can be either absolute, or relative to the value it is overriding. for example, "size:8" sets the font size to 8, whereas "size:+8" sets the font size to 8 points larger than the font it is overriding.
plain - plain font... it's just a KEY with no VALUE. this key eliminates all existing style from the font. if you want to guarantee that you wont get extra bolds and italics from the font style you're overriding, specify the plain key.
bold - bold style font... it's just a KEY with no VALUE. this key makes the font bold. it is always used relative to the font style you're overriding (unless the plain key is specified).
italic - italic style font... it's just a KEY with no VALUE. this key makes the font italic. it is always used relative to the font style you're overriding (unless the plain key is specified).
rectangle
the rectangle type.
this setting can accept the following key-value pairs:
 
x - the horizontal position, which is always absolute.
x - the vertical position, which is always absolute.
width - the horizontal size, which is always absolute.
height - the vertical size, which is always absolute.
 
The weirdest thing to get used to in configuration files is the whole 'override' thing. I'll run you through a tiny example to touch on all the aspects of overriding:
   ;  the Global Settings
   bg=color:000000
   fg=size:+4, x:2, color:FFFFFF

   ;  the Digit Settings
   sep=text:^, bold
   sep1=text:_, bold, x:+3
   sep3=text:*, bold, x:+6

   d3=x:+10, y:+10
   d3.5=image:five.gif

   d0.8=alias:d3.5, y:-1
   d0.9=alias:eight, italic, color:00FF00

   t2.0.9=text:T, x:+7
   t1.89=text:T, x:+6

   eight=text:8
Now granted, this would look like crap, but hear me through. This clock is going to display is two separators, the 5 of the measure's left digit, and the 8 & 9 of the beat's right digit. It also has two potential tablets to display.
 
The background color of this clock will be black with no image. The global color will be white. The global point will be (2, 0), since we specified an absolute horizontal position and left the y alone; if you provide only one coordinate, the other one defaults to 0. The global font will be 100% default, since we didn't specify any key-value pairs that the font type recognizes.
 
There are three separators listed, but only two will be recognized. The first separator is named "sep" here, but "sep0" is also acceptable. It is going to be a caret, and it'll be displayed in the global font's face and size, but with a bold style. As it turns out, it doesn't make sense to do this because the global font is already bold. If you wanted to display it without the bold styling, then the setting should have the 'plain' key in it somewhere.
 
The second separator is named "sep1", and it's an underscore, displayed 3 pixels to the right of the caret, at (5, 0). The third separator here is named "sep3", and it is ignored because it's out of sequence. To fix this, you could add a setting named "sep2", or rename the third separator to "sep2".
 
All of the measure's left digits are going to be displayed at (12, 10), because its point is 10 pixels diagonal to the global point of (2, 0). Since only its 5 digit is described, you'll only know when it's between 50.00 and 59.00 through the day. The digit is an image, and the file itself is assumed to be in the same directory as the page (or the class files, if it's a desktop clock). If the file isn't there, even the 5 digit won't display!
 
There is no digit group setting for the beat's right digit, so each of its digits will be relative to the global settings. The 8 digit will be the same as the 5 digit from the measure's left, but it is displayed at (2, -1)... the measure's left group setting is not considered here. The 9 digit will be a text '8', and will be displayed in the face and size of the global font, with italic style (plus the default's bold style), and it will be light blue.
 
And then, we have the tablets... The measure's right digit (d2) always shows 'T', since the t2 tablet is 1 digit long and covers the full digit range of 0 thru 9. The t1 tablet means that 'T' is shown in leiu of d0.8 and d0.9 whenever the beat is 89.
 
 
It looks really convoluted, but it's really not all that bad. Check out my examples (linked above), experiment a little, and you should be able to implement some really cool ideas. And with the generic images and positioning, you can make it as abstract as you'd like.
 
Oh... and did I mention... it's all supposed to work, but I haven't done rigorous testing. If any of it needs tweaking, feel free to let me know.
   
 
 
 
    Contents          Previous    Next  On the Desktop     
 
       The standard time-piece uses configuration files to define its appearance. For this reason, the command-line application (WRLDtimeApp) takes one optional parameter:
configfile
name of the configuration file to prepare itself with (defaults to standard black-on-grey clock).
See configuration files below for full details on configuration and the default values for the time-piece.
   
 
 
 
    Contents          Previous    Next  UTC Sites     
 
       Here is a list of known UTC hosts. Each of them serves its signal from port 13.
   time-a.timefreq.bldrdoc.gov
   time-b.timefreq.bldrdoc.gov
   time-a.nist.gov
   time-b.nist.gov
   time.nist.gov
   time-nw.nist.gov
   utcnist.colorado.edu
For much more detailed information, please see http://www.boulder.nist.gov/timefreq/.
   
 
 
 
HTML & Java Implementation (c)1998, Lookit the Cat Productions
WRLD.time Conceived (and (c)1998) by jonathan jay

WRLD.time
a fine global temporal standard

Root Sleepbot Constructs