/*
RSG Home Splash Slide Show
ReCreated By: Mitch Gohman
Date: 2010-03-10
With much love to JQuery - the javaScript browser equalizer
My first attempt used positioning and loaded all images at once.
	IE had issues with overflow:hidden and the front load of all BIG images was a tremnendous strain on the
	initial loading of the page.
	
	My new goal is to load images as needed
	Use positioning, but use less vertical real estate
	I also want to use CSS to control the appearance more - so assigning classes as opposed to JS CSS Styles
	
*/
var upperImage;
var lowerImage;
var slideHeight = 407;
var direction = 'up';
var imagePersistance = 6000;
var fadeSpeed = 2000;
var currTimer;

function setUpNextSlide() {
	if (direction == 'up')
		{
		$("#splashSlides .slides li.imgAbove").css("display","none");
		$("#splashSlides .slides li.imgAbove").attr("class","hiddenImages");
		$("#splashSlides .slides li.theOne").attr("class","imgAbove");
		$("#splashSlides .slides li.imgBelow").attr("class","theOne");
		
		var theSlides = $("#splashSlides .slides li");
		
		upperImage++;
		if (upperImage == theSlides.length)
			{
			upperImage = 0;
			}
		lowerImage++;
		if (lowerImage == theSlides.length)
			{
			lowerImage = 0;
			}
		$(theSlides[lowerImage]).attr("class","imgBelow");
		}
		else
		{
		$("#splashSlides .slides li.imgBelow").css("display","none");
		$("#splashSlides .slides li.imgBelow").attr("class","hiddenImages");
		$("#splashSlides .slides li.theOne").attr("class","imgBelow");
		$("#splashSlides .slides li.imgAbove").attr("class","theOne");
		
		var theSlides = $("#splashSlides .slides li");
		
		upperImage--;
		if (upperImage < 0)
			{
			upperImage = theSlides.length - 1;
			}
		lowerImage--;
		if (lowerImage < 0)
			{
			lowerImage = theSlides.length - 1;
			}
		$(theSlides[upperImage]).attr("class","imgAbove");	
		}
	
	$("#splashSlides .slides li.imgBelow").css({"top": slideHeight + "px","display":"block"});
	$("#splashSlides .slides li.imgAbove").css({"top":"-" + slideHeight + "px","display":"block"});
	$("#splashSlides .slides li.theOne").css({
			"top":"0px",
			"display":"block"
			});
}	


function slideUp() {
	clearTimeout(currTimer);
	direction = 'up';
	vertPos = "-" + slideHeight + "px";
	$("#splashSlides .slides li.imgBelow").animate({ "top": "0px"},fadeSpeed);
	$("#splashSlides .slides li.theOne").animate({ "top": vertPos },fadeSpeed,'swing',setUpNextSlide);
	currTimer = setTimeout("slideUp()",imagePersistance);
}
function slideDown() {
	clearTimeout(currTimer);
	direction = 'down';
	vertPos = slideHeight + "px";
	$("#splashSlides .slides li.imgAbove").animate({ "top": "0px"},fadeSpeed);
	$("#splashSlides .slides li.theOne").animate({ "top": vertPos },fadeSpeed,'swing',setUpNextSlide);
	currTimer = setTimeout("slideDown()",imagePersistance);
}

function setUpSplash() {
	//adminFeedback('made it here');
	
	/*Create Navigation on fly*/
	var oImage1 = new Image();
	oImage1.src = '_scripts/imagesSplashSlide/home_splsh_navTop.jpg';
	
	var oImage2 = new Image();
	oImage2.src = '_scripts/imagesSplashSlide/home_splsh_navBottom.jpg';
	
	$("#splashSlides .slides").before('<a href="#" id="prevSlide"><img src="_scripts/imagesSplashSlide/home_splsh_navTop.jpg" width="584" height="56" /></a>');
	$("#splashSlides .slides").after('<a href="#" id="nextSlide"><img src="_scripts/imagesSplashSlide/home_splsh_navBottom.jpg" width="584" height="56" /></a>');
	
	$("#prevSlide").bind("click",slideDown);
	$("#prevSlide").bind("click",function (evt) { evt.preventDefault(); } );
	$("#nextSlide").bind("click",slideUp);
	$("#nextSlide").bind("click",function (evt) { evt.preventDefault(); } );
	
	$("#splashSlides .slides").css({
			"position":"relative",
			"width":"584px",
			"height":"407px",
			"overflow":"hidden",
			"zoom":"1"
		});
	
	$("#splashSlides .slides li").attr("class","hiddenImages");
	
	var theSlides = $("#splashSlides .slides li");
	
	
	$(theSlides[0]).attr("class","theOne");
	$(theSlides[1]).attr("class","imgBelow");
	
	var lastSlide = theSlides.length - 1;
	$(theSlides[lastSlide]).attr("class","imgAbove");
	
	upperImage = lastSlide;
	lowerImage = 1;
	
	setTimeout("slideUp()",imagePersistance);
}

function adminFeedback(string) {
	var feedBefore = $("#slideFeed").html();
	$("#slideFeed").html(feedBefore + '<br />' + string)
}

$("document").ready(setUpSplash);