function theRotator() {
	//Set the opacity of all images to 0
	$('div#rotator ul li').css({opacity: 0.0});
	
	//Get the first image and display it (gets set to full opacity)
	$('div#rotator ul li:first').css({opacity: 1.0});
		
	//Call the rotator function to run the slideshow, 6000 = change to next image after 6 seconds
	rotation = setInterval('rotate()',4000);
	
}

function rotate() {	
	//Get the first image
	var current = ($('div#rotator ul li.show')?  $('div#rotator ul li.show') : $('div#rotator ul li:first'));

	//Get next image, when it reaches the end, rotate it back to the first image
	var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $('div#rotator ul li:first') :current.next()) : $('div#rotator ul li:first'));	
	
	//Set the fade in effect for the next image, the show class has higher z-index
	next.css({opacity: 0.0})
	.addClass('show')
	.animate({opacity: 1.0}, 1000);

	//Hide the current image
	current.animate({opacity: 0.0}, 1000)
	.removeClass('show');
	slide();
};
var speed = 800;
var distance = 174;
var currentX = 67;
var total = 0;

function slide() {
	
	if(currentX >= 501) {
		$('#thumb-overlay').animate({left: '67'}, speed);
		currentX = 67;
	}
	else {
		$('#thumb-overlay').animate({left: '+=174'}, speed, function() {
			total = currentX + distance;
			currentX = total;
		});
	}
}

function theThumbnails() {
	
	$('<a id="scroll-left" href="javascript:;"></a><a id="scroll-right" href="javascript:;"></a>').appendTo('#thumbs');


	$("div#thumbs ul li").click(function(event){			   
		clearInterval(rotation);
		
		if(this.id == "thumb1") {
			$('.show').animate({opacity: 0.0}, 1000).removeClass('show');		
			$('li#1').animate({opacity: 1.0}, 1000).addClass('show');
			$('#thumb-overlay').animate({left: '67'}, speed);
			currentX = 67;
		}
		if(this.id == "thumb2") {
			$('.show').animate({opacity: 0.0}, 1000).removeClass('show');		
			$('li#2').animate({opacity: 1.0}, 1000).addClass('show');
			$('#thumb-overlay').animate({left: '241'}, speed);
			currentX = 241;
		}
		if(this.id == "thumb3") {
			$('.show').animate({opacity: 0.0}, 1000).removeClass('show');		
			$('li#3').animate({opacity: 1.0}, 1000).addClass('show');
			$('#thumb-overlay').animate({left: '415'}, speed);
			currentX = 415;
		}
		if(this.id == "thumb4") {
			$('.show').animate({opacity: 0.0}, 1000).removeClass('show');		
			$('li#4').animate({opacity: 1.0}, 1000).addClass('show');
			$('#thumb-overlay').animate({left: '589'}, speed);
			currentX = 589;
		}
		
	});
	
	$("#scroll-right").click(function(event){
		clearInterval(rotation);
		
		if($('#1').is('.show')) {
			$('.show').animate({opacity: 0.0}, 1000).removeClass('show');		
			$('li#2').animate({opacity: 1.0}, 1000).addClass('show');
			$('#thumb-overlay').animate({left: '+=174'}, speed, function() {
				total = currentX + distance;
				currentX = total;
			});
		}
		else if($('#2').is('.show')) {
			$('.show').animate({opacity: 0.0}, 1000).removeClass('show');		
			$('li#3').animate({opacity: 1.0}, 1000).addClass('show');
			$('#thumb-overlay').animate({left: '+=174'}, speed, function() {
				total = currentX + distance;
				currentX = total;
			});
		}
		else if($('#3').is('.show')) {
			$('.show').animate({opacity: 0.0}, 1000).removeClass('show');		
			$('li#4').animate({opacity: 1.0}, 1000).addClass('show');
			$('#thumb-overlay').animate({left: '+=174'}, speed, function() {
				total = currentX + distance;
				currentX = total;
			});
		}
		else if($('#4').is('.show')) {
			$('.show').animate({opacity: 0.0}, 1000).removeClass('show');		
			$('li#1').animate({opacity: 1.0}, 1000).addClass('show');
			$('#thumb-overlay').animate({left: '67'}, speed);
			currentX = 67;
		}
		
		
	});
	
	$("#scroll-left").click(function(event){
		clearInterval(rotation);
		
		if($('#1').is('.show')) {
			$('.show').animate({opacity: 0.0}, 1000).removeClass('show');		
			$('li#4').animate({opacity: 1.0}, 1000).addClass('show');
			$('#thumb-overlay').animate({left: '589'}, speed);
			currentX = 589;
		}
		else if($('#2').is('.show')) {
			$('.show').animate({opacity: 0.0}, 1000).removeClass('show');		
			$('li#1').animate({opacity: 1.0}, 1000).addClass('show');
			$('#thumb-overlay').animate({left: '-=174'}, speed, function() {
				total = currentX + distance;
				currentX = total;
			});
		}
		else if($('#3').is('.show')) {
			$('.show').animate({opacity: 0.0}, 1000).removeClass('show');		
			$('li#2').animate({opacity: 1.0}, 1000).addClass('show');
			$('#thumb-overlay').animate({left: '-=174'}, speed, function() {
				total = currentX + distance;
				currentX = total;
			});
		}
		else if($('#4').is('.show')) {
			$('.show').animate({opacity: 0.0}, 1000).removeClass('show');		
			$('li#3').animate({opacity: 1.0}, 1000).addClass('show');
			$('#thumb-overlay').animate({left: '-=174'}, speed, function() {
				total = currentX + distance;
				currentX = total;
			});
		}
		
		
	});	
	
}