// JavaScript Document
$(document).ready(function(){

	// Generate Navigation links
	$('.marqueePanels .marqueePanel').each(function(index){
		$('.marqueeNav').append('<a class="marqueeNavItem" ></a>');
	});
	
	$(document).ready(function(){
$("#navmenu-h li,#navmenu-v li").hover(
function() { $(this).addClass("iehover"); },
function() { $(this).removeClass("iehover"); }
);});
	// Generate Photo Lineup
	$('img.marqueePanelPhoto').each(function(index){
		var photoWidth = $('.marqueeContainer').width();
		var photoPosition = index * photoWidth;
		$('.marqueePhotos').append('<img class="marqueePhoto" style="left: '+photoPosition+'" src="'+$(this).attr('src')+'" alt="'+$(this).attr('alt')+'" width="354" height="265" />');
		$('.marqueePhotos').css('width', photoPosition+photoWidth);
	});

	// Set up Navigation Links
	$('.marqueeNav a.marqueeNavItem').click(function(){
		
		// Set the navigation state
		$('.marqueeNav a.marqueeNavItem').removeClass('selected');
		$(this).addClass('selected');
		
		var navClicked = $(this).index();
		var marqueeWidth = $('.marqueeContainer').width();
		var distanceToMove = marqueeWidth*(-1);
		var newPhotoPosition = navClicked*distanceToMove + 'px';
		var newCaption = $('.marqueePanelCaption').get(navClicked);
		
		// Animate the photos and caption
		$('.marqueePhotos').animate({left: newPhotoPosition}, 1000);
		$('.marqueeCaption').animate({top: '340px'}, 500, function(){
			var newHTML = $(newCaption).html();
			$('.marqueeCaptionContent').html(newHTML);
			setCaption();
		});
	});
	
	// Preload all images, then initialize marquee
	$('.marqueePanels img').imgpreload(function(){
		initializeMarquee();
	});

});

function initializeMarquee(){
	$('.marqueeCaptionContent').html(
		$('.marqueePanels .marqueePanel:first .marqueePanelCaption').html()
	);
	$('.marqueeNav a.marqueeNavItem:first').addClass('selected');
	$('.marqueePhotos').fadeIn(1500);
	setCaption();
}

function setCaption(){
	var captionHeight = $('.marqueeCaption').height();
	var marqueeHeight = $('.marqueeContainer').height();
	var newCaptionTop = marqueeHeight - captionHeight - 15;
	$('.marqueeCaption').delay(100).animate({top: newCaptionTop}, 500);
}