122f33fbd6
Now allowing for display of the time in the original timezone as well as the user selected one. I've also added a rule to the CSS file to better display the selection list on mobile screens.
52 lines
2.5 KiB
JavaScript
52 lines
2.5 KiB
JavaScript
/*Clock functionality. When the page is loaded it starts a one second
|
|
* long loop to update the time displayed on the page.
|
|
*/
|
|
window.onload = startInterval;
|
|
function startInterval(){
|
|
setInterval("startTime();",1000);
|
|
}
|
|
/* The function to update and format the time displayed on the page.
|
|
* The formating of Date() objects useing .toLocalString() is documented
|
|
* at the following urls:
|
|
* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/DateTimeFormat
|
|
* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleString
|
|
*/
|
|
function startTime(){
|
|
var current_time = new Date(),
|
|
our_tz = current_time.getTimezoneOffset;
|
|
document.getElementById('time_title').innerHTML = "Time is: "
|
|
+ current_time.toLocaleString('en-US',
|
|
{timeZone: current_tz,
|
|
hourCycle:'h24',
|
|
timeStyle:'long',
|
|
hour: '2-digit',
|
|
minute:'2-digit',
|
|
second:'2-digit',
|
|
timeZoneName:'short'});
|
|
document.getElementById('time_body').innerHTML = current_time.toLocaleString('en-EN' ,{
|
|
timeZone: current_tz,
|
|
dateStyle:'long',
|
|
hourCycle:'h24',
|
|
weekday:'short',
|
|
month:'short',
|
|
day:'2-digit',
|
|
year:'numeric',
|
|
hour:'2-digit',
|
|
minute:'2-digit',
|
|
second:'2-digit',});
|
|
if(original_tz != null){
|
|
document.getElementById('time_original').innerHTML = current_time.toLocaleString('en-EN' ,{
|
|
timeZone: original_tz,
|
|
dateStyle:'long',
|
|
hourCycle:'h24',
|
|
weekday:'short',
|
|
month:'short',
|
|
day:'2-digit',
|
|
year:'numeric',
|
|
hour:'2-digit',
|
|
minute:'2-digit',
|
|
second:'2-digit'});
|
|
}
|
|
document.getElementById('JStz').innerHTML = current_tz;
|
|
}
|