/**
 * @author Sean
 */

// -- VARS
// globals -> g
var g = {
	timeout: null,
	selected_top_nav: null,
	selected_sub_nav: null,
	timeout_milliseconds: 2000,
	subnav_left_offset: null,
	subnav_top_offset: null,
	subnav_width: null,
	subnav_height: null,
	last_event: null,
	original_active_nav: null,
	original_active_sub_nav: null
}
document.observe('dom:loaded', function(){
	g.original_active_nav = $$('#top-level-nav li.active').first();
	g.original_active_sub_nav = $$('#sub-nav a.active').first();
	// -- if there is a topmost level nav item selected and not a secondary nav item selected just make the sub-nav active.
	if(g.original_active_nav && !g.original_active_sub_nav){
		g.original_active_sub_nav = $("sub-"+ g.original_active_nav.id.split('-').last()); // selects the related sub-nav
		g.original_active_sub_nav.addClassName('active');
	}
	$$('#top-level-nav a').each(function(li){
		li.observe('mouseover', function(event){
			if (g.selected_top_nav && g.selected_top_nav != this) {
				deactivateMenu();
			}
			g.selected_top_nav = this;
			// get the last number of id of the li that matches the subnav
			var sub_nav_div = $("sub-"+ this.up('li').id.split('-').last()); // selects the related sub-nav
			if (sub_nav_div) {
				this.addClassName('hover');
				if(g.original_active_sub_nav && g.original_active_nav && (g.original_active_nav != g.selected_top_nav.up('li')) ){
					g.original_active_sub_nav.removeClassName('active');
					g.original_active_sub_nav.up('div').removeClassName('active');
				}
				sub_nav_div.addClassName('active');
				
				g.selected_sub_nav = sub_nav_div;
				
				this.observe('mouseover', function(event){
					destroyTimeout();
				});
				this.observe('mouseout', function(event){
					makeTimeout();
				});
			}
			else {
				g.selected_sub_nav = null;
			}
		});
	});// end top-level-nav li observer
	
	$$('#sub-nav div').each(function(div){
		div.observe('mouseover', function(event){
			destroyTimeout();
		});
		var mouse_out_event = Prototype.Browser.IE ? 'mouseleave' : 'mouseout';
		div.observe(mouse_out_event, function(event){
			if (!g.timeout && !hitTest(event)) {
				makeTimeout();
			}
		});
	});
}); // - End window load event

function deactivateMenu(){
	// -- do another hit test just to make sure
	if(hitTest(false)){
		destroyTimeout();
		return;
	}
	
	if (g.selected_top_nav) {
		g.selected_top_nav.removeClassName('hover');
	}
	if (g.selected_sub_nav) {
		g.selected_sub_nav.removeClassName('active');
	}
	destroyTimeout();
	clearCachedDimensions();
	
	// -- add active class back to the original active sub-nav
	if (g.original_active_nav) {
		g.original_active_nav.addClassName('active');
	}
	if(g.original_active_sub_nav){
		g.original_active_sub_nav.addClassName('active');
		g.original_active_sub_nav.up('div').addClassName('active');
	}
}

function makeTimeout(){
	destroyTimeout();
	g.timeout = setTimeout("deactivateMenu()", g.timeout_milliseconds);
	document.observe('mousemove', storeLastEvent);
}
function storeLastEvent(event){
	g.last_event = event;
}
function destroyTimeout(){
	clearTimeout(g.timeout);
	g.timeout = null;
}

function hitTest(event){
	// why should we need hitTest?  Because certain browsers suck. <cough>Internet Explorer</cough>
	if(!g.selected_sub_nav) return false;
	if (!g.subnav_left_offset || !g.subnav_top_offset || !g.subnav_width || !g.subnav_height) {
		dimensions = g.selected_sub_nav.getDimensions();
		g.subnav_width = dimensions['width'];
		g.subnav_height = dimensions['height'];
		
		var offset = g.selected_sub_nav.cumulativeOffset();
		g.subnav_left_offset = offset['left'];
		g.subnav_top_offset = offset['top'];
	}
	if(!event){
		event = g.last_event;
	}

	var m_x = Event.pointerX(event);
	var m_y = Event.pointerY(event);
	
	if(m_x - 1 <= g.subnav_left_offset || m_x >= (g.subnav_width + g.subnav_left_offset)){
		return false;
	}
	else if (m_y - 1 <= g.subnav_top_offset || m_y + 1 >= (g.subnav_height + g.subnav_top_offset)) {
		return false;
	}
	else {
		return true;
	}
}

function clearCachedDimensions(){
	g.subnav_left_offset = null;
	g.subnav_top_offset = null;
	g.subnav_width = null;
	g.subnav_height = null;
}