var timer = null;

$(document).ready(function() {	
	if( $('#sub-nav ul.showitems') ) {
		$('#sub-nav ul.showitems').removeClass('showitems');
	}
  	topNav();  //Top Level navigation
	subnav();  //Sub-navigation
});

function topNav() {
	var navLink = $('#main-nav ul li img');
	var navParent = $('#main-nav ul li');
	var timeout; //Declare timeout for timer
	var activeImg = includes_path + '/images/main-sprite-active.gif';
	var inactiveImg = includes_path + '/images/main-sprite.gif';
	
	navLink.mouseover(function() {
		$(this).attr({src: activeImg});
		$(this).css('cursor','pointer');
	});
	navLink.mouseout(function() {
		if( !navParent.hasClass('hover') ) {
			$(this).attr({src: inactiveImg});
		}
		timer = setTimeout(function() {
			hideActive();
		}, 500 );
	});
	
	navParent.mouseover(function() {
		clearTimeout(timer);
	});
	
	navLink.click(function() {
		showOverlayContent( this );
	});
	
	$('#sub-nav-overlay').bind('mouseover', function() {
		clearTimeout(timer);
	});
	$('#sub-nav-overlay').bind('mouseout', function() {
		timer = setTimeout(function() {
			hideActive();
		}, 100 );
	});
}

function showOverlayContent( object ) {
	var subNavContainer = $('#sub-nav-overlay');
	var itemId = $(object).prev('a').attr('id');
	var parentLi = $(object).parent('li');
	var liList = $('#main-nav ul li');
	var includesFile;
	var newClass;
	var activeImg = includes_path + '/images/main-sprite-active.gif';
	var inactiveImg = includes_path + '/images/main-sprite.gif';
	
	subNavContainer.removeClass();
	subNavContainer.empty();
	
	if( parentLi.hasClass('hover') ) {
		subNavContainer.addClass('hide-overlay');
		parentLi.removeClass('hover');
		$(object).attr({src: inactiveImg}); //Set drop down arrow image as inactive
	}
	else {
		//which include file to load
		switch( itemId ) {
			case 'see-whats-on':
				includesFile = 'whats-on.inc.php';
				break;
			case 'explore':
				includesFile = 'explore.inc.php';
				newClass = 'explore';
				break;
			case 'support-us':
				includesFile = 'support-us.inc.php';
				newClass = 'support-us';
				break;
		}
		includesFile = includes_path + '/components/navigation-overlays/' + includesFile;
		
		//AJAX request to get HTML content from includesFile
		$.get( includesFile, function( data ) {
			liList.removeClass('hover');
			parentLi.addClass('hover');
			$(object).attr({src: activeImg});
			$(object).attr({src: activeImg}); //Set drop down arrow image as active
			subNavContainer.addClass(newClass);
			subNavContainer.html(data);
			
			accordion(); //re-apply the accordion event listeners to newly added/re-added items in the DOM
		});
	}
}

function subnav() {
	var dropImg = $('#sub-nav a.folder img');
	
	dropImg.bind('mouseout', function() {
		$(this).parent().removeClass('hover');
		
		var parentLi = $(this).parents('li');
		
		subnavTimer = setTimeout( function() {
			parentLi.removeClass('clicked');
		}, 2000 );
	});
	dropImg.bind('mouseover', function() {
		$(this).parent().addClass('hover');
	});
	
	dropImg.click(function(e) {
		e.preventDefault();
		$(this).parents("li").toggleClass('clicked');
	});
	
	$('#sub-nav ul.sub-nav-lvl-1 li ul.sub-lvl').bind('mouseover', function() {
		clearTimeout(subnavTimer);
	});
	$('#sub-nav ul.sub-nav-lvl-1 li ul.sub-lvl').bind('mouseout', function() {
		subnavTimer = setTimeout( function() {
			dropImg.parents('li').removeClass('clicked');
		}, 2000 );
	});
}

function accordion() {
	$("#accordion").accordion({
			autoHeight: false
	});
}

function hideActive() {
	$('#sub-nav-overlay').removeClass();					
	$('#sub-nav-overlay').addClass('hide');
	$('#main-nav ul li').removeClass('hover');
	$('#main-nav ul li img').attr({src: includes_path + '/images/main-sprite.gif'});
}