jQuery(document).ready(function(){
	
	// For testing purposes, populate the gallery with multiple images
	// $li = $('#gallery_nav li').clone();
	// $('#gallery_nav ul').append($($li).clone());
	// $('#gallery_nav ul').append($($li).clone());
	
	/*
	$('#gallery_nav li a').each(function(){
	  // preload all images
		$img = new Image();
		$img.src = $(this).href;
	});
	*/
	
	// add a click function to every li in the gallery nav ul
	$('#gallery_nav li a').click(function(){
			
			$href = $(this).attr('href');
			
			$temp_pic = new Image();
			$($temp_pic).attr('id', 'temp_image');
			$($temp_pic).attr('src', $href);
			

			// Clone existing container			
			$temp_container = $('#target_container').clone();
			$($temp_container).attr('id', 'temp_container');

			// Do not display the cloned container
			$($temp_container).attr('style', 'display:none;position:absolute;width:680px;top:100;left:0;');			

			// Remove old content from the cloned container
			$($temp_container).empty();
			
			// Append the actual image to the container
			$($temp_container).append($temp_pic);
			
			// Fade out existing container
			$('#target_container').fadeOut('slow', function(){

  			// After the animation completes, remove the tag and image
				$('#target_container').remove();
				$('#target_image').remove();
				
				// Set up the cloned container and image to match the working ids
				// (for the next click)
				$('#temp_container').attr('id', 'target_container');
				$('#temp_image').attr('id', 'target_image');
				
				
				
			});
			
			// Append the cloned container to the gallery
			$('#gallery_target').append($temp_container);
			
			
			
			
			
			
			// Update the info and title fields
			$('#target_title').html($(this).attr('title'));
			$('#target_info').html($(this).find('.info').html());
			
			// Fade in the new container
			$('#temp_container').fadeIn('slow');
			
			
												
			return false;
	});
	
	// add a toggle effect to all image links
	$('#gallery_nav li a').addClass('toggleopac');
	
	
	
	 
	
	
});