// JavaScript
// katz.be
// katz products sidenav 
// requires jquery 1.3.2

$(document).ready(function(){
			
			//pull .icon 2px up
			$('#sidenavproducts ul li:nth-child(1) a .icon').addClass('movedenclosingspandown');
			$('#sidenavproducts ul li:nth-child(2) a .icon').addClass('movedenclosingspandown');
			$('#sidenavproducts ul li:nth-child(3) a .icon').addClass('movedenclosingspandown');
			$('#sidenavproducts ul li:nth-child(4) a .icon').addClass('movedenclosingspandown');
			$('#sidenavproducts ul li:nth-child(5) a .icon').addClass('movedenclosingspandown');
			
			//add cat as a background
			$('#sidenavproducts ul li:nth-child(1) a .catplaceholder').addClass('cat1');
			$('#sidenavproducts ul li:nth-child(2) a .catplaceholder').addClass('cat2');
			$('#sidenavproducts ul li:nth-child(3) a .catplaceholder').addClass('cat3');
			$('#sidenavproducts ul li:nth-child(4) a .catplaceholder').addClass('cat4');
			$('#sidenavproducts ul li:nth-child(5) a .catplaceholder').addClass('cat5');
			
			//put cat 30px down
			$('#sidenavproducts ul li:nth-child(1) a .catplaceholder').addClass('moveddown');
			$('#sidenavproducts ul li:nth-child(2) a .catplaceholder').addClass('moveddown');
			$('#sidenavproducts ul li:nth-child(3) a .catplaceholder').addClass('moveddown');
			$('#sidenavproducts ul li:nth-child(4) a .catplaceholder').addClass('moveddown');
			$('#sidenavproducts ul li:nth-child(5) a .catplaceholder').addClass('moveddown');
			
			//ad id=catNR to li's - for colored tab on selected state
			$('#sidenavproducts ul li:nth-child(1)').attr('id','cat1');
			$('#sidenavproducts ul li:nth-child(2)').attr('id','cat2');
			$('#sidenavproducts ul li:nth-child(3)').attr('id','cat3');
			$('#sidenavproducts ul li:nth-child(4)').attr('id','cat4');
			$('#sidenavproducts ul li:nth-child(5)').attr('id','cat5');
			
			
			$('#sidenavproducts ul li a').hover(function() {
						//mouseover event: pull cat 28px up						 
						//get the clicked index (numbering starts at 0 !)
						
						var index = $('#sidenavproducts ul li a').index(this);
						var index = index + 1; // hovered index starts at 0, nth-child starts at 1...
						
						$('#sidenavproducts ul li:nth-child(' + index +') a .catplaceholder').animate({
							 marginTop: '-=28'
						  }, 300, function() {
							// Animation complete.							
						  });
									
					}, function() {
							//mouseout event: put cat 28px down
							var index = $('#sidenavproducts ul li a').index(this);
							var index = index + 1; // hovered index starts at 0, nth-child starts at 1...
							$('#sidenavproducts ul li:nth-child(' + index +') a .catplaceholder').animate({
								 marginTop: '+=28'
							  }, 300, function() {
								// Animation complete.							
							  });
						});
					
		
		
		
		
		
		//find which cat is selected, add id="catNR" to it's <li>
			//var selectedindex = $('#sidenavproducts ul').find('li.selected').index(this);
			//var selectedindex = $('#sidenavproducts ul li.selected').index(this);
			//alert(selectedindex);
			//$('#sidenavproducts ul').find('li.selected').css('backgroundColor','#0ff')
				 
});