/* This is a plugin to turn any two elements into "hover" with drop-down. 

	example use:
	
	$('#hoverlink').pwHoverDrop({
		$content: $('#hoverdiv')
	});	
	
	the $content paramater NEEDS to be set for this to work properly.
*/

(function($){
	$.fn.extend({
		pwHoverDrop: function(settings){
			/* Config settings
				$content - the jQuery DOM object that slides down and up
				browseDelay - how long you have to be off the elements before they slide up
				slideSpeed - how quickly the element slides up and down
			*/
			var defaults = {
				$content: null,
				browseDelay: 200,
				browseShowDelay: 300,
				slideSpeed: 300
			};
			var settings = $.extend(defaults, settings);
			var timeout;
			
			return this.each(function(){					
				var inBrowser;								
				
				$(this).mouseenter(function(){
					inBrowser=true;
					clearTimeout(timeout);
					timeout = setTimeout(browseSlideDown, settings.browseShowDelay);					
				});
				
				$(this).mouseleave(function(){
					inBrowser=false;
					clearTimeout(timeout);
					timeout = setTimeout(browseSlideUp, settings.browseDelay);
				});
							
				settings.$content.mouseenter(function(){
					inBrowser=true;
				});
				
				settings.$content.mouseleave(function(){
					inBrowser=false;
					clearTimeout(timeout)
					timeout = setTimeout(browseSlideUp, settings.browseDelay);
				});
				
				function browseSlideUp()
				{
					if(!inBrowser){
						settings.$content.slideUp(settings.slideSpeed);
					}
				}
				
				function browseSlideDown(){
					if(inBrowser){
						settings.$content.slideDown(settings.slideSpeed);
					}
				}
			});
		}
	});
})(jQuery);