$(document).ready(function() {
//setup the entire page on load
    setupSlideshow();
});

function setupSlideshow() {

    //bind image showcase upon selection
    $('.thumbnail img').click(function() {
        if ($(this).hasClass('current')) {
            //do nothing
        }
        else {
            $('.current').removeClass();
            $(this).addClass('current');
            //get current rel value
            var thisRel = $(this).attr('rel');
            var thisTitle = $(this).attr('title');
            //build selector
            var myImage = '<img src="' + thisRel + '" />';
            var myTitle = '<h3>' + thisTitle + '</h3>';
            $("#showcase").html(myImage);
            $("#showcase img").fadeIn(1400);
            $("#caption").html(myTitle);
            $("#caption h3").fadeIn(1400);
        }
    });
    $('.thumbnail').click(function() {
        if ($(this).hasClass('selected')) {
            //do nothing
        }
        else {
            $('.selected').removeClass().addClass('thumbnail');
            $(this).addClass('selected');
        }
    });
}