var fadeSp = 20;

var tabIntvl; // Main menu fade interval

var subIntvl; // Submenu fade in/out interval

var tmtIntvl; // Submenu timeout interval

var smiIntvl; // Submenu item interval

 // Detect browswer type and version

var MSIE = false;

var IE56 = false;

function detectBrowser() {

	if (navigator.appVersion.indexOf("MSIE") > -1) {

		var arVersion = navigator.appVersion.split("MSIE");

		var version = parseFloat(arVersion[1]);

		if (version >= 5.5 && version < 7) {

			IE56 = true; 

		}

		MSIE = true;

	}

}

detectBrowser();

 

// Get browser window size

function getWinSize() {

	var size = new Array();

	var width = 0; 

	var height = 0;

	if (typeof(window.innerWidth) == "number") {

		//Non-IE

		width = window.innerWidth;

		height = window.innerHeight;

	} else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {

		//IE 6+ in 'standards compliant mode'

		width = document.documentElement.clientWidth;

		height = document.documentElement.clientHeight;

	} else if (document.body && (document.body.clientWidth || document.body.clientHeight)) {

		//IE 4 compatible

		width = document.body.clientWidth;

		height = document.body.clientHeight;

	}

	size.push(width);

	size.push(height);

	return size;

}

 

// Cross-browser image rendering

function createImage(url, width, height, id, title) {

	var img;

	if (imgPath && url.indexOf("/") == -1) {

		url = imgPath + url;

	}

	var imgType = (url.substr(url.lastIndexOf(".")+1)).toLowerCase();

	if (IE56 && imgType == "png") {

		img = document.createElement("span");

		img.contentEditable = "true";

		img.style.width = width + "px";

		img.style.height = height + "px";

		img.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + url + "', sizingMethod='scale')";

		if (id) {

			img.id = id;

		}

	} else {

		img = document.createElement("img");

		img.setAttribute("src", url);

		img.setAttribute("width", width.toString());

		img.setAttribute("height", height.toString());

		img.setAttribute("alt", "");

		if (id) {

			img.id = id;

		}

		if (title) {

			img.setAttribute("title", title);

		}

	}

	return img;

}



// Cross-browser event listener

function addEvent(elem, evtType, func) {

	if (elem.addEventListener) {

		elem.addEventListener(evtType, func, false);

	} else if (elem.attachEvent) {

		elem.attachEvent("on" + evtType, func);

	} else {

		elem["on" + evtType] = func;

	}

}



