
var active = false;
var speed = 600;

$(document).ready( function() { 


	$("#carousel li").hover(function() {
		$(this).addClass("over");
	}, function() {
		$(this).removeClass("over");
	});

	var cssPast 	= { top: '244px', left: '1px', width: '1px', height: '1px' };
	var cssPrev 	= { top: '93px', left: '2px', width: '181px', height: '152px' };
	var cssCurrent	= { top: '-12px', left: '171px', width: '298px', height: '257px' };
	var cssNext 	= { top: '68px', left: '460px', width: '208px', height: '177px' };
	var cssNexter 	= { top: '93px', left: '660px', width: '181px', height: '152px' };
	var cssFuture 	= { top: '244px', left: '834px', width: '1px', height: '1px' };

	// click slot #1
	$("#carousel li.prev").live('click', function() {
		if(active) return;
		active = true;
		$("#carousel li.past").last().children('img').show().animate(cssPrev, speed, addClassPrev);
		$("#carousel li.current").children('img').animate(cssNext, speed, addClassNext);
		$("#carousel li.next").children('img').animate(cssNexter, speed, addClassNexter);
		$("#carousel li.nexter").children('img').animate(cssFuture, speed, addClassFuture);
		$("#carousel li.prev").children('img').animate(cssCurrent, speed, addClassCurrent);
		refreshFeatureContent(this);
	});
	
	// click slot #2 
	//  slot #2 holds current feature...therefore click has not effect

	// click slot #3
	$("#carousel li.next").live('click', function() {
		if(active) return;
		active = true;
		$("#carousel li.prev").children('img').animate(cssPast, speed, addClassPast);
		$("#carousel li.current").children('img').animate(cssPrev, speed, addClassPrev);
		$("#carousel li.nexter").children('img').animate(cssNext, speed, addClassNext);
		$("#carousel li.future").first().children('img').show().animate(cssNexter, speed, addClassNexter);
		$("#carousel li.next").children('img').animate(cssCurrent, speed, addClassCurrent);
		refreshFeatureContent(this);
	});

	// click slot #4
	$("#carousel li.nexter").live('click', function() {
		if(active) return;
		active = true;
		$("#carousel li.prev").children('img').animate(cssPast, speed, addClassPast);
		$("#carousel li.current").children('img').animate(cssPast, speed, addClassPast);
		$("#carousel li.next").children('img').animate(cssPrev, speed, addClassPrev);
		$("#carousel li.future").eq(0).children('img').show().animate(cssNext, speed, addClassNext);
		$("#carousel li.future").eq(1).children('img').show().animate(cssNexter, speed, addClassNexter);
		$("#carousel li.nexter").children('img').animate(cssCurrent, speed, addClassCurrent);
		refreshFeatureContent(this);
	});

});



function refreshFeatureContent(o) {
	var s = '';
	if( $(o).hasClass('classical') ) s = 'classical';
	if( $(o).hasClass('pops') ) s = 'pops';
	if( $(o).hasClass('csovations') ) s = 'csovations';
	if( $(o).hasClass('picnic') ) s = 'picnic';
	if( $(o).hasClass('popcorn') ) s = 'popcorn';

	var infoUrl = 'pages' + $(o).children('a').attr('href') + '.php';
	$('#eventcontent .inner').removeClass('classical pops csovations picnic popcorn').addClass(s).load(infoUrl);
	$('#tile-' + s).children('a.tile').click();

}

function addClassPrev() { doAddClass(this, 'prev'); }
function addClassPast() { doAddClass(this, 'past'); }
function addClassCurrent() { doAddClass(this, 'current'); active = false; }
function addClassNext() { doAddClass(this, 'next'); }
function addClassNexter() { doAddClass(this, 'nexter'); }
function addClassFuture() { doAddClass(this, 'future'); }

function doAddClass(o, cl) {
	$(o).parent().removeClass("past")
		.removeClass("prev")
		.removeClass("current")
		.removeClass("next")
		.removeClass("nexter")
		.removeClass("future")
		.addClass(cl);
	active--;
}


