var yglobal = 0;


$(document).ready(function() {
	
	
	
	
	// home button positionieren
	var hx = $('#menu').offset().left;
	var hy = $('#menu').offset().top;
	$("#homebutton").show();
	$("#homebutton").css("left",hx-50);
	$("#homebutton").css("top",hy+15);
	
	$("#homebutton").click(function() {
		window.location.href = "http://www.pict-o.de/home.html";
	});
	

	
	// hover color change effect
	$("#menu2 li").hover(function() {
		

	   	$("#menu2").find("li").each(function(i) {
	   		$(this).removeClass("current");	
	   	});
	   
	     $(this).addClass("current");
	     //alert($(this).attr("rel"));
	     moveMenu();  
	     
	     
	});
	
	// aktuelles currrent holen
	var global_current = 0;
	var i=0;
   $("#menu2").find("li").each(function(i) {
		   	
		    if( $(this).hasClass('current') ){
		    	global_current = i;
		    }
		    i++;
		   });

	
// 		window.document.title = toppos + "TEST123" + $("#menu2").css("top");
	// ausgangsposition
//	var startpos = $("#menu2").css("top","0px");
//	alert(startpos);
	$("#container").mouseleave(function(e) { 
		
		var ak= $("#menu2").css("top");
		var neu = $("#menutop").html();
		//window.document.title = "reset - "+ neu;
		$("#menu2").css("top",neu);
		
		var cc=0;
		$("#menu2").find("li").each(function(i) {
			if(cc==global_current){
				$(this).addClass("current");
				moveMenu2(global_current);
			}
				cc++;
			
		});
		
		$("#menu2").stop();
		

	});
	
	
	// wenn mousemove rausgeht dann auf startpos seten raus gehts wenn  mauswert nicht in menu_holder liegt
	
	// Trigger mouse move event over the 'menu_holder'.
	$("#menu_holder").mousemove(function(e) {
		// Enable scroll function only when the height of the 'slider' or menu is greater than the 'menu_holder'.
		if($(this).height() < $("#menu2").height()) {
			// Calculate the distance value from the 'menu_holder' y pos and page Y pos.
			var distance = e.pageY - $(this).offset().top;
			// Get the percentage value with respect to the Mouse Y on the 'menu_holder'.
			var percentage = distance / $(this).height();
			// Calculate the new Y position of the 'slider'. 
			var targetY = -Math.round(($("#menu2").height() - $(this).height()) * percentage);
			yglobal = targetY;
			// Without easeing function. by default jQuery have 'swing'.
			$('#menu2').animate({top: [targetY+"px", "easeOutCirc"]}, { queue:false, duration:200 });

			
		}
	});
	
	// menu init
	moveMenu();

	$("#menu2").css("top",$("#menutop").html());
	
   $("#menu2 li").click(function() {
	   
	   	$("#menu2").find("li").each(function(i) {
	   		$(this).removeClass("current");	
	   	});
	   
	     $(this).addClass("current");
	     //alert($(this).attr("rel"));
	     moveMenu();  
   });	
	
});



function moveMenu(){
	
	
	var o1=0.02;
	var o2=0.08;
	var o3=0.28;
	var o4=0.64;
	var o5=0.80;
	
	var aktuell = 0;
	var c=0;
	   $("#menu2").find("li").each(function(i) {
		   	
		    if( $(this).hasClass('current') ){
		    	aktuell = c;
		    }
		    c++;
		   });
	
	   
	   var x=0.0;
	   var oben=0;
	   var unten=0;
	   $("#menu2").find("li").each(function(i) {
		
		   $(this).css("opacity","0");

		   // fade oben
		   if( i < aktuell && i >= aktuell-5){
			   oben++;
			   if(oben==1)	$(this).css("opacity",o1);
			   if(oben==2)	$(this).css("opacity",o2);
			   if(oben==3)	$(this).css("opacity",o3);
			   if(oben==4)	$(this).css("opacity",o4);
			   if(oben==5)	$(this).css("opacity",o5);
			   $(this).css("color","#b1b2b3");
		   }
		   //fade unten
		   if( i > aktuell && i <= aktuell+5){
			   unten++;
			   if(unten==5)	$(this).css("opacity",o1);
			   if(unten==4)	$(this).css("opacity",o2);
			   if(unten==3)	$(this).css("opacity",o3);
			   if(unten==2)	$(this).css("opacity",o4);
			   if(unten==1)	$(this).css("opacity",o5);
			   $(this).css("color","#b1b2b3");
		   }
		   
		   if(i == aktuell){
			   $(this).css("opacity","1");
			   $(this).css("color","#fff");
		   }

	   });	   
}




function moveMenu2(aktuell){
	
	
	var o1=0.02;
	var o2=0.08;
	var o3=0.28;
	var o4=0.64;
	var o5=0.80;
	

	
	   
	   var x=0.0;
	   var oben=0;
	   var unten=0;
	   $("#menu2").find("li").each(function(i) {
		
		   $(this).css("opacity","0");

		   // fade oben
		   if( i < aktuell && i >= aktuell-5){
			   oben++;
			   if(oben==1)	$(this).css("opacity",o1);
			   if(oben==2)	$(this).css("opacity",o2);
			   if(oben==3)	$(this).css("opacity",o3);
			   if(oben==4)	$(this).css("opacity",o4);
			   if(oben==5)	$(this).css("opacity",o5);
			   $(this).css("color","#b1b2b3");
		   }
		   //fade unten
		   if( i > aktuell && i <= aktuell+5){
			   unten++;
			   if(unten==5)	$(this).css("opacity",o1);
			   if(unten==4)	$(this).css("opacity",o2);
			   if(unten==3)	$(this).css("opacity",o3);
			   if(unten==2)	$(this).css("opacity",o4);
			   if(unten==1)	$(this).css("opacity",o5);
			   $(this).css("color","#b1b2b3");
		   }
		   
		   if(i == aktuell){
			   $(this).css("opacity","1");
			   $(this).css("color","#fff");
		   }

	   });	   
}