$(function(){ 
	
	/****************** CONFIGS ***************/
	// ajax parameters
	var noOfElements = 2;
	var isRandom = false;
	
	var speed = 10000; 
	var page = "_ajax_get_promotion_products.php";
	var fadeInSpeed = 500;
	var fadeOutSpeed = 200;
	var wrapperHeightAnimationSpeed = 200;
	var elementId = "promotii_wrapper"; 
	var fixedHeight = false;
	var stopOnHover = true;
	var showStopper = false;
	var loaderHeight = 150;
	var loaderWidth = 3;
	var loaderColor = "#c3c2ad";
	var timmerWrapperStyle = "border-bottom: 1px dotted #000; ";
	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("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='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); 
});