HTML Source box #2 - 3CITIES.HTM
<html>
<head>
<title>Javascript Clock</title>
<script LANGUAGE="Javascript">
<!--
//dummy function …
function calculateOffset() {
currentTime = new Date();
browserTimeDifference = currentTime.getTimezoneOffset();
document.displayClock.gmtoffset.value = browserTimeDifference/60;
}
//the function to get the time data
function setTime() {
//initialise variables
//GMT adjustments for Sydney and San Francisco
//alter to +11 and -8 in October to account for daylight savings
//reset to +10 and -7 in March
sydneyGMTadjustment = 10;
sanfranciscoGMTadjustment = -7;
//new date object for your visitors time
sanfranTime = new Date();
localTime = new Date();
sydneyTime= new Date();
//build display string for local time
localTime = buildTimeString(localTime);
//calculate the browser's opinion of the local GMT time difference
//and calculate the real one..
timeDifference = document.displayClock.gmtoffset.value*60;
//adjust sanfranTime to show sanfrancisco time
sanfranTime.setMinutes(sanfranTime.getMinutes() - timeDifference +
sanfranciscoGMTadjustment*60);
sanfranTime = buildTimeString(sanfranTime);
//adjust sydneyTime to display Sydney time
sydneyTime.setMinutes(sydneyTime.getMinutes() - timeDifference +
sydneyGMTadjustment*60);
sydneyTime = buildTimeString(sydneyTime);
//display these strings in the text boxes on the form
document.displayClock.sydneytime.value = sydneyTime;
document.displayClock.sanfranciscotime.value = sanfranTime;
document.displayClock.localtime.value = localTime;
//call this function again in 10 seconds time
setTimeout ("setTime()", 10000)
}
function buildTimeString (currentTime) {
var currentHours = currentTime.getHours();
var currentMinutes = currentTime.getMinutes();
//assume it is the afternoon
var currentAmPm = "pm"
//adjust for a 24 hour clock
if (currentHours > 12)
currentHours = currentHours - 12;
else {
//set 'am' for hours 0 - 11 inclusive
if (currentHours <= 11)
currentAmPm =
"am";
//adjust for midnight
if (currentHours == 0)
currentHours =
currentHours + 12;
}
//pad hours to two digits
if (currentHours <= 9)
currentHours
= " " + currentHours
//pad minutes to two digits
if (currentMinutes <= 9)
currentMinutes = "0" + currentMinutes
//build a string for the time
currentTime = currentHours + ":" + currentMinutes +
currentAmPm;
return currentTime;
}
//-->
</script>
</head>
<body OnLoad="calculateOffset();setTime()" BGCOLOR="#004080"
TEXT="#FFEEEE" VLINK="yellow">
<font FACE="arial">
<h1>International times </h1>
<table CELLPADDING="10">
<tr>
<td WIDTH="50%">This is a simple Javascript application which reads the
system clock and
displays local time and the time in these two other cities updating it at 10 second
intervals.<p><i>This clock has some erratic habits as some browsers can't
calculate the
difference between your time and GMT accurately - it's not hard - they just don't do it
right. The GMT offset that your browser has calculated for you is shown above the clock,
if it's incorrect or if you aren't sure if it's correct or not,<font
color="#FFFF80"> <a
HREF="gmts.htm" style="color: rgb(255,255,128)">check
here</a></font> to find out your GMT
and enter the number in the text box manually.<br>
</i></td>
<td VALIGN="TOP" WIDTH="50%"><!-- The clock is displayed in a
text input box on a form --> <form NAME="displayClock">
<table>
<tr>
<td>The current GMT offset for your city is: </td>
<td><input TYPE="text" NAME="gmtoffset"
onChange="setTime ()" SIZE="8"> Hours</td>
</tr>
<tr>
<td><h2>Time in Sydney: </h2>
</td>
<td><input TYPE="text" NAME="sydneytime"
SIZE="8"></td>
</tr>
<tr>
<td><h2>Your Local Time: </h2>
</td>
<td><input TYPE="text" NAME="localtime"
SIZE="8"></td>
</tr>
<tr>
<td><h2>Time in San Francisco:</h2>
</td>
<td><input TYPE="text" NAME="sanfranciscotime"
SIZE="8"></td>
</tr>
</table>
</form>
</td>
</tr>
</table>
</font>
</body>
</html>
|
