// shortcut to show an image from <a> link
function ashowimage(link, width, height)
{
	return showimage(link.href, width, height, link);
}
// load and show an image
function showimage(url, width, height, el)
{
	var body = document.getElementsByTagName('body')[0];
	var img = document.getElementById('fadeimg');
	var div = document.getElementById('fade');

	// make it unfocus
	el.blur();

	if(!div) {
		div = document.createElement('div');
		div.id = 'fade';

		// overflod will be hidden
		div.style.width = '100%';
		div.style.height = '2000px';

		div.style.position = 'absolute';
		div.style.top = '0';
		div.style.left = '0';
		div.style.backgroundColor = '#000000';
		div.onclick = closeimage;
		div.style.display = 'none';
		div.style.filter = 'alpha(opacity=80)'; // IE
		div.style.opacity = '0.8'; // FF/Opera
		div.style.KhtmlOpacity = '0.8'; // old Konqueror
		div.style.overflow = 'hidden';

		load = document.createElement('div');
		load.id = 'loadingimg';
		load.style.backgroundColor = '#000000';
		load.style.color = '#FFFFFF';
		load.style.position = 'absolute';
		load.style.left = '50%';
		load.style.top = '50%';
		load.style.textAlign = 'center';
		load.style.fontSize = '26px';
		load.style.fontFamily = 'Verdana';
		load.innerHTML = 'Loading...';
		load.onclick = closeimage;
		load.style.border = '1px solid #FF9900';
		load.style.display = 'none';
		load.style.cursor = 'pointer';

		img = document.createElement('div');
		img.id = 'fadeimg';
		img.onclick = closeimage;
		img.style.position = 'absolute';
		img.style.top = '0';
		img.style.left = '0';
		img.style.border = '2px solid #000000';
		img.style.cursor = 'pointer';
		img.style.backgroundRepeat = 'no-repeat';

		load.appendChild(img);
		body.appendChild(div);
		body.appendChild(load);
	}

	img.style.width = width + 'px';
	img.style.height = height + 'px';
	load.style.width = eval(width + 4) + 'px';
	load.style.height = eval(height/2 + 4) + 'px';
	img.style.backgroundImage = 'url(' + url + ')';
	load.style.margin = eval(height/2 * -1) + 'px 0 0 ' + eval(width/2 * -1) + 'px';
	load.style.paddingTop = eval(height/2) + 'px';

	body.style.overflow = 'hidden';

	if(width > 0) {
		load.style.display = 'block';
		div.style.display = 'block';
	}

	return false; // return this onclick then the real link is not in effect
}

function closeimage()
{
	var div = document.getElementById('fade');
	var load = document.getElementById('loadingimg');
	var img = document.getElementById('fadeimg');

	load.style.display = 'none';
	div.style.display = 'none';

	img.style.backgroundImage = 'url(/)';
}

