$(document).ready(function(){
////////////////////////////////////
// Options
	
	// The last characters of the thumbnail, before, and after image filenames
	var thumb_ext = "thmb.jpg";	
	var before_ext = "b4.jpg";
	var after_ext = "aftr.jpg";
	
	var default_slide = 1;			// The default image to display.
									// If 0, page will open without a slide showing.
									
	var resize_from_slide = true;	// Resizes the gallery_container (hence, the page) based
									// off the height of the incoming slide.
									
	var fade_speed = 300;			// Speed for all fade effects
	
////////////////////////////////////
// Internal
	var slides = $('#slides');
	var thumbs = $('#thumb_list li a img');
	
	var n = 0;
	var selected_slide = "";
	
	
////////////////////////////////////
// Init
// Loop over thumbs in .thumb_list, assign each an index,
// and create a corresponding full sized slide.
//
	$(thumbs).each(function() {
		// Save the thumbnail's index in 'rel'.
		n=n+1;
		$(this).attr('rel',n);
		
		
		// Create the full sized rollover, attach it as a list item of #slides.
		$(slides).append('<li><img src="'
						 + $(this).attr('src').split(thumb_ext).join(after_ext)		// Figure out the after file name.
						 +'" class="full_sized_rollover"><p class="caption">'
						 + $(this).attr('alt')										// The caption, stored in alt.
						 +'</p></li>');
		
		if (default_slide == n) {
			// If this is the default selected slide, load the slide by sending a
			// event to the thumbnail after the contained image has finished loading.
			// (fix for funky size issues)				
			$(slides).children().eq(-1).children('img').load(function() {
				$(thumbs).eq(default_slide-1).click();
			});
		}
	});
	
	
////////////////////////////////////
// Rollover
// Handles mouse in and out events, swapping the img src.
//
	$(".full_sized_rollover").hover(function() {
		// Mouse over, set to before image.
		$(this).attr('src', $(this).attr('src').split(after_ext).join(before_ext));
	}, function() {
		// Mouse out, return to after.
		$(this).attr('src', $(this).attr('src').split(before_ext).join(after_ext));
	});
	
	
////////////////////////////////////
// Thumbnail click
// Fade out previous slide, fade in the slide related to click thumb.
// Resize gallery_container frame if resize_from_slide is enabled.
//
	$(thumbs).click(function() {
		if ($(this).parent().parent().hasClass('active')) {
			// If this thumbnail is currently selected, do nothing.
			return false;
		}
		else {
			// Fade the previous slide (index stored in selected_slide).
			 $(slides).children(':eq('+(selected_slide-1)+')').fadeOut(fade_speed);
			$(thumbs).parent().parent().siblings().removeClass('active');
			
			// Get the slide number from the clicked thumb's 'rel' and mark it active. Save the slide number in selected_slide.
			selected_slide = $(this).attr('rel');
			$(this).parent().parent().addClass('active');
			
			if (resize_from_slide) {
				// Changes the height of gallery_container based off the size of the incoming slide.				
				$("#gallery_container").css('height', ($(slides).children(':eq('+(selected_slide-1)+')').height()+3)+'px');
			}
			
			// Fade the new slide in.
			 $(slides).children(':eq('+(selected_slide-1)+')').fadeIn(fade_speed);
		} return false;
	});
});