function tooltip(what) {
	var div = document.getElementById('tooltipLayer');
	if (typeof div == 'undefined' || div == null) {
		div = document.createElement('div');
		div.setAttribute('id', 'tooltipLayer');
		div.setAttribute('style', 'z-index: 999999999999;');
		document.body.appendChild(div);
		div.className = 'tooltip';
	}
	while (div.childNodes.length > 0) {
		div.removeChild(div.lastChild);
	}
	div.style.width = "";
	var out = "";
	if (what.getAttribute('tiptitle')) {
		out += "<h1>" + what.getAttribute('tiptitle') + "</h1>";
	}
	var tip = what.getAttribute('tip');
	if (tip > '') {
		out += "<div class='content'>" + tip + "</div>";
	}
	
	if (out > '') {
		if (div.outerWidth > div.style.maxWidth) {
			div.style.width = div.style.maxWidth + "px";
		}
		div.style.position="absolute";
		div.style.top="0px";
		div.style.left="0px";
		div.innerHTML = out;
		if (!what.getAttribute('setMouseOutAlready')) {
			what.setAttribute('setMouseOutAlready', 1);
			var oldMouseOut = what.onmouseout;
			if (typeof oldMouseOut == 'function') {
				what.onmouseout = function(event){
					hideTip();
					oldMouseOut(event);
				}
			} else {
				what.onmouseout = hideTip;
			}
		}
		fadeIn(div, 0.5);
		
		div.style.display = 'block';
		//what.style.cursor = 'help';
		var pos = getPosition(what);
		var top = pos.y;
		var left = pos.x - div.offsetWidth;
		if (left < 0) left += div.offsetWidth;
		div.style.top = top + "px";
		div.style.left = left + "px";
	} else {
		hideTip();
	}
}
function hideTip() {
	fadeOut(document.getElementById('tooltipLayer'), 1);
}
function fadeIn(what, duration, oldTimeout) {
	oldTimeout = what.getAttribute('timeout');
	if (oldTimeout) {
		if (clearTimeout(oldTimeout)) {
			//what.innerHTML += "Cleared fadeIn<br>";
		}
	}
	var startTime = what.getAttribute('opacityStartTime');
	var fading = what.getAttribute('fading');
	var date = new Date();
	var now = date.getMilliseconds()/1000 + date.getSeconds() + date.getMinutes() * 60 + date.getHours() * 3600;
	var timeout;
	
	if (typeof fading == 'undefined' || fading != "+") {
		// initialization clause
		startTime = now;
		if (what.getAttribute('opacity') != null) {
			startTime -= what.getAttribute("opacity") * duration;
		}
		what.setAttribute("fading","+");
		what.setAttribute('opacityStartTime', startTime);
		what.style.display = '';
	}
	var elapsed = now - startTime;
	if (duration <= 0) {
		var opacity = 1;
	} else {
		var opacity = elapsed / duration;
	}
	if (opacity >= 1) {
		// termination clause
		opacity = 1;
		what.setAttribute("opacityStartTime", 0);
		what.setAttribute("timeout", 0);
		what.setAttribute('fading', '');
	}else {
		if (opacity <= 0) {
			what.setAttribute("opacityStartTime", now);
			what.style.display='none';
		} else {
			what.style.display='';
		}
		what.setAttribute("timeout", setTimeout(function(){fadeIn(what, duration);}, duration / 5000));
	}
	// Everyone important's version
	what.style.opacity = opacity;
	// IE's version
	what.style.filter="alpha(opacity="+(opacity*100)+")";
	// Used if the direction of the fade is changed part-way through
	what.style.opacity = opacity;
	what.setAttribute('opacity', opacity);
	return timeout;
}
function fadeOut(what, duration) {
	oldTimeout = what.getAttribute('timeout');
	if (oldTimeout) {
		if (clearTimeout(oldTimeout)) {
			//what.innerHTML += "Cleared fadeOut<br>";
		}
	}
	var startTime = what.getAttribute('opacityStartTime');
	var fading = what.getAttribute('fading');
	var date = new Date();
	var now = date.getMilliseconds()/1000 + date.getSeconds() + date.getMinutes() * 60 + date.getHours() * 3600;
	var timeout;
	
	if (typeof fading == 'undefined' || fading != "-") {
		// initialization clause
		startTime = now;
		if (fading == "+") {
			startTime -= (1 - what.getAttribute("opacity")) * duration;
		}
		what.setAttribute('opacityStartTime', startTime);
		what.setAttribute("fading","-");
		var fadingOut = true;
	}
	var elapsed = now - startTime;
	var opacity = 1.0 - (elapsed / duration);
	if (opacity <= 0) {
		// termination clause
		opacity = 0;
		what.setAttribute("opacityStartTime", 0);
		what.style.display = 'none';
		what.setAttribute("timeout", 0);
		what.setAttribute('fading', '');
	}else {
		// continuation clause
		what.setAttribute('timeout',setTimeout(function(){fadeOut(what, duration);}, duration / 5000));
	}
	// Everyone important's version
	what.style.opacity = opacity;
	// IE's version
	what.style.filter="alpha(opacity="+(opacity*100)+")";
	// Used if the direction of the fade is changed part-way through
	what.setAttribute('opacity', opacity);
	return timeout;
}
function getPosition(what) {
	var pos = $(what).offset();
	return {x:pos.left, y:pos.top};
}
function callout(contentElement, text) {
	// accept either an object reference or the ID of an object as a string.
	if (typeof contentElement == 'string') {
		contentElement = document.getElementById(contentElement);
	}
	var balloon = document.getElementById('calloutBalloon');
	if (typeof balloon == 'undefined' || balloon == null) {
		var calloutDiv =   '<div id="calloutBalloon" class="callout" style="display: none; z-index:9999999999;"'
			+ ' onmouseout="fadeOut(window.calloutBalloon, 0.5);fadeOut(window.calloutPointer, 0.5);"'
			+ ' onmouseover="fadeIn(window.calloutBalloon, 0.5);fadeIn(window.calloutPointer, 0.5);">'
			+ '</div>'
			+ '<div class="calloutPointer" id="calloutPointer" style="display: none; z-index:9999999998;">'
			+ '<img src="images/vsh/calloutpointer.gif" width="22" height="18" alt="" title="" />'
			+ '</div>';
		$(calloutDiv).appendTo("body");
		
		
		balloon = document.getElementById('calloutBalloon');
		window.calloutBalloon = balloon;
		window.calloutPointer = document.getElementById('calloutPointer');
	}
	if (typeof text == 'string') {
		window.calloutBalloon.innerHTML = text;
	} else {
		window.calloutBalloon.innerHTML = contentElement.innerHTML;
	}
	var pos = getPosition(contentElement);
	window.calloutBalloon.style.left = pos.x + "px";
	window.calloutBalloon.style.top = pos.y + "px";
	window.calloutPointer.style.left = window.calloutBalloon.style.left;
	window.calloutPointer.style.top = window.calloutBalloon.style.top;
	window.calloutPointer.onmouseover = window.calloutBalloon.onmouseover;
	window.calloutPointer.onmouseout = window.calloutBalloon.onmouseout;
	
	window.calloutBalloon.onmouseover();
	
	if (typeof contentElement.oldMouseOut != 'function') {
		if (typeof contentElement.onmouseout == 'function') {
			contentElement.oldMouseOut = contentElement.onmouseout;
		} else {
			contentElement.oldMouseOut = function(){};
		}
	}
	contentElement.onmouseout = function() { this.oldMouseOut(); window.calloutBalloon.onmouseout(); };
}

