$(document).ready(
	function()
	{
		//global vars declaration 
		var currentPanel = 0;
		var nextPanel = 1;
		var panelsNumber;
		var $rotatorContainer; 
		var rotWidth;
		var transitionTime = 1500;
		var transitionTimeforButtons = 500;
		var delayTime = 5400;
		var si1;
		var playbackOn = true;

	
		$rotatorContainer = $("#bannerContentContainer");
		rotWidth = $rotatorContainer.width();
		$news = $rotatorContainer.children("#bannerContentContainer .singleBanner");
		panelsNumber = $news.length;
		if (panelsNumber <2) return;
		si1 = setInterval(getNext,delayTime);
		deployButtons();
		
		function getNext(){
			nextPanel = (currentPanel == panelsNumber-1) ? 0 : currentPanel+1;
			$news.eq(currentPanel).css('marginLeft',0).animate({'marginLeft' : -rotWidth-1},transitionTime , function(){$(this).css('display','none')});
			$news.eq(nextPanel).css({'marginLeft' : rotWidth+1, 'display':'block'}).animate({'marginLeft' : 0},transitionTime );
			$("#bannerButtons .button").eq(currentPanel).find(".picture").removeClass("on").addClass("off");	
			$("#bannerButtons .button").eq(nextPanel).find(".picture").removeClass("off").addClass("on");	
			currentPanel  = nextPanel;
		}
		function deployButtons(){
			for (var i = 0; i<panelsNumber; i++){
				$("#bannerButtons").append('<div class="button"><div class="picture off"></div></div>');
				$("#bannerButtons .button").eq(i).click(function(){
					if (playbackOn == true) {
						playbackOn = false;
						clearInterval(si1);
					}
					if ( $(this).index() == currentPanel) return;
					$(this).siblings().find(".picture").removeClass("on").addClass("off");		
					$(this).find(".picture").removeClass("off").addClass("on");	
					getBannerOnClick($(this).index());
				});
			}
			$("#bannerButtons .button").eq(0).find(".picture").removeClass("off").addClass("on");	
		}
		function getBannerOnClick(which){
			nextPanel = which;	
			$news.eq(currentPanel).css('marginLeft',0).animate({'marginLeft' : -rotWidth-1},transitionTimeforButtons , function(){$(this).css('display','none')});
			$news.eq(nextPanel).css({'marginLeft' : rotWidth+1, 'display':'block'}).animate({'marginLeft' : 0},transitionTimeforButtons );
			currentPanel  = nextPanel;
		}
	}
)