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
	//setInterval('rotate()',6000);

	$("div#rotator a.right").click(function() {
		rotate("right");
		return false;
	});
	$("div#rotator a.left").click(function() {
		rotate("left");
		return false;
	});
//	console.log("theRotator");
}

function rotate(direction) {
//	console.log("rotate: "+direction);

  if(!direction) {
    direction = "right";
  }
	//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;

	if(direction=="right") {
		if($current.next().length == 0) {
			$next = $('div#rotator ul li:first');
		} else {
			$next = $current.next();
		}
//        $next = (($current.next().length) ? (($current.next().hasClass('show')) ? $('div#rotator ul li:first') :$current.next()) : $('div#rotator ul li:first'));
	} else {
		if($current.prev().length == 0) {
			$next = $('div#rotator ul li:last');
		} else {
			$next = $current.prev();
		}
//        $next = (($current.previous().length) ? (($current.previous().hasClass('show')) ? $('div#rotator ul li:last') :$current.previous()) : $('div#rotator ul li:last'));
	}

//	console.log($next.find("img").attr("src"));
	//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');

};