var currentLeft = '';

function adjustNav( li, oload ){
	var parent_len 	= li.parentNode.offsetWidth;
	var child 		= document.getElementById( li.id.replace('main', 'sub') );
	
	var parent_left = navPos( li )[0]-133; // 219 is where the table starts to make the first parent nav to be 0
	
	if( child ){	
		var sum = 0;
		
		for(var i = 0; i < child.childNodes.length; i++){
			if( child.childNodes[i].offsetWidth != undefined )
				sum += (child.childNodes[i].offsetWidth);
		}
		
		//document.getElementById('monitor').innerHTML = sum;
		if( child.id.search('subsub') == -1 ) child.style.width = sum;
		
		if( child.id == 'sub_8' ) child.style.width = 0;
		
		var diff = (sum + parent_left) - parent_len + 110;//40;
		
		//document.getElementById('monitor').innerHTML = '('+sum+' + '+parent_left+') - '+parent_len+' = '+diff;
		
		if( diff > 0 ) child.style.left = (diff * -1) + 'px';
		
		var current = document.body;
		if( current.id && !oload ){
			var currentMain = current.id.replace('selNav', 'main');
			var main = document.getElementById( currentMain );
			
			if( li.id != currentMain ){
				li.style.left = 0;
				
				var li = document.getElementById( currentMain.replace('main', 'sub') );
					if( li ) li.style.left = '-999999px';

					main.style.background = '#000000';
					main.style.color = '#FFF';
			}else{
				var li = document.getElementById( currentMain.replace('main', 'sub') );
					if( li ) li.style.left = currentLeft+'px';
					
					main.style.background = '#FFF';
					main.style.color = '#000';
			}
		}else{
			var currentMain = current.id.replace('selNav', 'main');
			if( li.id == currentMain ){
				if( diff > 0 ) currentLeft = (diff * -1);
				else currentLeft = 0;
			}
		}
	}
}

function resetNav( li ){
	if( li.id.indexOf('main') != -1 ){
		var child = document.getElementById( li.id.replace('main', 'sub') );
		
		if( child ) child.style.left = '';
	}
	
	// check if current one set, if so push it back in place
	var current = document.body;
		
	if( current.id ){
		var currentMain = current.id.replace('selNav', 'main');
		var main = document.getElementById( currentMain );
		
		if( li.id != currentMain ){
			var li = document.getElementById( currentMain.replace('main', 'sub') );
				if( li ) li.style.left = currentLeft+'px';
		}else{
			var li = document.getElementById( currentMain.replace('main', 'sub') );
				if( li ) li.style.left = currentLeft+'px';
		}
		
		main.style.background = '#ffffff';
		main.style.color = '#000000';
	}
}

function navPos( obj ){
	var curleft = curtop = 0;
	
	if( obj.offsetParent ){
		curleft = obj.offsetLeft
		curtop = obj.offsetTop
		
		while(obj = obj.offsetParent){
			curleft += obj.offsetLeft;
			curtop += obj.offsetTop;
		}
	}
	
	return [curleft,curtop];
}

window.onload = function()
{
	var elMenuHovers = document.getElementById('nav').getElementsByTagName('li');
	for (var i = 0, l = elMenuHovers.length; i < l; i++)
	{
		elMenuHovers[i].onmouseover = function() { adjustNav(this, false); this.className = 'msHover'; return false; }
		elMenuHovers[i].onmouseout = function() { resetNav(this, false); this.className = 'msOut'; return false; }
	}
	
	var current = document.body;
	
	if( current.id ){
		var li = document.getElementById( current.id.replace('selNav', 'main') );
		adjustNav( li, true );
	}
	
	return false;
}