/////////////////////////////Image preloading script, with "loading" image. Version 1.2. 06.07.2009 20:37///////////////////////////
/////////////////////////////////////////////////When something simplier is needed...///////////////////////////////////////////////
///////////////Made with help of Google by Andrei Tretiakov, an-tre.com. This script is free to use, distribute and modify./////////

var	winWidth = 0,	// window width
	winHeight = 0,	// window height
	imgGl,		// global called image -> object
	imgGlName,	// global called image -> name
	scrolledX = 0,	// scrolled from left
	scrolledY = 0;	// scrolled from top

function GetWindowWidthHeight()	// getting browser window inner size
{
	if (typeof(window.innerWidth) == 'number') // Any non-IE
	{
		winWidth = window.innerWidth;
		winHeight = window.innerHeight;
	} 
	else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) // IE6+
	{
		winWidth = document.documentElement.clientWidth;
		winHeight = document.documentElement.clientHeight;
	}
	else if (document.body && (document.body.clientWidth || document.body.clientHeight)) // IE4 compatible
	{
		winWidth = document.body.clientWidth;
		winHeight = document.body.clientHeight;
	}
	GetScrolledXY();
}

function GetScrolledXY() 
{
	if(typeof(window.pageYOffset) == 'number')
	{
		scrolledX = window.pageXOffset;
		scrolledY = window.pageYOffset;
	}
	else if(document.body && (document.body.scrollLeft || document.body.scrollTop))
	{
		scrolledX = document.body.scrollLeft;
		scrolledY = document.body.scrollTop;
	}
	else if(document.documentElement && (document.documentElement.scrollLeft || document.documentElement.scrollTop))
	{
		scrolledX = document.documentElement.scrollLeft;
		scrolledY = document.documentElement.scrollTop;
	}
}

function Opacitor(eid, opFrom, opTo, ms)	// change opacity of object from opFrom to opTo
{
	var	s = Math.round(ms / 100),	// 100 - OpacityChange framerate, ms
		t = 0;
	
	if(opFrom > opTo)
	{
		for(i = opFrom; i >= opTo; i--)
		{
			setTimeout("OpacityChange(" + i + ",\"" + eid + "\")", (s * t));
			t++;
		}
	}
	else
	{
		for(i = opFrom; i <= opTo; i++)
		{
			setTimeout("OpacityChange(" + i + ",\"" + eid + "\")", (s * t));
			t++;
		}
	}
}

function OpacityChange(opacity, eid)	// change opacity - object ID only!
{
	var obj = document.getElementById(eid).style;
	obj.opacity = (opacity / 100);					// Non-IE
	obj.filter = "alpha(opacity=" + opacity + ")";	// Any IE
}

function SwitchOpacity(id, ms, fadeto)	// change opacity -> fade in or out
{
	var obj = document.getElementById(id).style;
	if(obj.opacity == 0)
	{
		Opacitor(id, 0, fadeto, ms);	// fade in
	}
	else
	{
		Opacitor(id, fadeto, 0, ms);	// fade out
	} 
}

function ReplaceLoaderByImg()	// find and replace "loading" image by called global image
{
	var img_cont = document.getElementById('imgc');
	if(img_cont.src != imgGlName)
	{
		if (imgGl && (imgGl.complete || imgGl.complete==null))
		{
			img_cont.src = imgGl.src;
			img_cont.style.opacity = 0;
			img_cont.style.filter = "alpha(opacity=0)";
			var obj = document.getElementById('innerDiv').style;
			GetWindowWidthHeight();
			obj.width = img_cont.width + 20 + "px";
			obj.height = img_cont.height + 20 + "px";
			obj.top = scrolledY + (winHeight / 2) - (img_cont.height) / 2 + "px";
			obj.left = scrolledX + (winWidth / 2) - (img_cont.width + 20) / 2 + "px";
			Opacitor('imgc', 0, 100, 300);
			
			/*var cDiv = document.createElement('div');
			cDiv.innerHTML = "<div style=\"position: absolute; top: " + (((winHeight / 2) - (img_cont.height) / 2) - 10) + "; left: " + (((winWidth / 2) - (img_cont.width + 20) / 2) + img_cont.width + 10) + "; z-index: 99; border: 1px solid #e20807; background-color: #ffffff; visibility: visible;\"><a title=\"click to close\" href=\"javascript:;\" onclick=\"ToggleVisibility('"+imgGlName+"')\"><img src=\"i/c.png\" border=\"0\" alt=\"\" /></a></div>";
			document.getElementById('innerDiv').appendChild(cDiv);*/
			
			imgGl = null;
		}
		else
		{
			imgGl = new Image;
			imgGl.src = imgGlName;
			setTimeout("ReplaceLoaderByImg()", 1111);	// 1111 - pause to check if global image loading is complete, ms
		}
	}
}

function ToggleVisibility(imgName)	// show or hide divs with global image
{
	var	imgWidth = 20,	// width of "loading" image
		imgHeight = 20,	// height of "loading" image
		outerContSt = document.getElementById('outerDiv').style,
		innerContSt = document.getElementById('innerDiv').style,
		innerCont = document.getElementById('innerDiv'),
		newDiv;
	
	GetWindowWidthHeight();
	
	if(outerContSt.visibility != "visible")	// show divs
	{
		if(document.body.scrollWidth >= winWidth) outerContSt.width = document.body.scrollWidth + "px";
		else outerContSt.width = winWidth + "px";
		if(document.body.scrollHeight >= winHeight) outerContSt.height = document.body.scrollHeight + "px";
		else outerContSt.height = winHeight + "px";
		outerContSt.backgroundColor = "#160800";
		outerContSt.filter = "alpha(opacity=0)";
		outerContSt.opacity = 0;
		outerContSt.visibility = "visible";
		SwitchOpacity('outerDiv', 300, 77);

		newDiv = document.createElement('div');
		imgGlName = imgName;
		newDiv.innerHTML = "<div><a title=\"click to close\" href=\"javascript:;\" onclick=\"ToggleVisibility('"+imgName+"')\"><img id=\"imgc\" src=\"i/l.gif\" border=\"0\" hspace=\"10\" vspace=\"10\" alt=\"\" /></a></div>";	// actual container div for image
		
		innerContSt.width = imgWidth + 20 + "px";		// width of "loading" image + 20px
		innerContSt.height = imgHeight + 20 + "px";	// height of "loading" image + 20px
		innerContSt.position = "absolute";
		innerContSt.top = scrolledY + (winHeight / 2) - (imgHeight + 20) / 2 + "px";
		innerContSt.left = scrolledX + (winWidth / 2) - (imgWidth + 20) / 2 + "px";
		innerContSt.backgroundColor = "#FFFFFF";
		innerContSt.filter = "alpha(opacity=100)";
		innerContSt.opacity = 1;
		innerContSt.visibility = "visible";
		innerContSt.border = "1px solid #e20807";

		innerCont.appendChild(newDiv);
		
		if(document.getElementById('imgc').src != imgName) ReplaceLoaderByImg(); // divs are loaded, "loading" image is loaded, must change it to global called image
	}
	else	// hide divs
	{
		while (document.getElementById('innerDiv').hasChildNodes())	// remove children of container div
		{
			document.getElementById('innerDiv').removeChild(document.getElementById('innerDiv').firstChild);
		}				
		outerContSt.width = "0px";
		outerContSt.height = "0px";
		outerContSt.filter = "alpha(opacity=0)";
		outerContSt.opacity = 0;
		outerContSt.visibility = "hidden";
		innerContSt.visibility = "hidden";
	}
}