//Script for NAU Slideshow Banner

//globalize variables
var time = 10000; //length of time for the slideshow
var bannerNum; //total number of banners
var t; //the var for the timeoue
var i = 1; //the counter for the slideshow loop
var translock = false; //prevents changeBanner functions from overlapping
var slidelock = false; //prevents slider functions from overlapping

$(document).ready(function() {
	//Set var bannerNum to the number of images loaded on the page
	bannerNum = $("div#bannerVisualInner img").length;
	
	//create the banner nav thumbnails
	navThumbs();
	//hover states for the banner nav thumbnails
	$('nav#bannerNav a').hover(
		function () {
	    	$(this).not('.banner' + i).css({'opacity' : '0.6', 'filter' : 'alpha(opacity=60)'});
	  	},
	  	function () {
	    	$(this).css({'opacity' : '1', 'filter' : 'alpha(opacity=100)'});
	  	}
	);
});

//function to populate thumbnails based on banner images loaded
function navThumbs() {
	//set var for looping the same as 'i'
	k = 1;
	//loop through and populate the thumbnails with correct classes and onclick events
	while (k <= bannerNum) {
		$('nav#bannerNav').append('<a class="bannerThumb banner' + k + '" onClick="changeBanner(' + k + ');"></a>');
		k++;
	}
}

function trigger() {
	//fade the background to black
	$("img#loading").fadeOut(300, function(){ 
		$("div#bannerVisual").animate({ backgroundColor: "black" }, 400, function() {
			//fade in the first image that has been loaded
			$('div#bannerVisual img.banner1').fadeIn(400, function(){ 
				//then fade in the hgroup
				$('section#content header hgroup.banner1').delay(200).fadeIn(400);
				//next load the rest of the photos (before presenting navigation options)
				postLoad();
			});
		});
	});
}

function postLoad() {
	//counter for preloading
	var q = 1;
	//counter for array
	var v = 1;
	//create object
	imageObj = new Image();
	//set image list
	images = new Array();
	while (v <= (bannerNum - 1)) {
		//set the source of the images in the array, excluding the first
		images[v]=$('div#bannerVisualInner img.banner' + (v + 1)).attr("src");
		//continue the loop
		v++;	
	}
	//queue the show starter
	imageObj.onLoad=queueTime();
	//start preloading
	for (q=1; q<=(bannerNum - 1); q++) {
		imageObj.src=images[q];
	}
}

function queueTime() {
	//once the rest of the photos
	t=setTimeout("slideshow()", time);
}

function slideshow() {
	//if this isn't the last banner
	if (i < bannerNum) {
		//fade out
		translock = true;
		$('section#content header hgroup.banner' + i).fadeOut(400);
		$('nav#bannerNav').fadeOut(400);
		$('div#bannerVisualInner img.banner' + i).fadeOut(400, function() {
			//change the 'active' banner thumbnail
			$('nav#bannerNav a').css('background', '#639081');
			$('nav#bannerNav a.banner' + (i + 1)).animate({ backgroundColor: "#ffffff" }, 0, function() { 
			//fade in the image
				$('div#bannerVisualInner img.banner' + (i + 1)).fadeIn(400, function(){ 
					//fade in everything else
					$('nav#bannerNav').delay(200).fadeIn(400);
					$('section#content header hgroup.banner' + (i + 1)).delay(200).fadeIn(400, function() {
						//continue the loop
						i++;
						translock = false;
						t=setTimeout("slideshow()", time);
					});
				
				});
				
			});
		});
	}
	//if this is the last banner
	else {
	//fade out
		translock = true;
		$('section#content header hgroup.banner' + i).fadeOut(400);
		$('nav#bannerNav').fadeOut(400);
		$('div#bannerVisualInner img.banner' + i).fadeOut(400, function() {
			//change the 'active' banner thumbnail
			$('nav#bannerNav a').css('background', '#639081');
			$('nav#bannerNav a.banner1').animate({ backgroundColor: "#ffffff" }, 0, function() { 
			//fade in the image
				$('div#bannerVisualInner img.banner1').fadeIn(400, function(){ 
					//fade in everything else
					$('nav#bannerNav').fadeIn(400);
					$('section#content header hgroup.banner1').fadeIn(400, function() {
						//reset the loop
						i = 1;
						translock = false;
						t=setTimeout("slideshow()", time);
					});
				});
			});
		});
	}
}

//function to go to next banner
function changeBanner(next) {
	if (translock == false) {	
		if (next != i) {
			translock = true;	
			//stop the current slideshow timeout
			clearTimeout(t);
			//fade out the current header before we change the 'i' variable
			$('section#content header hgroup.banner' + i).fadeOut(400);
			$('nav#bannerNav').fadeOut(400);
			$('div#bannerVisualInner img.banner' + i).fadeOut(400, function() {
			//reset the 'i' variable
				if (next > 1) {
					i = (next - 1);
				}
				else {
					i = bannerNum;
				}
				
				//run the slideshow functionality, only with simultaneous fade-ins
				if (i < bannerNum) {
					//change the 'active' banner thumbnail
					$('nav#bannerNav a').css('background', '#639081');
					$('nav#bannerNav a.banner' + (i + 1)).animate({ backgroundColor: "#ffffff" }, 0, function() { 
						//fade in everything at the same time
						$('div#bannerVisualInner img.banner' + (i + 1)).fadeIn(400); 
						$('nav#bannerNav').fadeIn(400);
						$('section#content header hgroup.banner' + (i + 1)).fadeIn(400, function() {
							//continue the loop
							i++;
							translock = false;
							t=setTimeout("slideshow()", time);
						});
					});
				}
				//if this is the last banner
				else {
					//change the 'active' banner thumbnail
					$('nav#bannerNav a').css('background', '#639081');
					$('nav#bannerNav a.banner1').animate({ backgroundColor: "#ffffff" }, 0, function() { 
					//fade in everything at the same time
						$('div#bannerVisualInner img.banner1').fadeIn(400); 
						$('nav#bannerNav').fadeIn(400);
						$('section#content header hgroup.banner1').fadeIn(400, function() {
							//reset the loop
							i = 1;
							translock = false;
							t=setTimeout("slideshow()", time);
						});
					});
				}
			}); 
		}
	}	
}

// Functions for homepage Slider --------------------------------------------------------------------

function homeRight() {
	//check to see if a transition is already in progress
	if (slidelock == true)
	{
		//do nothing
		return;
	}
	else {
		//turn on the lock
		slidelock = true;
		//change the slides
		$('div#slider ul').animate({'left' : -246},{queue:false, duration: 500, complete: function(){
			$('div#slider ul li:last-child').after($('div#slider ul li:first-child')); 	
			$('div#slider ul').css({'left' : '0px'});
			slidelock = false;
		}
		});
	}
}

function homeLeft() {
	//check to see if a transition is already in progress
	if (slidelock == true)
	{
		//do nothing
		return;
	}
	else {
		//turn on the lock
		slidelock = true;
		$('div#slider ul li:first-child').before($('div#slider ul li:last-child')); 	
		$('div#slider ul').animate({'left' : '-246px'}, {queue:false, duration: 0, complete: function(){
			$('div#slider ul').animate({'left' : 0},{queue:false, duration: 500, complete: function(){
				slidelock = false;
			}
			});
		}
		});
	}
}