/* Navigation.js - This script manages the display of submenus */

$(document).ready(function() {
		
		// Function to remove the static submenu
		function removeMenu() {
				$('#sub_nav').remove();
		}
		
		// I'm cancelling the intial hiding of the menu
		//removeMenu();
		
		// Function to fade the submenu out
		function hideMenu() {
				$('#sub_nav').fadeOut('fast');
		}
		
		// function to create out submenu on call
		function buildMenu(content) {
				removeMenu();
				var menu = '<div id="sub_nav">';
				menu += '<div class="wrap">';
				menu += '<ul>';
				menu += '<li><img src="images/ajax-loader.gif" alt="loading...">Loading Menu...</li>';
				menu += '</ul>';
				menu += '</div>';
				menu += '</div>';
				$(menu).insertAfter('#main_nav');
				$('#sub_nav ul').load(content).hide().fadeIn();
		}
		
		// areas we're using to close the menu
		/*
		$('#header').mouseover(function() { 
				hideMenu();
		});
		$('#main_content').mouseover(function() { 
				hideMenu();
		});
		$('#sub_content').mouseover(function() { 
				hideMenu();
		});
		*/
		
		// showing the proper menus for each link		
		$('#about_link').mouseover(function() {
				buildMenu('includes/sublinks_about.asp');
		});	
		$('#sales_link').mouseover(function() {
				buildMenu('includes/sublinks_sales.asp');
		});
		$('#rentals_link').mouseover(function() {
				buildMenu('includes/sublinks_rentals.asp');
		});
		$('#resources_link').mouseover(function() {
				buildMenu('includes/sublinks_resources.asp');
		});
		$('#contact_link').mouseover(function() {
				buildMenu('includes/sublinks_about.asp');
		});
		
		/*
		$('#sub_nav').hide();
		$('#about_link').mouseover(function() {
				$('#sub_nav').fadeIn();
		});
		$('#about_link').mouseout(function() {
				$('#sub_nav').fadeOut();
		});
		*/		
													 
});

/*
The basic format of the menu I need to make
<div id="main_nav">
	<div class="wrap">
		<ul>
			<li id="about_link"><a href="about.asp" class="current">About Us</a></li>
			<li id="sales_link"><a href="featuredhomes.asp">Sale Properties</a></li>
			<li id="rentals_link"><a href="shorerentals.asp">Summer Rentals</a></li>
			<li id="resources_link"><a href="resources.asp">Resources</a></li>
			<li id="contact_link"><a href="contact.asp">Contact Us</a></li>
		</ul>
	</div>
</div>
*/