//====================================================================================================================	
	
	var leftNavAnimationSpeed = 500;
	var leftNavFx = new Array();
	var leftNavNavigating = true;
	var subMenuHeight = 0;
	
	window.addEvent('domready',leftNavInit);
	
//====================================================================================================================	

	function leftNavInit()
	{
		// With each list item in the left nav
		$$('.productNav')[0].getChildren().each(function(el,index){
	
			// If the list item is not the header or currently active
			if(el.id!='productNavHeader' && !(el.getChildren()[0].hasClass('active')))
			{
				// Adjust the list item to prevent overflowing
				el.setStyles({'display':'block', 'height':30, 'overflow':'hidden'});
				
				// Inject the image into the list item
				var objImg = new Element('img',{'src':'/images/productListItemHover.jpg'});
				objImg.setStyles({'opacity':0});
				objImg.inject(el,'top');
				
				// Adjust the position of the hyperlink in the list item
				el.getChildren()[1].setStyles({'position':'relative', 'top':-30});
				
				// Create an FX animation for the list item
				leftNavFx[index] = new Fx.Morph(el.getChildren()[0],{duration:leftNavAnimationSpeed, transition: Fx.Transitions.Quad.easeOut, wait:false});
				
				// Add hover events to the list item
				el.addEvent('mouseenter', function(){if(!leftNavNavigating){leftNavFx[index].cancel(); leftNavFx[index].set({'opacity':0.50});}});
				el.addEvent('mouseleave', function(){if(!leftNavNavigating){leftNavFx[index].start({'opacity':0});}});
				
				// Add click event to the list item 
				el.addEvent('click', function(e)
				{
					// Prevent the default action of the link
					e.preventDefault();
					leftNavNavigating = true;
					
					// Set the item to active
					leftNavFx[index].cancel(); 
					leftNavFx[index].set({'opacity':1}); 
					
					// If there is an active item set it to inactive
					if($$('.productNav li a.active').length>0) $$('.productNav li a.active')[0].removeClass('active');
					
					// If there is a visible submenu
					if($$('.productNav li ul').length>0)
					{
						// fade out the submenu
						var oldMenu = $$('.productNav li ul')[0];
						var oldMenuFX = new Fx.Morph(oldMenu,{duration:leftNavAnimationSpeed, transition: Fx.Transitions.Quad.easeOut, wait:false});
						oldMenuFX.start({'height':0});
						
						// Navigate to where the item link points
						(function(){document.location.href=el.getChildren()[1].href}).delay(leftNavAnimationSpeed);
					}
					// If there is no visible submenu
					else
					{
						// Navigate to where the item link points
						document.location.href=el.getChildren()[1].href;
					}
					
				});
			}
		});
		
		// Work out the height of the submenu
		if($$('.productNav li ul').length>0)
		{	
			var subMenu = $$('.productNav li ul')[0];
			for(i=0; i<subMenu.getChildren().length; i++)
			{
				subMenuHeight += subMenu.getChildren()[i].getSize().y;
			}
		}	
			
		// If content is shorted than the menu resize the content to avoid floating problems
		var fullHeight=$('leftColumn').getSize().y+30+subMenuHeight;
		var currentHeight = $$('.content')[0].getSize().y;
		if(currentHeight<fullHeight) $$('.content')[0].setStyle('height',fullHeight);
	
		// Animate down the current submenu
		if($$('.productNav li ul').length>0)
		{
			var subMenu = $$('.productNav li ul')[0];
			var subMenuFX = new Fx.Morph(subMenu,{duration:leftNavAnimationSpeed, transition: Fx.Transitions.Quad.easeOut, wait:false});
			subMenuFX.start({'height':subMenuHeight});
		}
		leftNavNavigating = false;

	}

//====================================================================================================================	
	

