ÿþ//Main functions for after page loads

$(document).ready(function() {

	$(".main_image .desc").show(); //Show Banner

	$(".main_image .block").animate({ opacity: 1 }, 1 ); //Set Opacity

	

	//Set first thumbnail to 'active'

	$(".image_thumb ul li:first").addClass('active'); 

	

	//Set thumbnail opacity

	$(".image_thumb ul li a").animate({ opacity: 0.25 }, 1 ); //Set Opacity

	$(".image_thumb ul li a:first").animate({ opacity: 1 }, 1 ); //Set Opacity

	

	//Load initial description

	var InitialFeaturedDesc = $(".image_thumb li:first .block").html();

	$(".main_image .desc .block ").html(InitialFeaturedDesc);

	var InitialFeaturedImg = $(".image_thumb li:first a").attr("name");

	$(".main_image img").attr({ src: InitialFeaturedImg})

	

	//Set speed & start timer for thumbnail rotation

	var speed = 5000;

	var rotation = setInterval('TimedSwitch()', speed);

	

		//Stop rotation when hovering over description

		$("div.desc").hover(function() { 

			//Stop the rotation

			clearInterval(rotation);

		}, //Close mouseover -- Start mouseout

			function() {

				rotation = setInterval('TimedSwitch()', speed);

			} //Close mouseout

		);

		//Stop rotation when hovering over description

		$(".image_thumb ul li").hover(function() { 

			//Stop the rotation

			clearInterval(rotation);

		}, //Close mouseover -- Start mouseout

			function() {

				rotation = setInterval('TimedSwitch()', speed);

			} //Close mouseout

		);

	

	//Fix description link opacity

	$(".image_thumb ul li div.block p a").animate({ opacity: 1 }, 1 );

	

	//Click events for thumbnail list

	$(".image_thumb ul li").click(function() { 

		if ($(this).is(".active")) {  //If it's already active, then...

			//Do nothing

		}

		else {

			//Change thumbnail styling

			$(".image_thumb ul li").removeClass('active'); //Remove class of 'active' on all thumbnails

			$(this).addClass('active');  //Add class of 'active' on this thumbnail only

			

			//Set thumbnail opacity

			$(".image_thumb ul li a").animate({ opacity: 0.25 }, 1 );

			$(".image_thumb ul li.active a").animate({ opacity: 1 }, 1 );

			

			//Fix description link opacity

			$(".image_thumb ul li div.block p a").animate({ opacity: 1 }, 1 );

			

			//Set variables

			var imgAlt = $(this).find('img').attr("alt");	//Get Alt Tag of Image

			var imgTitle = $(this).find('a').attr("name");	//Get Main Image URL

			var imgH2 = $(this).find('.block H2').html(); 	//Get HTML of the "block" H2 container

			var imgP = $(this).find('.block p').html(); 	//Get HTML of the "block" p container

			var imgDescHeight = $(".main_image").find('.block').height(); //Calculate height of "block"

			

			//Animate the image & description

			$(".main_image img").animate({ opacity: 0}, 500);

			

			$(".main_image p").animate({ opacity: 0 }, 500, function() {

				$(".main_image p").html(imgP).animate({ opacity: 1 }, 500);

			});

			

			$(".main_image h2").animate({ opacity: 0 }, 500, function() {

				$(".main_image h2").html(imgH2).animate({ opacity: 1 }, 500);

				$(".main_image img").attr({ src: imgTitle , alt: imgAlt}).animate({ opacity: 1}, 500);

			});

		}

		

		return false;

	});	

}); //Close main 'document ready' function





//Additional functions

function TimedSwitch() {

	//Define new 'active' thumbnail

	var $active = $('.image_thumb ul li.active').next();

	if ( $active.length == 0 ) $active = $('.image_thumb ul li:first'); //goes back to start when finishes

	

	//Define previous 'active' thumbnail

	var $prev = $('.image_thumb ul li.active');

	

	//Change thumbnail styling

	$prev.removeClass('active');

	$active.addClass('active');

	

	//Change thumbnail opacity

	$(".image_thumb ul li a").animate({ opacity: 0.25 }, 1 );

	$(".image_thumb ul li.active a").animate({ opacity: 1 }, 1 );

	

	//Fix description link opacity

	$(".image_thumb ul li div.block p a").animate({ opacity: 1 }, 1 );

	

	//Set variables

	var imgAlt = $active.find('img').attr("alt");	//Get Alt Tag of Image

	var imgTitle = $active.find('a').attr("name");	//Get Main Image URL

	var imgH2 = $active.find('.block h2').html();	//Get HTML of the "block H2" container

	var imgP = $active.find('.block p').html();		//Get HTML of the "block p" container

	var imgDescHeight = $(".main_image").find('.block').width(); //Calculate height of "block"

	

	if ($(this).is(".active")) { //If the list item is active/selected, then...

		return false; // Don't click through   Prevents repetitive animations on active/selected list-item

	}

	else { //If not active then...

		//Animate the image & description

		$(".main_image img").animate({ opacity: 0}, 500);

		

		$(".main_image p").animate({ opacity: 0 }, 500, function() {

			$(".main_image p").html(imgP).animate({ opacity: 1 }, 500);

		});

		

		$(".main_image h2").animate({ opacity: 0 }, 500, function() {

			$(".main_image h2").html(imgH2).animate({ opacity: 1 }, 500);

			$(".main_image img").attr({ src: imgTitle , alt: imgAlt}).animate({ opacity: 1}, 500);

		});

	}

	

	return false;

}