$(function() {
	
	var total = $('#rotator ul li').size();
	var duration = 6000;
	var transSpeed = 500;
	var currentThumb = 0;
	var lastThumb = -1;
	var currentImg = 2;
	var lastImg = 1;
	
	// set styles
	$('#rotator > div:not(:first)').css('display','none');
	$('#rotator ul li:first').addClass('active').append('<span></span>');
	
	// auto
	function rotate() {
		
		currentThumb++;
		lastThumb++;
		
		(currentThumb >= total) ? currentThumb = 0 : currentThumb = currentThumb;
		(lastThumb >= total) ? lastThumb = 0 : lastThumb = lastThumb;
		(currentImg > total) ? currentImg = 1 : currentImg = currentImg;
		(lastImg > total) ? lastImg = 1 : lastImg = lastImg;
		
		$('#rotator ul li:eq('+lastThumb+')').removeClass('active');
		$('#rotator ul li span').remove();
		$('#rotator #rotator-'+lastImg).fadeOut(transSpeed);
		
		$('#rotator ul li:eq('+currentThumb+')').addClass('active').append('<span></span>');
		$('#rotator #rotator-'+currentImg).fadeIn(transSpeed);
		
		currentImg++;
		lastImg++;
		
	}
	
	
	// manual
	$('#rotator ul li').click(function() {
  
  		clearInterval(startRotate);

  		var currentImg = $(this).parent().find('li').index(this) + 1;
		
		$('#rotator ul li').each(function() {
    		$(this).removeClass('active');
			$('#rotator ul li span').remove();
  		});
	
  		$(this).addClass('active').append('<span></span>');
		
		$('#rotator #rotator-'+lastImg).fadeOut(transSpeed);
		$('#rotator #rotator-'+currentImg).fadeIn(transSpeed);
		lastImg = currentImg;
		
	});
	
	
var startRotate = setInterval(rotate, duration);	
	
});