// Create main menu
// Create main menu
function initMainMenu(x, y) {
	var mainMenu = document.createElement("div");
	mainMenu.id = "mainMenu";
	// Create main menu items
	for (var i = 0; i < 5; i++) {
		var item = document.createElement("span");
		item.id = "item"+i;
		item.className = "mainitem";
		// Add bottom image
		var imgSpan = document.createElement("span");
		imgSpan.id = "imgSpan"+i;
		imgSpan.style.zIndex = "0";
		var imgLeft = createImage("main_0_left.png", 10, 40, "imgLeft"+i);
		imgSpan.appendChild(imgLeft);
		var imgMid = createImage("main_0_mid.png", 130, 40, "imgMid"+i, mainItems[i][0]);
		imgSpan.appendChild(imgMid);
		var imgRight = createImage("main_0_right.png", 10, 40, "imgRight"+i);
		imgSpan.appendChild(imgRight);
		item.appendChild(imgSpan);
		// Add top image
		var imgSpan2 = document.createElement("span");
		imgSpan2.id = "imgSpan2"+i;
		imgSpan2.style.zIndex = "1";
		var imgLeft2 = createImage("main_1_left.png", 10, 50, "imgLeft2"+i);
		imgSpan2.appendChild(imgLeft2);
		var imgMid2 = createImage("main_1_mid.png", 130, 50, "imgMid2"+i, mainItems[i][0]);
		imgSpan2.appendChild(imgMid2);
		var imgRight2 = createImage("main_1_right.png", 10, 50, "imgRight2"+i);
		imgSpan2.appendChild(imgRight2);
		item.appendChild(imgSpan2);
		// Add text
		var txt = document.createTextNode(mainItems[i][0]);
		var txt2 = document.createTextNode(mainItems[i][1]);
		var sp = document.createElement("span");
		var sp2 = document.createElement("span");
		sp.id = "sp"+i;
		sp2.id = "sp2"+i;
		var br = document.createElement("br");
		sp.appendChild(txt);
		sp2.appendChild(txt2);
		sp.className = "bold";
		sp2.className = "small";
		var txtSpan = document.createElement("span");
		txtSpan.id = "txtSpan"+i;
		txtSpan.style.zIndex = "2";
		txtSpan.appendChild(sp);
		txtSpan.appendChild(br);
		txtSpan.appendChild(sp2);
		item.appendChild(txtSpan);
		// Add icon to menu item
		var icn = createImage("main_icon.gif", 7, 6, "icn"+i);
		var icnSpan = document.createElement("span");
		icnSpan.id = "icnSpan"+i;
		icnSpan.style.zIndex = "3";
		icnSpan.appendChild(icn);
		item.appendChild(icnSpan);
		// Add item to menu
		mainMenu.appendChild(item);
	}
	// Add submenu to document
	//document.body.appendChild(mainMenu);
	var prt = document.getElementById("menuPrt");
	prt.appendChild(mainMenu);
	var totalWidth = 0;
	for (var i = 0; i < 5; i++) {
		// Position items
		var item = document.getElementById("item"+i);
		var imgSpan = document.getElementById("imgSpan"+i);
		var imgSpan2 = document.getElementById("imgSpan2"+i);
		var imgMid = document.getElementById("imgMid"+i);
		var imgMid2 = document.getElementById("imgMid2"+i);
		var txtSpan = document.getElementById("txtSpan"+i);
		var sp = document.getElementById("sp"+i);
		var sp2 = document.getElementById("sp2"+i); 
		imgSpan2.style.position = "absolute";
		imgSpan2.style.left = imgSpan.offsetLeft + "px";
		var txtWidth = (sp.offsetWidth >= sp2.offsetWidth) ? sp.offsetWidth : sp2.offsetWidth;
		imgMid.style.width = txtWidth + 30+ "px";
		imgMid2.style.width = txtWidth + 30 + "px";
		if (MSIE) {
			txtSpan.style.filter = "alpha(opacity=100)";
			icnSpan.style.filter = "alpha(opacity=100)";	
			imgSpan.style.filter = "alpha(opacity=100)";
			imgSpan2.style.filter = "alpha(opacity=0)";
		} else {
			imgSpan2.style.opacity = "0";
		}
		txtSpan.style.position = "absolute";
		//txtSpan.style.left = imgSpan.offsetLeft + (imgSpan.offsetWidth-txtSpan.offsetWidth)/2 + 4 + "px";
		txtSpan.style.left = imgSpan.offsetLeft + (imgSpan.offsetWidth-txtWidth)/2 + 4 + "px";
		txtSpan.style.top = (imgMid.offsetHeight-txtSpan.offsetHeight)/2 + "px";
		// Position icon
		var icnSpan = document.getElementById("icnSpan"+i);
		icnSpan.style.position = "absolute";
		icnSpan.style.left = imgSpan.offsetLeft + 10 + "px";
		icnSpan.style.top = txtSpan.offsetTop + (sp.offsetHeight-icnSpan.offsetHeight)/2 + ((MSIE) ? 1 : 0) + "px";
		//icnSpan.style.top = (imgMid.offsetHeight-icnSpan.offsetHeight)/2 + "px";
		item.style.cursor = "pointer";
		totalWidth += item.offsetWidth + 1;
		// Add events
		addEvent(item, "mouseover", initSubMenu);
		addEvent(item, "mouseover", timeMenu);
		addEvent(item, "mouseover", fadeTabs);
		addEvent(item, "mouseout", timeMenu);
		addEvent(item, "click", gotoPage);
	}
	// Stretch parent element to fit menu
	prt.style.width = totalWidth + "px";
	// Position menu
	mainMenu.style.position = "absolute";
	mainMenu.style.top = y + "px";
	mainMenu.style.left = x + "px";
}


