$(function(){ 
	
	/****************** CONFIGS ***************/
	// ajax parameters
	var noOfElements = 3;
	var isRandom = false;
	
	var speed = 3000; 
	var page = "Home/Banners";
	var fadeInSpeed = 1000;
	var fadeOutSpeed = 800;
	var wrapperHeightAnimationSpeed = 500;
	var elementId = "banner_content"; 
	var fixedHeight = false;
	var stopOnHover = false;
	var showStopper = false;
	var loaderHeight = 0;
	var loaderWidth = 0;
	var loaderColor = "#c3c2ad";
	var timmerWrapperStyle = " ";
	var stopperWrapperStyle = " ";
	/****************** CONFIGS ***************/
 
	var timeLeft;
	var currentPosition = 0;  
	var timmer = $('<div style="position: absolute;z-index: 10;'+timmerWrapperStyle+'" />')
																		 .css( $("#"+elementId).offset() )
																		 .css("marginLeft", ($("#" + elementId).width() + 10) + "px")
																		 .css("height", loaderHeight + "px")
																		 .css("display", "none")
																		 .css("width", loaderWidth+"px");

	var stopper = $('<div status="stop" style="cursor:pointer;background-color: green;position: absolute;z-index: 10;'+stopperWrapperStyle+'" />')
																		 .css( $("#"+elementId).offset() )
																		 .css("margin-left", ( $("#"+elementId).width()+15 )+"px" )
																		 .css("height", "3px")
																		 .css("width", "3px");
	
	if (stopOnHover) {
		$("#banner_wrapper").css("cursor", "pointer");
	}
	$('<div class="ammoSlider" />')
	 		.css("width", loaderWidth+"px")
			.css("height", "0px")
			.css("opacity", .3)
			.css("background", loaderColor)
			.appendTo(timmer);
             
	timmer.appendTo( $("#"+elementId).parent() );

	var startSlider = function(aInteger) {
		currentPosition++;
		changeElement(currentPosition);
		if (aInteger==0) { 
			$('.ammoSlider').animate({"height":"0"},0, function(){
				$('.ammoSlider').animate({"height": loaderHeight+"px", opacity: 1}, speed, 'linear', function(){
					$('.ammoSlider').animate({"height": "0px", opacity: 0.1}, 0);
					startSlider(1);
				}); 
			}); 
		} else { 
			$('.ammoSlider').animate({"height": loaderHeight+"px", opacity: 1}, speed, 'linear', function(){
				$('.ammoSlider').animate({"height": "0px", opacity: 0.1}, 0);
				startSlider(1);
			}); 
		}
	};
	  
	if (stopOnHover) {
		$("#"+elementId).hover(
			function(){   
				$('.ammoSlider').stop();
			}, function(){      
				var catMaiEDeParcurs = loaderHeight - $('.ammoSlider').height(); 
				var catTimpMaiENeveie = speed*catMaiEDeParcurs/loaderHeight;  
				$('.ammoSlider').animate({"height": loaderHeight+"px", opacity: 1}, catTimpMaiENeveie, 'linear', function(){
					$('.ammoSlider').animate({"height": "0px", opacity: 0.1}, 0);
					startSlider(1);
				});
			}
		); 
	};

	var changeElement = function(currentPosition) { 
		$.ajax({ 
			url: page,
			type: "POST",
			data: {
				noOfElements : noOfElements,
				isRandom : isRandom,
				currentPosition : currentPosition
			},  
			success: function(data, txtStatus, xmlHttpRequest){  
				myData = $("<div style='left: 0px; margin-left: 0px;position: absolute' id='myVerticalSlider__"+currentPosition+"' />");
				myData.append(data);    
				//$("#"+elementId).find("#"+"myVerticalSlider__"+(currentPosition-1)).fadeOut(fadeOutSpeed, function(){
					//$(this).remove();
				//});
				myData.appendTo( $("#"+elementId) ).hide().fadeIn(fadeInSpeed, function(){ 
				});  
				if (fixedHeight) {
					myData.parent().animate({"height": myData.height()}, wrapperHeightAnimationSpeed);
				}
			}
		});
	}; 
	
	if (showStopper) {
		stopper.appendTo( $("#"+elementId).parent() );
		
		stopper.hover(
				function(){
					$(this).css("height", "6px"); 
					$(this).css("width", "6px"); 
				}, 
				function(){
					$(this).css("height", "3px"); 
					$(this).css("width", "3px");  
				}
		);		 
		
		stopper.click(function(){
			if ($(this).attr("status")=="stop"){
				$(this).attr("status", "go"); 
				$(this).css("background", "red"); 
				$('.ammoSlider').stop();
				$(timmer).fadeOut(500);
				$(this).stop().animate({"marginTop":"5px"},500).animate({"marginLeft": "-5px"}, 200).animate({"marginTop":"0px"},500);
			} else {
				$(this).attr("status", "stop"); 
				$(this).css("background", "green");  
				$(this).stop().animate({"marginTop":"-5px"},500).animate({"marginLeft": ( $("#"+elementId).width()+15 )+"px"}, 200).animate({"marginTop":"0px"},500);
				$(timmer).fadeIn(500); 
				//startSlider(0); 
			}
		});
	}
	
	startSlider(0); 
});