|
|||||||||
 |
 |
 |
 |
 |
 |
 |
 |
||
 John Hilvert and Helen Bradley explain how to set your Web page clock to display the time of different global locations. Back in our October issue we ran this tutorial. However some of you may have found that the Java didn't actually work! We have updated the code used in the 3 Cities example below so that it should now work in any java capable browser
|
 |
|
|
|
| In
February, we showed you how to create a JavaScript clock to show the time on a Web page.
The clock as it was designed shows the system time as it's set on your visitor's machine. We received a lot of e-mail asking us if the clock could be altered to show the time in Sydney (or any other specific global location) regardless of where the visitor came from. Well it can and here are two versions of it that you can create for your Web page. We've provided all the files you need for this project on this month's (October 98) cover CD-ROM. To view or use the source code you can use any HTML editor, text editor and most Web browsers. These routines work well with client side forms and allow you to program and test your pages easily without having to resort to server side CGI scripts.
|
 Figure 1d: This simple adaptation of the clock from February's Web Workshop tutorial will display the time in Sydney on your visitor's PC. |
|||
| A simple Sydney clock The source code in Source Box 1 creates a clock which will show the local time in Sydney and which can be adapted to show the local time in any city. The alteration which has been made to the code from the previous version simply adjusts the visitor's time to Sydney time using built-in JavaScript methods. The date method getTimezoneOffset() returns difference in minutes between the visitor's local time and Greenwich Mean Time (GMT). The code takes this offset and subtracts it from the visitor's local time and then adds the GMT offset for Sydney which is +10 hours (+11 hours in summer). If you live in Perth, Darwin, Adelaide or outside Australia, alter this line of code and set the number of hours your city is ahead of GMT:
A more complex international clock This code is quite different to the other clock and you will notice that three instances of the date object have been created -- one for each date. This is required because JavaScript sends a variable's address and not its contents to a function such as setTime when you call it. This, in turn, means that the information at the address itself will be altered by the function. If you only have one date object you will get errors if you try to use it for the times in all three cities. You could share one date object between the local time and Sydney time because the local time is not sent to a function that will alter it. However, the variables sydneyTime and sanfranTime must be separate instances of the date object or you'll get logic errors. We have taken the precaution of making all three times different instances of the date object. In this example the statements which build up a time string so it can be later displayed on the Web page have been moved to a separate function called 'buildTimeString. Each time a time string is required this function is called and the current time is sent to it as a parameter.
|
 Figure 2d: This more sophisticated example shows the time on this London visitor's computer and the corresponding time in San Francisco and Sydney.
|
|||
 |
Sydney Clock
|
