$(window).load(function() {
	
	$('.slides_holder').each(function() {
		
		var imageWidth;
		var imageSum;
		var imageReelWidth;
		var goRight;
		var goLeft;
		var current;
		
		var rotate;
		var rotateSwitch;
		
		var holder = $(this);
		
		imageWidth = $(this).children('.slide').outerWidth(true);
		imageSum = $(this).children('.slide').size();

		imageReelWidth = imageWidth * imageSum;
		
		$(this).css({'width' : imageReelWidth});
		
		current = 0;
		
		rotate = function(){

			if(current == -(imageSum - 3)) {
				goLeft = true;
				goRight = false;
			}else if(current == 0){
				goLeft = false;
				goRight = true;
			}
			if(goRight == true) {
				current--;	
			}
			if(goLeft == true) {
				current++;	
			}
		
			var image_reelPosition = current * imageWidth; 
			
			//Slider Animation
			holder.stop(true, true).animate({
				left: image_reelPosition
			}, 500);
		}; 
		
		//Rotation  and Timing Event
		rotateSwitch = function(){
			play = setInterval(function(){ 
				rotate(); 
			}, 5000); 
		};
		rotateSwitch(); //Run function on launch
		
		//On Hover
		$(this).children('a').hover(function() {
				clearInterval(play); 
			}, function() {
				rotateSwitch(); 
		});		
	});
	
	 
		currentStep = 0;
	
	 showNextStep = function(){
		
		currentStep++;
		var position = currentStep * $('.stap').width();
		$('.stappen_holder').stop(true, true).animate({
			left: -position
		}, 500);
	};
	

});
$(function() {
		setInterval( "slideSwitch()", 7000 );
});
function slideSwitch() {
	
	var $active = $('#slideshow .slide.active');
	if ( $active.length == 0 ) $active = $('#slideshow .slide').last();

	var $next =  $active.next().length ? $active.next(): $('#slideshow .slide').first();

	$active.addClass('last-active');

	$next.css({opacity: 0.0})
		.addClass('active')
		.animate({opacity: 1.0}, 1000, function() {
			$active.removeClass('active last-active');
		});
}