// Create submenu

function initSubMenu(evt) {

	var index;

	evt = (evt) ? evt : ((window.event) ? window.event : null);

	if (evt) {

		var target = (MSIE) ? evt.srcElement : evt.target;

		var id = target.id;

		index = parseInt(id.substr(id.length-1));

	}

	// Remove sub menu

	if (index != undefined && 

		document.getElementById("subMenu"+index) == undefined) 

	{

		removeSubMenu();

	}

	if (index != undefined && 

		subItems[index].length > 0 && 

		document.getElementById("subMenu"+index) == undefined) 

		{

		var subMenu = document.createElement("div");

		subMenu.id = "subMenu"+index;

		// Create submenu items

		for (var i = 0; i < subItems[index].length; i++) 

		{

			var item = document.createElement("span");

			

			if(i == 0)

			{

				//alert(item);

			}

			

			item.id = "subItem"+i;

			item.className = "subitem";

			// Add bottom image

			var imgSpan = document.createElement("span");

			imgSpan.id = "subImgSpan"+i;

			imgSpan.style.zIndex = "0";

			if (i == 0) {

				// Add left end to submenu

				var imgLeft = createImage("sub_0_left.png", 10, 30, "subImgLeft"+i);

				imgSpan.appendChild(imgLeft);

			}

			var imgMid = createImage("sub_0_mid.png", 100, 30, "subImgMid"+i, subItems[index][i]);

			imgSpan.appendChild(imgMid);

			if (i == subItems[index].length-1) {

				// Add right end to submenu

				var imgRight = createImage("sub_0_right.png", 10, 30, "subImgRight"+i);

				imgSpan.appendChild(imgRight);

			}

			item.appendChild(imgSpan);

			// Add top image

			var imgSpan2 = document.createElement("span");

			imgSpan2.id = "subImgSpan2"+i;

			imgSpan2.style.zIndex = "1";

			if (i == 0) {

				// Add left end to submenu

				var imgLeft2 = createImage("sub_1_left.png", 10, 30, "subImgLeft2"+i);

				imgSpan2.appendChild(imgLeft2);

			}

			var imgMid2 = createImage("sub_1_mid.png", 130, 30, "subImgMid2"+i, subItems[index][i]);

			imgSpan2.appendChild(imgMid2);

			if (i == subItems[index].length-1) {

				// Add right end to submenu

				var imgRight2 = createImage("sub_1_right.png", 10, 30, "subImgRight2"+i);

				imgSpan2.appendChild(imgRight2);

			}

			item.appendChild(imgSpan2);

			// Add text

			var txt = document.createTextNode(subItems[index][i]);

			var txtSpan = document.createElement("span");

			txtSpan.id = "subTxtSpan"+i;

			txtSpan.style.zIndex = "2";

			txtSpan.appendChild(txt);

			item.appendChild(txtSpan);

			// Add icon to menu item

			var icn = createImage("sub_icon.gif", 6, 7, "subIcn"+i);

			var icnSpan = document.createElement("span");

			icnSpan.id = "subIcnSpan"+i;

			icnSpan.style.zIndex = "3";

			icnSpan.appendChild(icn);

			item.appendChild(icnSpan);

			// Add item separator

			if (i < subItems[index].length-1) {

				var sep = createImage("sub_sep.png", 1, 30);

				var sepSpan = document.createElement("span");

				sepSpan.appendChild(sep);

				sepSpan.id = "sepSpan"+i;

				sepSpan.style.zIndex = "4";

				item.appendChild(sepSpan);

			}

			

			//Add item to submenu

			subMenu.appendChild(item);

		}

		// Add submenu to document

		//document.body.appendChild(subMenu);

		var prt = document.getElementById("menuPrt");

		prt.appendChild(subMenu);

		var totalWidth = 0;

		for (var i = 0; i < subItems[index].length; i++) {

			// Position item text

			var item = document.getElementById("subItem"+i);

			var imgSpan = document.getElementById("subImgSpan"+i);

			var imgSpan2 = document.getElementById("subImgSpan2"+i); 

			var txtSpan = document.getElementById("subTxtSpan"+i);

			var imgMid = document.getElementById("subImgMid"+i);

			var imgMid2 = document.getElementById("subImgMid2"+i);

			var txtWidth = txtSpan.innerHTML.length * 6; 

			var txtHeight = txtSpan.offsetHeight;

			imgMid.style.width = txtWidth + 44 + "px";

			imgMid2.style.width = txtWidth + 44 + "px";

			imgSpan2.style.position = "absolute";

			imgSpan2.style.left = imgSpan.offsetLeft + "px";

			if (MSIE) {

				txtSpan.style.filter = "alpha(opacity=100)";

				icnSpan.style.filter = "alpha(opacity=100)";

				imgSpan.style.filter = "alpha(opacity=100)";

				imgSpan2.style.filter = "alpha(opacity=0)";

			} else {

				imgSpan.style.opacity = "1";

				imgSpan2.style.opacity = "0";

			}

			txtSpan.style.position = "absolute";

			txtSpan.style.left = imgSpan.offsetLeft + (imgSpan.offsetWidth-txtWidth)/2 + 4 + "px";

			txtSpan.style.top = (imgMid.offsetHeight-txtSpan.offsetHeight)/2 + "px";

			// Position icon

			var icnSpan = document.getElementById("subIcnSpan"+i);

			icnSpan.style.position = "absolute";

			icnSpan.style.left = imgSpan.offsetLeft + 10 + "px";

			icnSpan.style.top = (imgMid.offsetHeight-icnSpan.offsetHeight)/2 + "px";

			// Position separators

			if (i < subItems[index].length-1) {

				var sepSpan = document.getElementById("sepSpan"+i);

				sepSpan.style.position = "absolute";

				sepSpan.style.left = imgSpan.offsetLeft + (imgSpan.offsetWidth-1) + "px";

			}

			item.style.cursor = "pointer";

			totalWidth += item.offsetWidth;

			// Add events

			addEvent(item, "mouseover", timeMenu);

			addEvent(item, "mouseover", fadeItems);

			addEvent(item, "mouseout", fadeItems);

			addEvent(item, "mouseout", timeMenu);

			addEvent(item, "click", gotoPage);

		}

		subMenu.style.width = totalWidth + "px";

		// Position submenu

		var mainMenu = document.getElementById("mainMenu");

		var trigElem = document.getElementById("item"+index);

		//var maxRight = getWinSize()[0]/2;

		//var initLeft = mainMenu.offsetLeft+trigElem.offsetLeft;

		//var x = (initLeft > maxRight) ? initLeft-mainMenu.offsetWidth+300 : initLeft-100;

		var x = mainMenu.offsetLeft + trigElem.offsetLeft + trigElem.offsetWidth/2 - subMenu.offsetWidth/2;

		var y = mainMenu.offsetTop + document.getElementById("imgSpan2"+index).offsetHeight;

		subMenu.style.position = "absolute";

		subMenu.style.top = y + "px";

		subMenu.style.left = x + "px";

		(MSIE) ? subMenu.style.filter = "alpha(opacity=0)" : subMenu.style.opacity = "0";

		fadeMenu(subMenu, true);

	}

}



