$(document).ready(function() { 
	// SET UP NAVIGATION EFFECTS and FETCHING
	
	var orig_over = "url(../images/nav_down.png)";
	var over_down = "url(../images/nav_over_down.png)";
	var over_up = "url(../images/nav_over_up.png)";
	var selected = "url(../images/nav_up.png)";
	var isDown = false;
	var downTo = "";
	var lastClicked = "";
	
	
	// Hide Submenu Area:
	$('div.element180').css({
		'display' : 'none'
	});
	
	
	$('div.menu_subitems').css('cursor', 'pointer');
	
	
	$('div.menu_subitems').hover(function() { 
		if (isDown == true && $(this).attr('id') == downTo) { 
			$(this).css('background-image' , over_up);
		}
		else {
			$(this).css('background-image' , over_down);
		}
	}, function() { 
		if (isDown == true && $(this).attr('id') == downTo) { 
			$(this).css('background-image' , selected);
		}
		else {
			$(this).css('background-image' , orig_over);
		}
	});
	
	$('div.menu_subitems').live('click', function(event) {
		// As DIV is within the A tag - stop loading of page:
		event.preventDefault();
		// and do:
		var thisItem = $(this).attr('id');
		lastClicked = thisItem;
		//get content
		$.ajax({
			'url' : 'ajax/menuItems.php',
			'type' : 'POST',
			'data' : 'action=getSubmenuItems&PAGE_ID='+thisItem,
			'success' : function(data) { 
				
				
				if (isDown == true && downTo) {
					if (downTo == thisItem) {
						// If same button clicked, scroll up and hide:
						
						$('div.element180').animate({
								'height' : '0px',
								'opacity' : '0'
							}, 1000, 'easeOutQuad', function() { 
								$('div#'+thisItem).css('background-image' , orig_over);
								isDown = false;
								downTo = "";
								$(this).html("");
								$('div.element180').css('display','none');
							});
					}
					else {
						// else - just change content without animation
						
						$('div#subMenuContent').animate({
							'opacity' : '0'
						}, 500, function() { 
							$('div#subMenuContent').html(data);
							$(this).animate({
								'opacity' : '1'
							});
							$('div#'+downTo).css({'background-image'  : orig_over});
							downTo = lastClicked;
							$('div#'+downTo).css('background-image', selected)
						});
					}
				}
				else {
					$('div.element180').html(data);
					$('div.element180').css('display','block');
					$('div.element180').animate({
						'height' : '100px',
						'opacity' : '1'
					}, 1000, 'easeInOutElastic', function() { 
						$('div#'+thisItem).css('background-image' , selected);
						isDown = true;
						downTo = thisItem;
					});
				}
				
			}
		});
		
	});
	
});