How To Configure Flash World Clock
We are offering several different web world clock products. Each comes with its own design, capabilities, and limitations. This reflects history of Flash World Clock development in WR Consulting and also a goal to keep plugin sizes small. To put a clock on your site decide which one you like and see if it can be modified to fit your needs. Here are some things to consider:- How many clocks? Some clocks (such as fzt.swf) occupy the entire plugin area and can be easily arranged in columns or rows using HTML tables. You can get any number of clocks using such design. Other designs such as fzonetick.swf may embed several clocks already.
- Which time zone format? Earlier versions of Flash World Clock take time zone parameters from an HTML page that has the clock. Earlier format is somewhat limited. It works nicely with strict rules like "set clock 1 hour forward at 2:00 AM on the first Sunday in April" but it does not support changes in time zone rules. When a change occurs you need to change parameters on the web page, which means rewriting some code. This is why we also offer clocks, which use zoneinfo package. World clocks with zoneinfo support are much easier to configure and maintain.
Configuring Flash World Clock with zoneinfo Support
Let's see how we can configure a couple of clocks for Sydney and Tokyo like here:It can be easily accomplished with HTML code like this:
<html> <table cellspacing="1" cellpadding="0" border="0"> <tr> <td> <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="95" height="17" id="fzonetick" align="middle"> <param name="allowScriptAccess" value="sameDomain" /> <param name="movie" value="http://wrconsulting.com/flash/fzt95.swf" /> <param name="quality" value="high" /> <param name="FlashVars" value="db=http://wrconsulting.com/flash/code/zic.php?z$Australia/Sydney&label=Sydney&work=0900-1800.12345"> <embed src="http://wrconsulting.com/flash/fzt95.swf" quality="high" width="95" height="17" name="fzonetick" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" FlashVars="db=http://wrconsulting.com/flash/code/zic.php?z$Australia/Sydney&label=Sydney&work=0900-1800.12345"/> </object> </td> </tr> <tr> <td> <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="95" height="17" id="fzonetick" align="middle"> <param name="allowScriptAccess" value="sameDomain" /> <param name="movie" value="http://wrconsulting.com/flash/fzt95.swf" /> <param name="quality" value="high" /> <param name="FlashVars" value="db=http://wrconsulting.com/flash/code/zic.php?z$Asia/Tokyo&label=Tokyo&work=0900-1800.12345"> <embed src="http://wrconsulting.com/flash/fzt95.swf" quality="high" width="95" height="17" name="fzonetick" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" FlashVars="db=http://wrconsulting.com/flash/code/zic.php?z$Asia/Tokyo&label=Tokyo&work=0900-1800.12345"/> </object> </td> </tr> </table> </html>
The important part is the FlashVars string, which identifies parameters for each clock. For example, for Sydney we have:
name="FlashVars" value="db=http://wrconsulting.com/flash/code/zic.php?z$Australia/Sydney&label=Sydney&work=0900-1800.12345">
- Australia/Sydney identifies the time zone for the city.
- label=Sydney identifies a text label, which is printed on clock face.
- work=0900-1800.12345 identifies working hours highlight (from 09:00 till 18:00 Monday through Friday).
You can easily change time zone for the city, label, and working hours by changing these parameters. Here is how the second clock for Tokyo is defined:
name="FlashVars" value="db=http://wrconsulting.com/flash/code/zic.php?z$Asia/Tokyo&label=Tokyo&work=0900-1800.12345"
Two Sections for Different Browsers
IE and Mozilla based browsers work differently. This is why you need to pass parameters separately into each browser type. The <object> tag takes care of IE, while <embed> is needed for Mozilla. The <embed> stuff is inside the <object> tag content but it's okay. You need to understand that there are TWO separate sections with identical clock configuration information inside, which are needed to support different browsers. If you change something in one place make sure to change in the other!Cities from zoneinfo Package Only
Flash World Clock supports all cities (like Asia/Tokyo and Australia/Sydney) from zoneinfo package. However, zoneinfo does not cover all world cities. Only major cities are defined. If you need to define a clock for a smaller city you can use a time zone of a large city (in the same time zone) but label your clock differently. For example:name="FlashVars" value="db=http://wrconsulting.com/flash/code/zic.php?z$Asia/Calcutta&label=Hyderabad&work=0900-1700.12345">
Configuring the Digital Flash World Clock
One Clock per Table Cell
The digital clock is easier to configure than analog, because it's one clock per table cell. Below is an example code for Sydney, Australia. To get multiple clocks you simply arrange several fragments like this together into an HTML table.<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="95" height="17" id="fzt" align="middle"> <param name="allowScriptAccess" value="sameDomain" /> <param name="movie" value="/img/fzt.swf" /> <param name="quality" value="high" /> <param name="FlashVars" VALUE="z=600&dst=5110.0200-5103.0300&bias=60&label=Sydney"> <embed src="/img/fzt.swf" quality="high" width="95" height="17" name="fzt" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" FlashVars="z=600&dst=5110.0200-5103.0300&bias=60&label=Sydney"/> </object>
Configuring for Mozilla Browsers
Let's look at the section for Mozilla.<embed src="/img/fzt.swf" quality="high" width="95" height="17" name="fzt" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" FlashVars="z=600&dst=5110.0200-5103.0300&bias=60&label=Sydney"/>
Important parameters here are src, which is a path to the Flash file (Flash World Clock plugin itself) and FlashVars, which is a string that configures your clock:
src="/img/fzt.swf" FlashVars="z=600&dst=5110.0200-5103.0300&bias=60&label=Sydney"
Description of Parameters
For each clock you'll probably want to specify time zone offset from UTC, daylight saving datetimes and value, and a label. All parameters are optional. If no parameters are specified for the clock a GMT clock with running seconds is displayed.z - time zone offset in minutes from UTC.
dst - daylight saving begin and end datetimes. See the description below.
bias - daylight saving value in minutes (usually 60).
label - clock label. Avoid using long labels because width of the clock is fixed and there is only enough space for 8 or so characters.
Let's consider this example:
FlashVars="z=600&dst=5110.0200-5103.0300&bias=60&label=Sydney"
z=600 - this means that clock 1 is 600 ahead of UTC.
dst=5110.0200-5103.0300 - daylight saving time starts on last Sunday in October at 02:00 hours and ends on last Sunday in March at 03:00 hours.
bias=60 - daylight saving shift is 60 minutes.
label=Sydney - label for this clock is Sydney.
Date Format
Format of a date is as follows:First digit - week number (1 - first, 2 - second, 5 - last).
Second digit - weekday (1 - Sunday, etc.).
Third and fourth digits - calendar month.
For example,
1104.0200 - first Sunday in April at 02:00 hours.
5110.0200 - last Sunday in October at 02:00 hours.
Do not forget to configure both sections of FlashVars and actually test the plugin with IE and Mozilla based browser such as Firefox.
Configuring the Analog Flash World Clock
Configuring the analog clock is very similar to configuring digital except that you deal with 3 clocks at once. The are numbered 1-3 and you need to configure all the corresponding values accordingly, very much like the digital clock. Here is the sample code, which should be self-explanatory:<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="250" height="90" id="fzonetick" align="middle"> <param name="allowScriptAccess" value="sameDomain" /> <param name="movie" value="/img/fzonetick.swf" /> <param name="quality" value="high" /> <param name="FlashVars" value="z1=540&label1=Tokyo&z2=0&dst2=5103.0200-5110.0300&bias2=60&label2=London &z3=-300&dst3=1104.0200-5110.0200&bias3=60&label3=New York&skin=1" /> <embed src="/img/fzonetick.swf" quality="high" width="250" height="90" name="fzonetick" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" FlashVars="z1=540&label1=Tokyo&z2=0&dst2=5103.0200-5110.0300&bias2=60&label2=London &z3=-300&dst3=1104.0200-5110.0200&bias3=60&label3=New York&skin=1"/> </object>
Again, do not forget to configure both sections of FlashVars and actually test the plugin with IE and Mozilla based browser such as Firefox.
 | ||||
|
||||
| ||||
