function fader(animeWidth, animeNum)
{
	//Animate the list items
	$("#screenList>LI:eq(" + animeNum + ")").fadeIn(2000).delay(7000).fadeOut(2000);

	//Increment the variable to get the media
	animeNum = animeNum + 1;
	
	//Animate the images
	$("#featureImage")
		.css({backgroundImage: "url('media/feature_" + animeNum + ".png')", width: animeWidth, opacity: 0})
		.animate({marginRight: "0%"}, 0) //using animate, as CSS doesn't seem to work
		.animate({marginRight: "20%", opacity: "1"}, 2000)
		.delay(7000)
		.animate({marginRight: "50%", opacity: "0"}, 2000);
}

function rotate()
{

	//Preload images	
	var image1 = $('<img />').attr('src', 'media/feature_1.png');
	var image2 = $('<img />').attr('src', 'media/feature_2.png');
	var image3 = $('<img />').attr('src', 'media/feature_3.png');
	var image4 = $('<img />').attr('src', 'media/feature_4.png');
	var image5 = $('<img />').attr('src', 'media/feature_5.png');
	var image6 = $('<img />').attr('src', 'media/feature_6.png');

	//Get widths and declare variables
	var animeTotal = 6, animeWidths = ["268px", "300px", "300px", "320px", "240px", "275px"], i = 0;

	//Set the initial LI to be hidden, so we can fade in.
	$("#screenList>LI:eq(0)").hide();

	//Run the fader initially, and after 11.5 seconds.
	fader(animeWidths[i], i);
	setInterval(function () {
		i = i + 1;
		if (i >= animeTotal) {
			i = 0;
		}
		fader(animeWidths[i], i);
	}, 11500
	);
	
}

function divwipe()
{
	//Reset DIV positions
	$("#yellowLight, #whiteLight").css("width", "0px");

	//Animate the over DIV
	$("#yellowLight").animate({width: "960px"}, 1500);

	//Animate the second DIV 200ms later
	$("#whiteLight").delay(200).animate({width: "960px"}, 1500);
}

$(document).ready(function () {

	var tweetHovering = false;

	//Set the Social Media hover animations
	$(".socialMedia").hover(
		function () {
			$(this).animate({
					paddingTop: '0px'
				}, 200);
		},
		function () {
			$(this).animate({
					paddingTop: '10px'
				}, 200);
		}
	);
	
	$("#twitterIcon").hover(
		function () {
			$("#twitterBox").fadeIn();
		},
		function () {
			$("#twitterBox").fadeOut();
		}
	);
	

	
	//Set the DIVS to to wipe
	divwipe();
	setInterval(function () {
		divwipe();
	}, 10000);
	
	//Preload images
	
	var image1 = $('<img />').attr('src', 'media/feature_1.png');
	var image2 = $('<img />').attr('src', 'media/feature_2.png');
	var image3 = $('<img />').attr('src', 'media/feature_3.png');
	var image4 = $('<img />').attr('src', 'media/feature_4.png');
	var image5 = $('<img />').attr('src', 'media/feature_5.png');
	var image6 = $('<img />').attr('src', 'media/feature_6.png');
	
	//Run the anime rotater
	rotate();
	
	//Create a link for the feature
	$("#featureContent").click(function(){window.location = 'events.php#screenings';}); 
	$("#featureContent").hover(function(){$(this).css('cursor','pointer')},function(){$(this).css('cursor','auto')});
	
});