/* Author: Craig Morey - MindWorks Marketing http://www.mindworks.co.uk */

SSDNav = function(){

	var timeOut = false;
	var curtainOut = false;

	// get a list of lvl1 links
	var navLis = $('nav>ul').children();
	
	// hide all the lvl1 menus
	navLis.children('ul').css({ 'display':'none' , 'opacity':0 , 'height':0});
		
	// get the height of the main content area
	var contentWd = $('#content').width();
	var contentHt = $('#content').height();
			
	// each lvl1 link
	navLis.each(function() {
		
		// if this lvl1 link has a submenu
		if ($(this).children('ul').length > 0) {
		
			var menuHt = $(this).children('ul').height();
			
			// add in the "down" arrow to denote that it's a drop menu
			$(this).children().first('a').html('<span class="subnav-arrow">&#160;&#160;&#160;</span>' + $(this).children().first('a').html());
			
			// hover events, revealing subnav
			$(this).bind({
				mouseleave : function() {
					//curtainClose();
					$(this).children('ul').animate({'opacity':0 , 'height':0},0);
					var lastSub = $(this);
					timeOut = setTimeout((function() {
						lastSub.children('ul').css('display','none');
					}),1);
				},
				mouseenter : function() {
					//curtainOpen();
					$(this).children('ul').css({'display':'block'});
					$(this).children('ul').animate({'opacity':1 , 'height':contentHt},500)
				}
			})
		
		}
		
	});
	
	// fancy background curtain effect
	function curtainOpen () {
		clearTimeout(curtainOut);
		var curtainHeight = contentHt + 33;
		if ($('body').attr('id') == 'homepage') {
			curtainHeight = contentHt;
		}
		$('nav').animate({'height':curtainHeight},300);
	}
	function curtainClose () {
		curtainOut = setTimeout((function() {
			$('nav').animate({'height':33},300)
		}),200);
	}

				
	// get the lvl2 links under this lvl1 link
	var navSubAs = $('.subnavthumblink');
	
	// hide all the lvl2 pictures
	$('.subnavthumb').css({ 'display':'none' , 'opacity':0 , 'height':0});
	
	// each lvl2 thumbnail link (ie, the shop product pictures)
	navSubAs.each(function() {
	
		// if this lvl2 link has a picture
		var navSubSpan = $(this).children('.subnavthumb').first();
		
		if (navSubSpan) {
		
			$(this).bind({
				mouseleave : function() {
					navSubSpan = $(this).children('.subnavthumb').first();
					navSubSpan.animate({'opacity':0 , 'height':0 },300);
				},
				mouseenter : function() {
					navSubSpan = $(this).children('.subnavthumb').first();
					navSubSpan.css({'display':'block'});
					navSubSpan.animate({'opacity':1 , 'height':125},300)
				}
			})
		}
	
	})
};

$(document).ready(function() {
	SSDNav();
});