$(document).ready(function() {
	var currentPosition = 0;
	var slides = $('.slide');
	var numberOfSlides = slides.length;
	
	// Remove scrollbar in JS
	$('#slidesContainer').css('overflow', 'hidden');
	
	//set the move function to just keep moving the slideshow
	var slideshow_timer = setInterval(function () { moveFunction('null') }, 7000);


	$('.control').bind('click', function(){
		//if the control button is clicked stop the timer
		clearInterval(slideshow_timer);
		//move to id
		moveFunction($(this).attr('id').replace(/slide_/g, ""));
	});
	
	
	function moveFunction (position) {
		var oldPosition = currentPosition;
		if(position=="null") {
			//otherwise just increment
			currentPosition = currentPosition+1;			
		}else{
			//something sent
			currentPosition = position;
		}
		
		//check we are not at the end if we are set it back to 0
		if(currentPosition > (numberOfSlides - 1)) {
			currentPosition = 0;
		}
		//sort the buttons out 
		buttonsFunction(currentPosition);
		
		
		//fade out the old div...
		$('#slide_img_' + oldPosition).fadeOut(1000);
		//fade in the new div
		$('#slide_img_' + currentPosition).fadeIn(1000);
	}
	
	function buttonsFunction(position) {
		//set all to inactive
		$('.control img').attr("src","/img/slideshow/unactive.png");
		//set the current position to active
		$('#slide_' + position + ' img').attr("src","/img/slideshow/active.png");
	}
});