$(document).ready(function(){
	var currentPosition = 0;
	var slideWidth = 560;
	var slides = $('.slide');
	var numberOfSlides = slides.length;
	var timerInterval = 7000;

	// 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 controls in the DOM
	$('#slideshow')
		.prepend('<span id="slide-counter">1 of 5</span>')
		.prepend('<span class="control" id="leftControl">Clicking moves left</span>')
		.prepend('<span class="control" id="rightControl">Clicking moves right</span>');	
	
	// Hide left arrow control on first load
	manageControls(currentPosition);
	
	// Create event listeners for .controls clicks
	$('.control')
		.bind('click', function(){
								
		// Determine new position	
		if ( currentPosition > 0 && $(this).attr('id')=='leftControl' ) {
			currentPosition = currentPosition-1;
		}
		if ( currentPosition < numberOfSlides-1 && $(this).attr('id')=='rightControl' ) {
			currentPosition = currentPosition+1;
		}
		
		// Hide / show controls
		manageControls(currentPosition);
		
		// Move slideInner using margin-left
		$('#slideInner').animate({
			'marginLeft' : slideWidth*(-currentPosition)
		});
	
	});	
		
	
	// TIMER / AUTO ROTATE FUNCTIONS
	var timerActive = false;
	$('#slideshow').everyTime(timerInterval, 'rotate-slides', function() {
		if ( currentPosition < numberOfSlides-1 ) {
			// update current position
			currentPosition = currentPosition+1;
			// Move slideInner using margin-left
			$('#slideInner').animate({
				'marginLeft' : slideWidth*(-currentPosition)
			});
			// Hide / show controls
			manageControls(currentPosition);
		}
	});
	
	$('#slideshow').mouseout(function() {
		if (!timerActive) {
			timerActive = !timerActive;
			$('#slideshow').everyTime(timerInterval, 'rotate-slides', function() {
			if ( currentPosition < numberOfSlides-1 ) {
				// update current position
				currentPosition = currentPosition+1;
				// Move slideInner using margin-left
				$('#slideInner').animate({
					'marginLeft' : slideWidth*(-currentPosition)
				});
				// Hide / show controls
				manageControls(currentPosition);
			}
			});
		}
	}).mouseover(function() {
		if (timerActive) {
			timerActive = !timerActive;
			$('#slideshow').stopTime('rotate-slides');
		}
	});
	
	

  	// manageControls: Hides and Shows controls depending on currentPosition
  	function manageControls(position){
    	// Hide left arrow if position is first slide
		if(position==0){
			$('#leftControl').removeClass('active');
			$('#leftControl').addClass('disabled');
		} else { 
			$('#leftControl').removeClass('disabled');
			$('#leftControl').addClass('active');
		}
		// Hide right arrow if position is last slide
   		if(position==numberOfSlides-1){
			$('#rightControl').removeClass('active');
			$('#rightControl').addClass('disabled');
		} else { 
			$('#rightControl').removeClass('disabled');
			$('#rightControl').addClass('active');
		}
		$('#slide-counter').html( (position+1) + ' of ' + (numberOfSlides) );
  	}
		
  
});