window.addEventListener?window.addEventListener("load",init,false):window.attachEvent("onload",init);

var d=document, li = null, div1 = null, div2 = null, divNext = null, divBack = null, curMenu = "", intervalID, strCurOverviewNumber = "1";

function init() {
	if(!d.getElementById || !d.createElement)return;

	var string = strImageName + "1";

	div1 = d.getElementById("div1");
	div2 = d.getElementById("div2");

	div1.style.background="url(/resources/img/" + string + ".png) no-repeat";
	curMenu = string;
	
	fade_init(div1, div2);

	setAnimation();
}

function fade_init(obj1, obj2){

	obj1.xOpacity = 0;
	obj2.xOpacity = 0;
	
	setOpacity(obj2);
	setTimeout(fade,20);
}
	
function setOpacity(obj) {

	if(obj.xOpacity > 1) {
		obj.xOpacity = 1;
		return;
	}
	if(obj.xOpacity < 0) {
		obj.xOpacity = 0;
		return;
	}
	
	obj.style.opacity = obj.xOpacity;
	obj.style.MozOpacity = obj.xOpacity;
	obj.style.filter = "alpha(opacity=" + (obj.xOpacity*100) + ")";
}

function fade() {
	
	nOpacity = div1.xOpacity;
	nOpacity+=0.05;
	div1.xOpacity = nOpacity;

	setOpacity(div1);
	
	if(nOpacity < 1) {
		setTimeout(fade,50);
	}
}

function changeFade() {
	
	nBackOpacity = divBack.xOpacity;
	nBackOpacity-=0.05;
	divBack.xOpacity = nBackOpacity;
	
	nNextOpacity = divNext.xOpacity;
	nNextOpacity+=0.05;
	divNext.xOpacity = nNextOpacity;

	setOpacity(divBack);
	setOpacity(divNext);
	
	if((nBackOpacity > 0) || (nNextOpacity < 1)) {
		setTimeout(changeFade,50);
	}
	else
	{
		divBack.xOpacity = 0;
		setOpacity(divBack);
	}
}

function animateOverview(string) {

	var prevObj;
	
	if(curMenu != string)
	{
		curMenu = string;
		
		div1 = d.getElementById("div1");
		div2 = d.getElementById("div2");
		
		if (div1.xOpacity < div2.xOpacity)
		{
			div1.style.background="url(/resources/img/" + string + ".png) no-repeat";
			divNext = div1;
			divBack = div2;
		}
		else {
			div2.style.background="url(/resources/img/" + string + ".png) no-repeat";
			divNext = div2;
			divBack = div1;
		}
		changeFade();
	}
}

function getCurOverview()
{
	return document.getElementById("image_on");
}

function setOverview(obj)
{
	var strId = obj.id;
	strCurOverviewNumber = strId.substr(strId.indexOf("_", 8) + 1, strId.length);
	obj.id = "image_on";
	obj.className = "on";
}

function setCurOverview(obj, string)
{
	clearInterval(intervalID);
		
	var prevObj = getCurOverview();
	var strNumber = strCurOverviewNumber;
	prevObj.id = "image_off_" + strNumber
	prevObj.className = "off";

	setOverview(obj);
	animateOverview(string);
	setAnimation();
}

function setNextOverview()
{
	clearInterval(intervalID);

	var nNumber = 0;
	var nextobj;
	var prevObj = getCurOverview();
	var strNumber = strCurOverviewNumber;

	prevObj.id = "image_off_" + strNumber;
	prevObj.className = "off";

	nNumber = parseInt(strNumber);

	if(nNumber >= nOverviewCount)
		nNumber = 0;
		
	nextobj = document.getElementById("image_off_" + (nNumber + 1));
	
	setOverview(nextobj);
	animateOverview(strImageName + (nNumber + 1));
	setAnimation();
}

function setPrevOverview()
{
	clearInterval(intervalID);

	var nNumber = 0;
	var nextobj;
	var prevObj = getCurOverview();
	var strNumber = strCurOverviewNumber;
	
	prevObj.id = "image_off_" + strNumber;
	prevObj.className = "off";

	nNumber = parseInt(strNumber);

	if(nNumber == 1)
		nNumber = (nOverviewCount + 1);
		
	nextobj = document.getElementById("image_off_" + (nNumber - 1));
	
	setOverview(nextobj);
	animateOverview(strImageName + (nNumber - 1));
	setAnimation();
}


function setAnimation()
{
	intervalID = setInterval("setNextOverview()",5000);
}