var currentPanel = 0;
var nextPanel = 1;
var panelsNumber;
var $rotatorContainer; 
var rotWidth;
var rotateDelay = 350;
var si1,si2,si3;
var titleHeight;


$(document).ready(
	function()
	{	 
		
		$rotatorContainer = $("#rotator");
		rotWidth = (parseInt($rotatorContainer.css('width')));
		panelsNumber = $rotatorContainer.children().length;
		si1 = setInterval(slide,10000);
		
		$titleRotatorContainer = $('#titleRotator');
		si2 = setInterval(titleRotator,3000);
		titleHeight = $('#titleRotator li:first').height();
		si3 = setTimeout("bottomMenu()",100);
	}
)

function slide(){
	
		$rotatorContainer.children().eq(currentPanel).animate({'left' : -rotWidth},rotateDelay, function(){$(this).css('display','none')});
		$rotatorContainer.children().eq(nextPanel).css({'left' : rotWidth, 'display':'block'}).animate({'left' : 0},rotateDelay);
		currentPanel  = nextPanel;
		(nextPanel < panelsNumber-1) ? nextPanel++ : nextPanel = 0;
		
}


function titleRotator(){
		var deleted = $('#titleRotator li:first');
		var added =  $('#titleRotator li:last');
		$('#titleRotator').animate({'top' : -titleHeight},400, function()
			{

			$('#titleRotator ul').append($('#titleRotator li:first'));	
			$('#titleRotator').css({'top' : 0});	
			});
		

	
}


function bottomMenu(){

	  //  $("#bottom a").parent().animate({width: 20,opacity: 0.1},1500);
		
		var widths = [];
		var elements = [];
		$(".menu a").each(function(i){
			widths[i] = $(this).outerWidth();
			elements[i] = $(this).wrap('<div class="bottomLinkContainer"></div>')
					  .before('<div class="bottomLinkOrangeBG"></div>')
					  .wrap('<div class="bottomLinkTextContainer"></div>');	
		    elements[i].parent().parent().css("width", widths[i]+40);
		    elements[i].parent().prev().css({"width" : widths[i] , "opacity":0 });
			elements[i].parent().css({"width": widths[i]+20, "marginLeft" : 10});
			elements[i].css({"paddingLeft": 0});
			elements[i].hover(
			function(){
				$(this).css({"color" : "#fff"}).clearQueue().animate({"paddingLeft" : 20, "width" : widths[i]+20},300);
				$(this).parent().prev().clearQueue().animate({"width" : widths[i]+20 , "height" : 27, "opacity" :1, "marginLeft" : 15, "marginTop" : 0},100);
			},
			function(){
				$(this).css({"color" : "#8fa0c7"}).clearQueue().animate({"paddingLeft" : 0},300);
				$(this).parent().prev().clearQueue().animate({"width" : widths[i] , "height" : 17, "opacity" :0, "marginLeft" : 0, "marginTop" : 5},100);
			})
		 })
					 
}