$(document).ready(function() { 
	
	// initialize timer
	var splashInterval = 7000 / 8;
	
	var i = 1;
	var tid = setInterval( function() { loopSplash( i ); i = i+1; }, splashInterval);
	//var timerInt = splashInterval / 5;
	
	oLine();
	centerSplash();
	placeArrows();
	copySpace(0);
	
	$('#timer img:first').show();

	$('#page-splash-copy-space-inner').html( $('#splash-text-0').html() );
	
	$(window).resize(function() {
		centerSplash();
		placeArrows();
	});
		
	$('.snav').hover(
		function() {
			var ok = $(this).hasClass('snav-on');
			if (!ok) { $(this).addClass('snav-over'); }
		},
		function() {
			var ok = $(this).hasClass('snav-on');
			if (!ok) { $(this).removeClass('snav-over'); }
		}
	).click(function() {
		var remId = $('.snav-on').attr('id');
		var addId = $(this).attr('id');
		$('.snav').removeClass('snav-on');
		$(this).addClass('snav-on');
		$(this).removeClass('snav-over');
		if($("#snav-next").data('automatic')==0){
			//it happened manually.
			_gaq.push(['_trackEvent', 'Rotator Category', 'Change', $(this).html()]);
		}
		$("#splash-img"+remId).fadeOut("slow");
		$("#splash-img"+addId).fadeIn("slow");
		copySpace( addId );
		oLine();
	});
	
	$('#snav-next').click(function() {
		//we need this so that we can track clicks rather than automatic firing
		$("#snav-next").data('automatic', '1');
		var nextId = $('.snav-on').attr('id');
		nextId = parseInt(nextId) + 1;
		if (nextId > 6) nextId = 0; 
		$('#'+nextId).click();
		//we need this so that we can track clicks rather than automatic firing
		$("#snav-next").data('automatic', '0');
		return false;
	});

	$('#snav-prev').click(function() {
		var prevId = $('.snav-on').attr('id');
		prevId = parseInt(prevId) - 1;
		if (prevId < 0) prevId = 6; 
		$('#'+prevId).click();
		return false;
	});
	
	$('#page-splash').hover(
		function() { 
			clearInterval(tid); 
			$('#t0').show().siblings().hide();
			$('#pause').show().animate({ opacity: 0, left: '-=50', top: '-=50', width: '180', height: '180' }, 250, function() { resetIcon( $(this) ); } );  
			$('#play').hide();
		},
		function() { 
				$('#snav-next').animate({ opacity: 1 }, 1000, function() { $(this).click(); });
				i = 1;
				tid = setInterval(function() { loopSplash( i ); i = i+1; }, splashInterval); 
				$('#pause').hide(); 
				$('#play').show().animate({ opacity: 0, left: '-=50', top: '-=50', width: '180', height: '180' }, 250, function() { resetIcon( $(this) ); } );	
		}
	);

	$('#snav-prev').hover(
		function() { $(this).css('background-position','bottom left'); },
		function() { $(this).css('background-position','top left'); }
	);
	$('#snav-next').hover(
		function() { $(this).css('background-position','bottom right'); },
		function() { $(this).css('background-position','top right'); }
	);

	function loopSplash( i ) {
		var x = (i % 8) + 1;
		$('#t'+x).show().siblings().hide();
		
		if (x == 1) $('#snav-next').click();
	}
	
});

function centerSplash() {
	var bWidth = $(window).width();
	var leftOffset = (2000 - bWidth) / 2 * -1;
	var logoOffset = $('#logo').offset();
	var pxLeft = logoOffset.left + 68;
	var copyMargin = ((bWidth - 980) / 2) + 68;
	var center = (bWidth / 2) - 100;
	
	$('.splash-image').css('left',leftOffset+'px');
	$('#page-splash-copy-space').css('left',pxLeft+'px');
	$('#play, #pause').css('left',(center+60)+'px').css('top','149px').css('height','80px').css('width','80px');
}

function oLine() {
	var sNavOnOffset = $('.snav-on').offset();
	var sNavOnWidth = $('.snav-on').width();
	var oLineWidth = sNavOnOffset.left + sNavOnWidth;
	$('#page-splash-nav-under-oline').animate({ width: oLineWidth+'px' }, 500);
}

function placeArrows() {
	var logoOffset = $('#logo').offset();
	var pxLeft = logoOffset.left;
	var pxRight = pxLeft + 980 - 39;
	var pxTop = 160 - 16;
	
	$('#snav-prev').css('top', pxTop+'px').css('left',pxLeft+'px');
	$('#snav-next').css('top', pxTop+'px').css('left',pxRight+'px');
}

function copySpace( n ) {
	var nextText = $('#splash-text-'+n).html();
	$('#page-splash-copy-space-inner').fadeOut(250, function() { $(this).html(nextText).fadeIn(250); });	
}

function resetIcon( icon ) {
	icon.hide();
	icon.animate({ opacity: 100, left: '+=50', top: '+=50', width: '80', height: '80' }, 0);
}
