To help avoid this, one of my coworkers suggested adding a clock to the coordination page that showed the current time in every timezone and UTC (a.k.a. GMT or Zulu ... why is abbreviation such a long word? Sorry, I digress...).
So after some digging (thank you HTML Goodies) and testing (what the heck is PST -3:15:33???), I've ended up with this:
It's a nice, simple, text-based clock that updates based on the local machine clock. The code to make this work is also pretty simple and comes in two parts: 1) the JavaScript, and 2) the HTML.- The JavaScript:
<SCRIPT LANGUAGE="JavaScript">
var timerID = null
var timerRunning = false
function startclock(){
stopclock()
showtime()
}
function stopclock(){
if(timerRunning)
clearTimeout(timerID)
timerRunning = false
}
function showtime(){
var now = new Date()
var hours = now.getUTCHours()
var minutes = now.getUTCMinutes()
var seconds = now.getUTCSeconds()
var utcTime = "" + (hours)
utcTime += ((minutes < 10) ? ":0" : ":") + minutes
utcTime += ((seconds < 10) ? ":0" : ":") + seconds
if (hours - 8 < 0) { var pstTime = "" + (hours - 8 + 24) }
else { var pstTime = "" + (hours - 8) }
pstTime += ((minutes < 10) ? ":0" : ":") + minutes
pstTime += ((seconds < 10) ? ":0" : ":") + seconds
if (hours - 7 < 0) { var mstTime = "" + (hours - 7 + 24) }
else { var mstTime = "" + (hours - 7) }
mstTime += ((minutes < 10) ? ":0" : ":") + minutes
mstTime += ((seconds < 10) ? ":0" : ":") + seconds
if (hours - 6 < 0) { var cstTime = "" + (hours - 6 + 24) }
else { var cstTime = "" + (hours - 6) }
cstTime += ((minutes < 10) ? ":0" : ":") + minutes
cstTime += ((seconds < 10) ? ":0" : ":") + seconds
if (hours - 5 < 0) { var estTime = "" + (hours - 5 + 24) }
else { var estTime = "" + (hours - 5) }
estTime += ((minutes < 10) ? ":0" : ":") + minutes
estTime += ((seconds < 10) ? ":0" : ":") + seconds
document.getElementById("PST").value = pstTime
document.getElementById("MST").value = mstTime
document.getElementById("CST").value = cstTime
document.getElementById("EST").value = estTime
document.getElementById("UTC").value = utcTime
timerID = setTimeout("showtime()",1000)
timerRunning = true
}
</SCRIPT> - The HTML:
<center><b>PST</b> <INPUT TYPE="text" SIZE=11 VALUE ="....Initializing...." id="PST" style="border-style:none;background-color:transparent">
<b>MST</b> <INPUT TYPE="text" SIZE=11 VALUE ="....Initializing...." id="MST" style="border-style:none;background-color:transparent">
<b>CST</b> <INPUT TYPE="text" SIZE=11 VALUE ="....Initializing...." id="CST" style="border-style:none;background-color:transparent">
<b>EST</b> <INPUT TYPE="text" SIZE=11 VALUE ="....Initializing...." id="EST" style="border-style:none;background-color:transparent">
<b>UTC</b> <INPUT TYPE="text" SIZE=11 VALUE ="....Initializing...." id="UTC" style="border-style:none;background-color:transparent">
<img src="/1px.png" onLoad="startclock()"></link><center>
The <img ...> is used to trigger the "onLoad" command as I didn't have access to the <body> tag in SharePoint. 1px.png is simply a single transparent pixel.
friendfeed
linkedin
skype
identi.ca
twitter
utterli
plurk
brightkite
facebook
1 comments:
I tried putting both of the code blocks into a Content Editor Web Part, and the clocks just show "....Initializing...." for each zone without ever loading any times. There is also a broken image icon on the right side. Am I doing something wrong? I'm not exactly an experienced coder.
Post a Comment