World Time for 22 World Capitals on Doubleclick

World Time for 22 World Capitals on Doubleclick
Just doubleclick anywhere on the white space of this webpage and the local time of 22 capitals will appear. Doubleclick again and the worldtime will disappear. Easy. Smart. Useful. CROSSBROWSER

Configuration:

Step 1: Open your webpage. Paste the following code right above the </body> tag (bottom of webpage):

.explainstyle {
position:absolute; 
left:-200px; 
top:120px;
font-family:Verdana;
font-size:8pt;
color:#000000;
}
</style>
<script>
// CREDITS:
// World Time on Doubleclick by Peter Gehrig 
// Copyright (c) 2010 Peter Gehrig. All rights reserved.
// Permission given to use the script provided that this notice remains as is.
// Additional scripts can be found at http://www.fabulant.com.

// IMPORTANT: 
// If you add this script to a script-library or script-archive 
// you have to add a link to http://www.fabulant.com on the webpage 
// where this script will be running.

// Add as many locations as you like. The value right after the capital 
// represents the capital's time difference to GMT-time measured in hours
var worldtime = new Array()
worldtime[0]="Azores,-1"
worldtime[1]="Baghdad,3"
worldtime[2]="Beijing,8"
worldtime[3]="Berlin,1"
worldtime[4]="Buenos Aires,-3"
worldtime[5]="Chicago,-6"
worldtime[6]="Denver,-7"
worldtime[7]="Hong Kong,8"
worldtime[8]="Honolulu,-10"
worldtime[9]="Johannesburg,2"
worldtime[10]="Kairo,2"
worldtime[11]="Lima,-5"
worldtime[12]="London,0"
worldtime[13]="Mexico City,-6"
worldtime[14]="Moscow,3"
worldtime[15]="New York,-5"
worldtime[16]="Paris,1"
worldtime[17]="Perth,8"
worldtime[18]="Rio de Janheiro,-2"
worldtime[19]="San Francisco,-8"
worldtime[20]="Sydney,11"
worldtime[21]="Tokyo,9"

var hours
var shifthours
var minutes
var seconds
var localhours
var pause=2000
var thisplace
var thisline=""
var showmenu=1
var ns6=!document.all&&document.getElementById

function showtime() {
	for (i=0; i<=worldtime.length-1;i++) {
		thisplace=worldtime[i].split(",")
		thistime= new Date()
		hours=thistime.getUTCHours()
		hours=eval(hours)
		shifthours=eval(thisplace[1])
		localhours=eval(shifthours+hours)
		if (localhours <0) {localhours=24+localhours}
		if (localhours >=24) {localhours=localhours-24}
	
		minutes=thistime.getUTCMinutes()
		seconds=thistime.getUTCSeconds()
	
		if (thisplace[0]=='Delhi') {
			minutes=eval(minutes+30)
			if (minutes>=60) {
				minutes=eval(minutes-60)
				localhours=eval(localhours+1)
			}
		}
		if (eval(minutes) < 10) {minutes="0"+minutes}
		if (eval(seconds) < 10) {seconds="0"+seconds}
		if (eval(localhours) < 10) {localhours="0"+localhours}
		thisline+=localhours+":"+minutes+":"+seconds+" "+thisplace[0]+"<br>"
	}
		document.getElementById('timediv').innerHTML=thisline
		thisline=""
		var timer=setTimeout("showtime()",1000)
}
	
function dblclick() {
	if (showmenu==1) {
		document.getElementById('timediv').style.visibility="visible"
		document.getElementById('timediv').style.left=x
		document.getElementById('timediv').style.top=y
		showtime()
	}

if (showmenu!=1) {
		document.getElementById('timediv').style.visibility="hidden"
	}

showmenu=showmenu*-1
}

if (ns6) {
document.captureEvents(Event.ONDBLCLICK);
}
document.ondblclick=dblclick;

if (ns6){
	document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = handlerMM;

function handlerMM(e){
	x = (ns6) ? e.pageX : event.clientX
	y = (ns6) ? e.pageY : event.clientY
}

document.write("<div id='timediv' class='timestyle'></div>")
</script>

Step 2: Go on top of the code and configure the style elements.