//
//slideshow created by w.ripley and b.jones, march 2010
//started with dept slideshow used on eldens site
//
//
var active = 3; //first slide highlighted
var lastActive = 2; //current slide after animation complete
var nn; //regular slide timeout
var mm; //if clicked slide timeout
var b  = 1; //delay mulitple for timeouts
var notFirst = false; //not the first time called
var clickable = true; //if animating or not
var dropSpeed = 500; //speed for thumb dropping
var borderSpeed = 200; //speed for border shading
var fadeSpeed = 600; //speed for main slide crossfade
var numTimes; //number of thumb drops needed
//
function slideShow(n){
	if(clickable){ //only do if animation stopped
		clickable = false;
		if(n > numSlides) active = 1;
		if(n>0){ //if thumb clicked, reset timeout
			active=n;
			clearInterval(nn);
			clearTimeout(mm);
			mm = setTimeout(function(){nn = setInterval('slideShow(0)',9000)},10000);
		}
		//
		if(active == lastActive){ 
			//
			//if click active slice, only animate the shooter in/out
			activeShoot = "#shoot" + active;
			if($(activeShoot).css("left") == "0px"){
				$(activeShoot).css("display","block");
				$(activeShoot).animate({left:"-278px"}, function(){clickable = true;});
			}else{
				$(activeShoot).animate({left:"0px"}, function(){$(activeShoot).hide();clickable = true;});
			}
		}else{
			//
			//crossfade main slides, show thumbs if not visible
			$(".deptSlide").not($("#slide" + active)).fadeOut(fadeSpeed);
			$("#slide" + active).fadeIn(fadeSpeed);
			$("#deptNav:hidden").fadeIn(fadeSpeed);
			//
			//set variables of actives to use in timeouts
			activeShoot = "#shoot" + active;
			activeThumb = "#thumb" + active;
			//
			//animate prev active shooter to 0 and hide, when finished animate borders back to white, label color to brown
			//then animate border to red on the active thumb, label color to white, set timeout to make sure border color is set
			$(".shooters","#thumb"+lastActive).not($("#shoot" + active)).animate({left:"0px"},dropSpeed, function(){$(".shooters").not(activeShoot).hide();$("#thumbContainer .deptName").stop().animate({backgroundPosition:"(0px 0px)"}, {duration:borderSpeed});$("#thumbContainer img").stop().animate({backgroundPosition:"(0px 0px)"}, {duration:borderSpeed});$("#thumbContainer .deptName").css('color', '#330000');$(activeThumb + " img").stop().animate({backgroundPosition:"(0px -112px)"}, {duration:borderSpeed});$(activeThumb + " .deptName").stop().animate({backgroundPosition:"(0px -20px)"}, {duration:borderSpeed * .25});$(activeThumb + " .deptName").css('color', '#FFFFFF');setTimeout(function(){$(activeThumb + " img").css('background','url(/images/thumbFrame.png) 0px -112px');$(activeThumb + " .deptName").css('background','url(/images/thumbBox.png) 0px -20px')},borderSpeed);});
			//
			//if not the first time, figure number of thumbs that need to drop, then loop through
			if(notFirst){
				numTimes = 4 - parseInt($("#thumb"+active).attr("thumbPos"));
				b = 1;
				for(a=1;a<=numTimes;a++){
					//
					//get the id of the bottom thumb, get it's html, then prepend to the thumb container
					//slide the bottom thumb up and the top thumb down, then remove the bottom thumb
					 setTimeout(function(){bottom = $(".thumbs:nth-child(4)").attr("ID");lastHtml = $("#"+bottom).html();$("#thumbContainer").prepend('<div class="thumbs" id="'+bottom+'" style="display:none;" onclick="slideShow('+bottom.replace("thumb","")+')">'+lastHtml+'</div>');$("#"+bottom+":nth-child(2)").slideUp({duration:dropSpeed,complete:function(){$(".thumbs:nth-child("+numSlides+1+")").remove();}});$("#"+bottom).slideDown(dropSpeed);},(a*dropSpeed)+borderSpeed);
					 b=a; //set how many timeouts created + 1
				}
				b++;
			} //end if not first time
			//
			//set timeout to activate after all thumbs have moved, then set postions as attributes
			setTimeout(function(){$(".thumbs:nth-child(4)").attr("thumbPos",1);$(".thumbs:nth-child(3)").attr("thumbPos",4);$(".thumbs:nth-child(2)").attr("thumbPos",3);$(".thumbs:nth-child(1)").attr("thumbPos",2);},(b*dropSpeed)+borderSpeed);
			//
			//set timeout to activate after all thumbs have moved, then show the active shooter, and animate out
			setTimeout(function(){$(activeShoot).css('display', "block");$(activeShoot).animate({left:"-278px"}, function(){clickable = true;})}, (b*dropSpeed)+borderSpeed);
			//
			//if ie6, set a new bottom for the thumb label box
			if ($.browser.msie && $.browser.version.substr(0,1)<=7) {
				$("#thumbContainer .deptName").css("bottom","5px");
			}
			//
			notFirst = true; //set after first time through
			lastActive = active; //keep track of current active thumb
			active--; //set active to the next thumb in line, reset if below zero
			if(active < 1) active = numSlides;
			//
		} //end if clicked slide is active slide
	} // end if animation stopped
} //end slideshow function