// Handle the navigation mouseover interactions on mouse over and mouse off
Makena.Menu = {
	mouse_over_time_out: null, // timeout needed for the in between states of mouse over and mouse out that happen when traversing between the tabs and the subnav. This makes it smooth
	is_timeout_set: false, // boolean for recognizing when a timer has been applied so it can be added or removed without error
	on_homepage: false, // if the page is currently the homepage, behave differently. This is a boolean for that condition
	selected_tab_pos: null, // the currently selected tab 

	init: function() {
		$('.sub-nav ul').hide(); // hide all subnav elements
		// if there are more than one selected tabs going, we're on the homepage
		Makena.Menu.on_homepage = ($('#tabs td.selected').length > 1);
		// find which position the selected tab is at if we're not on the homepage
		if (!Makena.Menu.on_homepage) {
			// store the currently selected tab position
			Makena.Menu.selected_tab_pos = $('#tabs td').index($('#tabs td.selected'));
			// show just the selected subnav element
			$('.sub-nav ul').eq(Makena.Menu.selected_tab_pos).show();
		}
		// selector to bind event handlers for each one of the tabs
		$('#tabs a').each(function() {
			// for this tab, store the href so it can be used inside the click handler
			var loc = $(this).attr('href');
			$(this).removeAttr('href');
			// get the position in the child list of the link that was clicked
			var pos = $('#tabs a').index(this);
			// overwrite the default action of the link with one that shows a subnav instead
			$(this).parent().click(function() { location.href = loc; });
			// bind a mouse hover handler to each of the selectable tabs
			$('#tabs td').hover(Makena.Menu.onMouseOverTabs, Makena.Menu.onMouseOut);
			// bind a mouse hover handler to the subnav bar
			$('#sub-nav-bg').hover(Makena.Menu.onMouseOverSubNav, Makena.Menu.onMouseOut); 
		});
	},
	
	// check to see if a timeout has been set, and if one has, clear it
	checkMouseOverTimeout: function() {
		// check the boolean that's toggled whenever this timeout is set
		if (Makena.Menu.is_timeout_set) {
			// if there's a timeout, clear it
			window.clearTimeout(Makena.Menu.mouse_over_time_out);
			// mark the boolean false so this function doesn't throw an error if one isn't set
			Makena.Menu.is_timeout_set = false;
			// set the timeout object to null
			Makena.Menu.mouse_over_time_out = null;
		}
	},

	// over handler for tabs
	onMouseOverTabs: function() {
		// if a mouseout timer has been set, remove it
		Makena.Menu.checkMouseOverTimeout();
		// remove the styles associated with the tabs hover state from all tabs
		$('#tabs td').removeClass('hover');
		// set the currently selected tab
		//var selected_tabs = $('#tabs td.selected');
		// store the tab currently hovered over
		var hov = $('#tabs td').index(this);
		// don't show hover state for selected item
		if ($(this).hasClass('selected') && !Makena.Menu.on_homepage) { return; }
		// if not on the homepage, clear the selected styles off all tabs
		if (!Makena.Menu.on_homepage) {
			$('#tabs td').removeClass('selected');
		}
		// hide all subnav items
		$('.sub-nav ul').hide();
		// use hover look for the subnav
		$('#sub-nav-bg').addClass('hover');
		// add the hover look to the tab currently moused over
		$(this).addClass('hover');
		// slide in slowly the first time
		if (Makena.Menu.on_homepage) { $('.sub-nav').slideDown('fast'); }
		// show hover item menu for the currently hovered over item
		$('.sub-nav ul').eq(hov).show();
	},

	// over handler for sub nav
	onMouseOverSubNav: function() {
		// for the subnav, only check to see if the mouse out timer is set, and if so, remove it
		Makena.Menu.checkMouseOverTimeout();
	},

	// out handler for tabs and subnav
	onMouseOut: function() {
		// if the mouseout timer isn't set, set one and bind an event handler to it that removes hover looks and restores any selected looks needed
		if (Makena.Menu.is_timeout_set == false) {
			// mark the boolean true so js knows that there's one to be removed
			Makena.Menu.is_timeout_set = true;
			// set the timeout event handler
			Makena.Menu.mouse_over_time_out = window.setTimeout(function() {
				// for all nav tags marked with hover styles, remove the hover styles
				$('#nav .hover').removeClass('hover');
				// set the currently selected tab
				// var selected_tabs = $('#tabs td.selected');
				// if we're on the home page, hide all the sub nav items
				if (Makena.Menu.on_homepage) {
					// mark all the tabs as selected when on the homepage
					$('#tabs td').addClass('selected');
					// if on the homepage, and we've moused out, hide the submenu
					$('.sub-nav').slideUp('fast', function() {
						$('.sub-nav ul').hide();
					});
				} else { // if we're on a specific page
					// hide all visible sub-nav menus
					$('.sub-nav ul').hide();
					// show sub menu for the item that's currently selected
					$('.sub-nav ul').eq(Makena.Menu.selected_tab_pos).show();
					// set this tabs style as selected
					$('#tabs td').eq(Makena.Menu.selected_tab_pos).addClass('selected');
				}
				// set the timeout as false as it's now fired itself
				Makena.Menu.is_timeout_set = false;
				// clear the timer itself
				Makena.Menu.mouse_over_time_out = null;
			}, 1500);
		}
	}
};

// when the html is finished downloading and the browser has rendered the dom elements, parse the dom for the menu and bind the handlers needed for it's varying mouse interaction states
$(document).ready(function() {
	Makena.Menu.init();
});

