// JavaScript Document
$(document).ready(function(){
	initTopBanners();
	$('.staticNum').click(changeSlide);
});

var topBannerInterval;
function initTopBanners(){
	//go and load the rest in
	var preloadList = [ '2.jpg', '3.jpg', '4.jpg', '5.jpg', '6.jpg', '7.jpg' ]; //set up in the homepage handler
	
	loadImages(preloadList);
	
	topBannerInterval = setInterval( "rotateTopBanners()", 5000 );
}

var preloadNum = 0;
function loadImages(preloadList){
	var img = new Image();
	$('<img />')
		.attr('src', '/graphics/gallery/' + preloadList[preloadNum])
		.load(function(){
			$('#slideShowContainer .gallery').append($(this));
			preloadNum++;
			if(preloadNum < preloadList.length)
				loadImages(preloadList);
		});
}

function rotateTopBanners(){
 	if($('#slideShowContainer .gallery img').length > 2){
		var $active = $('#slideShowContainer .gallery img.active');
		var $activeNum = $('a.num.fadeNum.active');
		
		if ( $active.length == 0 ) $active = $('#slideShowContainer .gallery img:first');
		
		if ( $activeNum.length == 0 ) $active = $('a.num.fadeNum:first');

	
		var $next =  $active.next().length ? $active.next()
			: $('#slideShowContainer .gallery img:first');
		
		var $nextNum =  $activeNum.next().length  ? $activeNum.next()
			: $('a.num.fadeNum:first');
	
				
	
		$active.addClass('last-active');
		
		$activeNum.addClass('last-active');
		
		$nextNum.addClass('active')
			.fadeIn(1000, function() {	
				$activeNum.removeClass('active last-active');									
			});
		$('.fadeNum.last-active').fadeOut(1000);
		
		var numbers = $('.fadeNum');
		$next.css({opacity: 0.0})
			.addClass('active')
			.animate({opacity: 1.0}, 1000, function() {
				$active.removeClass('active last-active');
				var index = $active.index() + 1;
				if(index > $('#slideShowContainer .gallery img').length -1){
					index = 0;	
				}
			});
	}
}


function changeSlide(){
	clearInterval(topBannerInterval);
	$('.fadeNum').removeClass('active').css('display','none');
	var index = $(this).index();
	$('.fadeNum').eq(index).addClass('active').css('display','block');
	$('#slideShowContainer .gallery img').removeClass('active');
	$('#slideShowContainer .gallery img').eq(''+$(this).index()+'').addClass('active');
}

