/*
 
  jQuery subnav - Version 1.0

  By: Tim Gieseking
  
  A jQuery plugin for showing/hiding sub navigation.
    
  Usage Examples:
  
  $('ul.subnav').subnav();
  
  Options:
  
  pause - milliseconds
  shiftleft - true or false (default false)
  hideifnochildren - true
  
*/
;(function($) { 
	
	function moveleft($subnavli, obj, $thisul)
	{
		/* optional function (triggered with shiftleft: true) that will shift our subnavigation left
		   if it's overflowing past the end of the container. this is especially a problem if using
		   overflow: hidden, which often needs to be done.
		   
		   If feasible solve this problem in CSS by setting negative left positions for each subnav.
		   Unfortunately with dynamic navigation we need a JavaScript solution. */
	
		var fullwidth = $thisul.parent().parent().parent().outerWidth(true);
		var idx = $subnavli.index(obj);
		var leftpos = 0;
		var i = 0;
		var sumW = 0;
		
		// get the width of all the li's. This gives us visual width, because the actual width
		// of the UL is set in CSS to be equal to the container (e.g., 960px).
		$thisul.children('li').each(function() { sumW += $(this).outerWidth(true); } );
		
		// determine the position of our upper level nav item. 
		$subnavli.each(function() {
			if (i < idx)
			{
				leftpos += $(this).outerWidth(true);
			}
			i++;
		});
		
		// calculate the amount of room we have from our main nav li to the end of the container.
		var totalroom = parseInt(fullwidth - leftpos);
		
		// if we're overflowing shift the navigation left.
		if (sumW > totalroom)
		{
			$thisul.css('left', parseInt(totalroom - sumW));
		}
		
		return true;
	};
	
	$.fn.subnav = function(settings) {
		
		var defaults = { pause:"1500", shiftleft:false, shiftright:false, hideifnochildren:true };
		settings = $.extend({}, defaults, settings);
	    
		// set up variables for some of our nav elements.
		var $this = $(this);
		var $subnavli = $this.children('li');
		var $subnavlia = $subnavli.children('a');
		var $currentul = $this.children('li.current').find('ul:eq(0)');
		var t;
	
		// remove the nojs class.
		// we use this class in our CSS to enable the menu to work without javascript.
		$subnavli.removeClass('nojs');
		
		// check if current needs to be moved left.
		if (settings.shiftleft == true)
		{
			moveleft($subnavli, $currentul.parent(), $currentul)	
		}
		
		// hover over a nav element.
		$subnavli.hover(
			
			function() {
				
				clearTimeout(t);
				
				var $thisul = $(this).find('ul:eq(0)');
				
				if (!$thisul.is(':visible'))
				{
					// hide the visible navs, fade in the one we're hovering over.
					if ($thisul.length > 0 || settings.hideifnochildren == true)
					{
						$subnavli.children('ul').hide();
						$thisul.fadeIn();
					}
					
					// we may need to move the subnav to the left if it's not fully visible.
					if (settings.shiftleft == true && $thisul.length > 0)
					{
						moveleft($subnavli, this, $thisul);
					}
				}
			},
			
			function() {
				if (!$(this).hasClass('.current'))
				{
					// This brings the current pages subnav back after we mouseout.
					// There is a pause before the menu fades away. default: 1500.
					clearTimeout(t);
					t = setTimeout(
						function() {
							$subnavli.children('ul').fadeOut('fast');
							$currentul.fadeIn();
						}, settings.pause);
				}
			}
			
		);
	
	};

})(jQuery);

