$(document).ready(function(){
	var currentPosition = 0;
	var slideWidth = 940;
	var slides = $('.slide');
	var numberOfSlides = slides.length;
	var paused = false;
	var timeout;
	var leftHiding = false;
	var rightHiding = false;
	
	// Remove scrollbar in JS
	$('#slidesContainer').css('overflow', 'hidden');
	
	// Wrap all .slides with #slideInner div
	slides
	.wrapAll('<div id="slideInner"></div>')
	// Float left to display horizontally, readjust .slides width
	.css({
		'float' : 'left',
		'width' : slideWidth
	});
	
	// Set #slideInner width equal to total width of all slides
	$('#slideInner').css('width', slideWidth * numberOfSlides);
	
	// Insert left and right arrow controls in the DOM
	$('#slideShowContainer')
		.prepend('<span class="control" id="leftControl">Move left</span>')
		.append('<span class="control" id="rightControl">Move right</span>');
	
	// Add animations for controls
	$('#leftControl').hover(function(){
		if(!leftHiding)
			$(this).stop().animate({'left' : '-61'},100);
		},function(){
		if(!leftHiding)
			$(this).stop().animate({'left' : '-41'},100);
	});
	
	$('#rightControl').hover(function(){
		if(!rightHiding)
			$(this).stop().animate({'right' : '-61'},100);
		},function(){
		if(!rightHiding)
			$(this).stop().animate({'right' : '-41'},100);
	});
	
	// Hide left arrow control on first load
	manageControls(currentPosition);
	
	// Create event listeners for .controls clicks
	$('.control')
		.bind('click', function(){
		
		paused = true;
		timeout = setTimeout(function(){
			clearTimeout(timeout);
			paused=false;
			},10000);
			
		// Determine new position
		currentPosition = ($(this).attr('id')=='rightControl')
		? currentPosition+1 : currentPosition-1;
	
		// Hide / show controls
		manageControls(currentPosition);
		// Move slideInner using margin-left
		$('#slideInner').animate({
		'marginLeft' : slideWidth*(-currentPosition)
		});
	});
	
	setInterval(function(){
		if(!paused)
		{
			// Determine new position
			currentPosition = (currentPosition == numberOfSlides-1)
			? 0 : currentPosition+1;
	
			// Hide / show controls
			manageControls(currentPosition);
			// Move slideInner using margin-left
			$('#slideInner').animate({
			'marginLeft' : slideWidth*(-currentPosition)
			});
		}
		}, 10000);
		
	
	// manageControls: Hides and shows controls depending on currentPosition
	function manageControls(position){
		// Hide left arrow if position is first slide
		if(position==0){
			leftHiding = true;
			$('#leftControl').animate({'left' : '0'}, function(){
				$(this).hide();
				leftHiding = false;
				});
			$('#rightControl:hidden').show().animate({'right' : '-41'});
			}
		else if(position==1){
			$('#leftControl:hidden').show().animate({'left' : '-41'});
			}
			
		// Hide right arrow if position is last slide
		if(position==numberOfSlides-1){
			rightHiding = true;
			$('#rightControl').animate({'right' : '0'}, function(){
				$(this).hide();
				rightHiding = false;
				});
			}
		else if(numberOfSlides-2){
			$('#rightControl:hidden').show().animate({'right' : '-41'});
			}
		}
});