// Remove submenu

function removeSubMenu() {

	if (tmtIntvl) { clearTimeout(tmtIntvl); }

	if (smiIntvl) { clearInterval(smiIntvl); }

	if (subIntvl) { clearInterval(subIntvl); }

	for (var i = 0; i < mainItems.length; i++) {

		if (document.getElementById("subMenu"+i) != undefined) {

			var subMenu = document.getElementById("subMenu"+i);

			subMenu.parentNode.removeChild(subMenu);

		}

	}

	fadeTabs();

}



// Remove submenu on timeout

function timeMenu(evt) {

	var index;

	evt = (evt) ? evt : ((window.event) ? window.event : null);

	if (evt) {

		if (tmtIntvl) { clearTimeout(tmtIntvl); }

		if (evt.type == "mouseout") {

			tmtIntvl = (MSIE) ? setTimeout(function(){removeSubMenu();}, 2000) : setTimeout(removeSubMenu, 2000);

		}

	}

}



// Fade submenu in/out

function fadeMenu(target, show) {

	if (show) {

		subIntvl = (MSIE) ? setInterval(function(){fadem(target, 1);}, fadeSp) : setInterval(fadem, fadeSp, target, 1);

	} else {

		subIntvl = (MSIE) ? setInterval(function(){fadem(target, 0);}, fadeSp) : setInterval(fadem, fadeSp, target, 0);

	}

}



