jQuery(function() {

  //remove js-disabled class
	jQuery("#viewer").removeClass("js-disabled");

  //create new container for images
	//jQuery("<div>").attr("id", "container").css({ position:"absolute"}).width(jQuery(".wrapperss").length * 170).height(170).appendTo("div#viewer");
				
	jQuery("<div>").attr("id", "container").css({ position:"absolute"}).width(jQuery(".wrapperss").length * 77).height(50).appendTo("div#viewer");
	
	//add images to container
	jQuery(".wrapperss").each(function() {
		jQuery(this).appendTo("div#container");
	});
	
	//work out duration of anim based on number of images (1 second for each image)
	//var duration = jQuery(".wrapperss").length * 2000;
	var duration = jQuery(".wrapperss").length * 1500;
	
	//store speed for later (distance / time)
	var speed = (parseInt(jQuery("div#container").width()) + parseInt(jQuery("div#viewer").width())) / duration;
					
	//set direction
	var direction = "rtl";
	
	//set initial position and class based on direction
	if(document.getElementById('viewer'))
	{
		//alert(document.getElementById('viewer'));
	(direction == "rtl") ? jQuery("div#container").css("left", jQuery("div#viewer").width()).addClass("rtl") : jQuery("div#container").css("left", 0 - jQuery("div#container").width()).addClass("ltr") ;
	}

	//animator function
	var animator = function(el, time, dir) {
	 
		//which direction to scroll
		if(dir == "rtl") {
		  
		  //add direction class
			el.removeClass("ltr").addClass("rtl");
				
			//animate the el
			el.animate({ left:"-" + el.width() + "px" }, time, "linear", function() {
									
				//reset container position
				jQuery(this).css({ left:jQuery("div#imageScroller").width(), right:"" });
				
				//restart animation
				animator(jQuery(this), duration, "rtl");
				
				//hide controls if visible
				(jQuery("div#controls").length > 0) ? jQuery("div#controls").slideUp("slow").remove() : null ;			
								
			});
		} else {
		
		  //add direction class
			el.removeClass("rtl").addClass("ltr");
		
			//animate the el
			el.animate({ left:jQuery("div#viewer").width() + "px" }, time, "linear", function() {
									
				//reset container position
				jQuery(this).css({ left:0 - jQuery("div#container").width() });
				
				//restart animation
				animator(jQuery(this), duration, "ltr");
				
				//hide controls if visible
				(jQuery("div#controls").length > 0) ? jQuery("div#controls").slideUp("slow").remove() : null ;			
			});
		}
	}
	
	jQuery("div#container").css("left","-500px");				//start anim
	animator(jQuery("div#container"), duration, direction);

	//pause on mouseover

	//handler for ltr button
	jQuery("#ltr").mouseover(function() {
		var duration = jQuery(".wrapperss").length * 800;
		
		//store speed for later (distance / time)
		var speed = (parseInt(jQuery("div#container").width()) + parseInt(jQuery("div#viewer").width())) / duration;
							
		//stop anim
		jQuery("div#container").stop(true);
	
		//swap class names
		jQuery("div#container").removeClass("rtl").addClass("ltr");
							
		//work out total travel distance
		var totalDistance = parseInt(jQuery("div#container").width()) + parseInt(jQuery("div#viewer").width());
		
		//work out remaining distance
		var distanceLeft = totalDistance - (parseInt(jQuery("div#container").css("left")) + parseInt(jQuery("div#container").width()));
		
		//new duration is distance left / speed)
		var newDuration = distanceLeft / speed;
		
		//restart anim
		animator(jQuery("div#container"), newDuration, "ltr");
	});
	
	
	
	jQuery("#ltr").mouseout(function() {
	
		var duration = jQuery(".wrapperss").length * 2000;
		
		//store speed for later (distance / time)
		var speed = (parseInt(jQuery("div#container").width()) + parseInt(jQuery("div#viewer").width())) / duration;
						
		//stop anim
		jQuery("div#container").stop(true);
	
		//swap class names
		jQuery("div#container").removeClass("rtl").addClass("ltr");

							
		//work out total travel distance
		var totalDistance = parseInt(jQuery("div#container").width()) + parseInt(jQuery("div#viewer").width());
		
		//work out remaining distance
		var distanceLeft = totalDistance - (parseInt(jQuery("div#container").css("left")) + parseInt(jQuery("div#container").width()));
		
		//new duration is distance left / speed)
		var newDuration = distanceLeft / speed;
		
		//restart anim
		animator(jQuery("div#container"), newDuration, "ltr");
	});
	
	
	
									
	jQuery("#rtl").mouseover(function() {

		var duration = jQuery(".wrapperss").length * 800;
	
		//store speed for later (distance / time)
		var speed = (parseInt(jQuery("div#container").width()) + parseInt(jQuery("div#viewer").width())) / duration;
		//stop anim
		jQuery("div#container").stop(true);
		
		//swap class names
		jQuery("div#container").removeClass("ltr").addClass("rtl");
		
		//work out total travel distance
		var totalDistance = parseInt(jQuery("div#container").width()) + parseInt(jQuery("div#viewer").width());
		//var totalDistance = 500;

		//work out remaining distance
		var distanceLeft = totalDistance - (parseInt(jQuery("div#viewer").width()) - (parseInt(jQuery("div#container").css("left"))));
		
		//new duration is distance left / speed)
		var newDuration = distanceLeft / speed;
	
		//restart anim
		animator(jQuery("div#container"), newDuration, "rtl");

	});
	
	jQuery("#rtl").mouseout(function() {


		var duration = jQuery(".wrapperss").length * 2000;
			
		//store speed for later (distance / time)
		var speed = (parseInt(jQuery("div#container").width()) + parseInt(jQuery("div#viewer").width())) / duration;
		//stop anim
		jQuery("div#container").stop(true);
		
		//swap class names
		jQuery("div#container").removeClass("ltr").addClass("rtl");
		
		//work out total travel distance
		var totalDistance = parseInt(jQuery("div#container").width()) + parseInt(jQuery("div#viewer").width());
		//var totalDistance = 500;
	
		//work out remaining distance
		var distanceLeft = totalDistance - (parseInt(jQuery("div#viewer").width()) - (parseInt(jQuery("div#container").css("left"))));
		
		//new duration is distance left / speed)
		var newDuration = distanceLeft / speed;
	
		//restart anim
		animator(jQuery("div#container"), newDuration, "rtl");
	
	});
	
	jQuery("a.wrapperss").mouseover(function() {
		jQuery("div#container").stop(true);
	});
	
	jQuery("a.wrapperss").mouseout(function() {
		
		var duration = jQuery(".wrapperss").length * 2000;
			
		//store speed for later (distance / time)
		var speed = (parseInt(jQuery("div#container").width()) + parseInt(jQuery("div#viewer").width())) / duration;
		//stop anim
		jQuery("div#container").stop(true);
		
		//swap class names
		jQuery("div#container").removeClass("ltr").addClass("rtl");
		
		//work out total travel distance
		var totalDistance = parseInt(jQuery("div#container").width()) + parseInt(jQuery("div#viewer").width());
		//var totalDistance = 500;
	
		//work out remaining distance
		var distanceLeft = totalDistance - (parseInt(jQuery("div#viewer").width()) - (parseInt(jQuery("div#container").css("left"))));
		
		//new duration is distance left / speed)
		var newDuration = distanceLeft / speed;
	
		//restart anim
		animator(jQuery("div#container"), newDuration, "rtl");
		
	});
	

});