ssInterval = 6000;
ssFirstInterval = 5500;
ssFadeSpeed = 1000;
ssFadeCaption = 700;
ssCaptionOpacity = 1.0; // originally 0.7 but shows too much of underlying image if its got dark background
ssCyclic = false;
ssFirst = true;
ssButtonPanel = true;
var galleryTimer;

$(document).ready(function () {
    //Execute the slideShow
    slideShow('slideshow', true);
});

function slideShow(galleryName, showCaption) {

    if (showCaption) {
        //append a LI item to the UL list for displaying caption
        $('ul.'+galleryName).append('<li id="'+galleryName+'-caption" class="caption"><div class="'+galleryName+'-caption-container"><h3></h3><p></p></div></li>');
        $('ul.'+galleryName).append('<li id="'+galleryName+'-button" class="caption"><div class="'+galleryName+'-button-container"><h3></h3><p></p></div></li>');
    }

    //Set the opacity of all images to 0
    $('ul.' + galleryName + ' li').css({ opacity: 0.0 });

    //Hide the prev/next buttons
    $('#' + galleryName + '-button').css({ opacity: 0.0 });

    //Get the first image and display it (set it to full opacity)
    $('ul.' + galleryName + ' li:first').css({ opacity: 1.0 });

    if (showCaption) {
        //Get the caption and text for the first image from attributes and display them
        $('#' + galleryName + '-caption h3').html($('ul.' + galleryName + ' a:first').find('img').attr('title'));
        $('#' + galleryName + '-caption p').html($('ul.' + galleryName + ' a:first').find('img').attr('alt'));
        //$('#' + galleryName + '-button').html('<a href="#"><img src="images/button_none.gif" border="0"></a> <a href="#"><img src="images/button_right.gif" border="0"></a>');
        $('#' + galleryName + '-button').html(ssExtraInfo);

        //Display the caption
        $('#' + galleryName + '-caption').animate({ opacity: ssCaptionOpacity }, ssFadeCaption);
        if (ssButtonPanel) {
            $('#' + galleryName + '-button').animate({ opacity: ssCaptionOpacity }, ssFadeCaption);
        }
    }

    //Call the gallery function to run the slideshow	
    galleryTimer = setInterval(function () { gallery(galleryName, ssFadeSpeed); }, ssFirstInterval);

    //pause the slideshow on mouse over
    $('ul.' + galleryName).hover(
		function () {
		    clearInterval(galleryTimer);
		},
		function () {
		    galleryTimer = setInterval(function () { gallery(galleryName, ssFadeSpeed); }, ssInterval);
		}
	);

}

function gallery(galleryName, ssFadeSpeed) {

    if (ssFirst) {
        //re-establish timer with interval required between slides (may be different to first interval)
        ssFirst = false;
        clearInterval(galleryTimer);
	    galleryTimer = setInterval(function () { gallery(galleryName, ssFadeSpeed); }, ssInterval);
    }

    //if no IMGs have the show class, grab the first image
    var current = ($('ul.' + galleryName + ' li.show') ? $('ul.' + galleryName + ' li.show') : $('#ul.' + galleryName + ' li:first'));

    var last = current.attr('id') == 'last';

    //Get next image, if it reached the end of the slideshow, rotate it back to the first image
    if (ssCyclic || !last) {
        var next = ((current.next().length) ? ((current.next().attr('id') == '' + galleryName + '-caption') ? $('ul.' + galleryName + ' li:first') : current.next()) : $('ul.' + galleryName + ' li:first'));

        //Get next image caption
        var title = next.find('img').attr('title');
        var desc = next.find('img').attr('alt');

        //Set the fade in effect for the next image, show class has higher z-index
        next.css({ opacity: 0.0 }).addClass('show').animate({ opacity: 1.0 }, ssFadeSpeed);

        //Hide the buttons
        //$('#' + galleryName + '-button').css({ opacity: 0.0 });

        //Hide the caption first, and then set and display the caption
        //$('#' + galleryName + '-button').html('<a href="#"><img src="images/button_left.gif" border="0"></a> <a href="#"><img src="images/button_right.gif" border="0"></a>');
        $('#' + galleryName + '-button').animate({ opacity: 0.0 }, ssFadeCaption);
        $('#' + galleryName + '-caption').animate({ opacity: 0.0 }, ssFadeCaption, function () {
             $('#' + galleryName + '-caption h3').html(title);
            $('#' + galleryName + '-caption p').html(desc);
            $('#' + galleryName + '-caption').animate({ opacity: ssCaptionOpacity }, ssFadeCaption);
            $('#' + galleryName + '-button').animate({ opacity: ssCaptionOpacity }, ssFadeCaption);
        });

        //Show buttons if required
        if (ssButtonPanel) {
        }

        //Hide the current image
        current.animate({ opacity: 0.0 }, ssFadeSpeed).removeClass('show');
    }
}