function fadem(target, val) {

	var step = 0.1;

	var o = (MSIE) ? target.filters.alpha.opacity/100 : parseFloat(target.style.opacity);

	if (o < val) {

		o += step;

	} else if (o > val) {

		o -= step;

	}

	if (Math.abs(o - val) <= step) {

		o = val;

		clearInterval(subIntvl);

	}

	(MSIE) ? target.style.filter = "alpha(opacity="+(o*100)+")" : target.style.opacity = o.toString();

}



// Fade main menu tabs

function fadeTabs(evt) {

	var index;

	evt = (evt) ? evt : ((window.event) ? window.event : null);

	if (evt) {

		var target = (MSIE) ? evt.srcElement : evt.target;

		var id = target.id;

		index = parseInt(id.substr(id.length-1));

	}

	if (index != undefined) {

		if (tabIntvl) { clearInterval(tabIntvl); }

		if (evt.type == "mouseover") {

			tabIntvl = (MSIE) ? setInterval(function(){fadet(index);}, fadeSp) : setInterval(fadet, fadeSp, index);

		} else {

			tabIntvl = (MSIE) ? setInterval(function(){fadet();}, fadeSp) : setInterval(fadet, fadeSp);

		}

	} else {

		if (tabIntvl) { clearInterval(tabIntvl); }

		tabIntvl = (MSIE) ? setInterval(function(){fadet();}, fadeSp) : setInterval(fadet, fadeSp);

	}

}



function fadet(index) {

	var done = true;

	var step = 0.1;

	var txtStp = 1;

	for (var i = 0; i < mainItems.length; i++) {

		var imgSpan = document.getElementById("imgSpan"+i);

		var imgSpan2 = document.getElementById("imgSpan2"+i);

		var imgMid = document.getElementById("imgMid"+i);

		var imgMid2 = document.getElementById("imgMid2"+i);

		var txtSpan = document.getElementById("txtSpan"+i);

		var sp = document.getElementById("sp"+i);

		var sp2 = document.getElementById("sp2"+i);

		var srtY = (imgMid.offsetHeight-txtSpan.offsetHeight)/2;

		var endY = (imgMid2.offsetHeight-txtSpan.offsetHeight)/2;

		var top = txtSpan.style.top;

		var curY = parseFloat(top.substr(0,top.lastIndexOf("px")));

		var o = (MSIE) ? imgSpan2.filters.alpha.opacity/100 : parseFloat(imgSpan2.style.opacity);

		// Icon position

		var icnSpan = document.getElementById("icnSpan"+i);

		//var icnSrtY = (imgMid.offsetHeight-icnSpan.offsetHeight)/2;

		//var icnEndY = (imgMid2.offsetHeight-icnSpan.offsetHeight)/2;

		var icnSrtY = srtY + (sp.offsetHeight-icnSpan.offsetHeight)/2 + ((!MSIE) ? 1 : 0);

		var icnEndY = endY + (sp.offsetHeight-icnSpan.offsetHeight)/2 + ((!MSIE) ? 1 : 0);

		var icnTop = icnSpan.style.top;

		var icnCurY = parseFloat(icnTop.substr(0,icnTop.lastIndexOf("px")));

		if (index != undefined && 

			i == index) 

		{	

			if (o < 1) {

				(Math.abs(o-1) > step) ? o += step : o = 1;

				done = false;

			}

			if (curY < endY) {

				(Math.abs(curY-endY) > txtStp) ? curY += txtStp : curY = endY;

				done = false;

			}

			// Move icon

			if (icnCurY < icnEndY) {

				(Math.abs(icnCurY-icnEndY) > txtStp) ? icnCurY += txtStp : icnCurY = icnEndY;

				done = false;

			}

		} else {

			if (o > 0) {

				(Math.abs(o) > step) ? o -= step : o = 0;

				done = false;

			}

			if (curY > srtY) {

				(Math.abs(curY-srtY) > txtStp) ? curY -= txtStp : curY = srtY;

				done = false;

			}

			// Move icon

			if (icnCurY > icnSrtY) {

				(Math.abs(icnCurY-icnSrtY) > txtStp) ? icnCurY -= txtStp : icnCurY = icnSrtY;

				done = false;

			}

		}

		(MSIE) ? imgSpan2.style.filter = "alpha(opacity="+(o*100)+")" : imgSpan2.style.opacity = o.toString();

		txtSpan.style.top = curY + "px";

		icnSpan.style.top = icnCurY + "px";

	}

	if (done) {

		clearInterval(tabIntvl);

	}

}



