var timeout         = 500;
var closetimer		= 0;
var ddmenuitem      = 0;
var ddimgitem		= 0;

// open hidden layer
function mopen(id)
{	
	var pic = document.getElementById('li'+id);
	var h = pic.offsetHeight;
	var w = pic.offsetWidth;
	
	// change old mouse over
	if(ddimgitem) hoverImg('out',ddimgitem.id);
	
	// set current item
	ddimgitem = document.getElementById('li'+id);
	
	// cancel close timer
	mcancelclosetime();

	// close old layer
	if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';

	// get new layer and show it
	ddmenuitem = document.getElementById(id);
	ddmenuitem.style.visibility = 'visible';
	//w = w + 10;
	w = 129;
	ddmenuitem.style.width = w + 'px';
	
	hoverImg('over','');
}
// close showed layer
function mclose()
{
	if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
	if(ddimgitem) {
		hoverImg('out','');
	}
}

// go close timer
function mclosetime()
{
	closetimer = window.setTimeout(mclose, timeout);
}

// cancel close timer
function mcancelclosetime()
{
	if(closetimer)
	{
		window.clearTimeout(closetimer);
		closetimer = null;
	}
}

function hoverImg(type,id) {
	if(type == "over") {
		if(ddimgitem) {
			if(id=='') {
				var pic = ddimgitem;
			} else {
				var pic = document.getElementById(id);
			}
			var img = pic.src;
			var imgL = img.length;
			var imgE = img.length - 4;
			var imgS = img.length - 9;
			if(img.substring(imgS,imgL)!='_over.gif') {
				var hoverS = img.substring(0,imgE);
				var hoverImg = hoverS + '_over.gif';
				pic.src = hoverImg;
			}
		}
	} else {
		if(ddimgitem) {
			if(id=='') {
				var pic = ddimgitem;
			} else {
				var pic = document.getElementById(id);
			}
			var img = pic.src;
			var imgL = img.length;
			var imgE = img.length - 9;
			
			
			if(img.substring(imgE,imgL)=='_over.gif') {
				var hoverS = img.substring(0,imgE);
				var hoverImg = hoverS + '.gif';
				pic.src = hoverImg;
			}
		}
	}
}

//left nav
function navArrow(id,show) {
	var td = document.getElementById('arrow_'+id);
	if(td.className!='nav_active') {
		if(show) {
			td.innerHTML = '<img src="/images/nav_arrow.png" style="margin: 0 auto;" />';
		} else {
			td.innerHTML = ' ';
		}
	}
}
function navDot(id,show) {
	var td = document.getElementById('subNav_'+id);
	if(td.className!='subNav_active') {
		if(show) {
			td.innerHTML = '\u2022';
		} else {
			td.innerHTML = ' ';
		}
	}
}

// close layer when click-out
document.onclick = mclose;