// Fade submenu items in/out

function fadeItems(evt) {

	var index;

	var prtIndex;

	evt = (evt) ? evt : ((window.event) ? window.event : null);

	if (evt) {

		var target = (MSIE) ? evt.srcElement : evt.target;

		var id = target.id;

		index = parseInt(id.substr(id.length-1));

		var prtId = target.offsetParent.id;

		prtId = prtId.toLowerCase();

		if (prtId.lastIndexOf("menu") < 0) {

			prtId = target.offsetParent.offsetParent.id;

		}

		prtIndex = parseInt(prtId.substr(prtId.length-1));

	}

	if (index != undefined && 

		prtIndex != undefined &&

		document.getElementById("subMenu"+prtIndex)) 

	{

		if (evt.type == "mouseover") {

			if (smiIntvl) { clearInterval(smiIntvl); }

			smiIntvl = (MSIE) ? setInterval(function(){fadei(prtIndex, index);}, fadeSp) : setInterval(fadei, fadeSp, prtIndex, index);

		} else {

			if (smiIntvl) { clearInterval(smiIntvl); }

			smiIntvl = (MSIE) ? setInterval(function(){fadei(prtIndex);}, fadeSp) : setInterval(fadei, fadeSp, prtIndex);

		}

	}

}



function fadei(prtIndex, index) {

	var done = true;

	var step = 0.1;

	for (var i = 0; i < subItems[prtIndex].length; i++) {

		var subImgSpan = document.getElementById("subImgSpan"+i);

		var subImgSpan2 = document.getElementById("subImgSpan2"+i);

		var o = (MSIE) ? subImgSpan2.filters.alpha.opacity/100 : parseFloat(subImgSpan2.style.opacity);

		if (index != undefined && 

			i == index) 

		{	

			if (o < 1) {

				(Math.abs(o-1) > step) ? o += step : o = 1;

				done = false;

			}

		} else {

			if (o > 0) {

				(Math.abs(o) > step) ? o -= step : o = 0;

				done = false;

			}

		}

		//subImgf.style.opacity = o.toString();

		(MSIE) ? subImgSpan2.style.filter = "alpha(opacity="+(o*100)+")" : subImgSpan2.style.opacity = o.toString();

	}

	if (done) {

		clearInterval(smiIntvl);

	}

}



// Open page from menu

function gotoPage(evt) {
		
	var index;

	var prtIndex;

	evt = (evt) ? evt : ((window.event) ? window.event : null);

	if (evt) {

		var target = (MSIE) ? evt.srcElement : evt.target;

		var id = target.id;
		
		index = parseInt(id.substr(id.length-1));

		if (id.substr(0, 3) == "sub") {

			var prtId = target.offsetParent.id;

			prtId = prtId.toLowerCase();

			if (prtId.lastIndexOf("menu") < 0) {

				prtId = target.offsetParent.offsetParent.id;

			}

			prtIndex = parseInt(prtId.substr(prtId.length-1));

		}

	}
	
	if (mainURLs[index] != undefined) { window.location.href = mainURLs[index]; }

	
	window.location.href = subURLs[prtIndex][index]; 
	
	
}



//item.style.mozOpacity = "0.2";

//item.style.filter = "alpha(opacity=25)";

//item.style.opacity = "0.2";


