$(document).ready(function() {

    var timer = setInterval('gallery()', 5000);

    //Set the opacity of all images to 0
    $('ul.MainImageAnimation li').css({ opacity: 0.0 });
    $('ul.slideshow li').css({ opacity: 0.0 });
    $('ul.HomePageMenu li').removeClass('show');

    //Get the first image and display it (set it to full opacity)
    $('ul.MainImageAnimation li:first').css({ opacity: 1.0 });
    $('ul.slideshow li:first').css({ opacity: 1.0 });
    $('ul.HomePageMenu li:first').addClass('show');

    // to resolve chrome bug

    if ($.browser.msie != true) {

        $(window).focus(function() {
            clearInterval(timer);
            timer = setInterval('gallery()', 5000);
        });

        $(window).blur(function() {
            clearInterval(timer);
        });

    }

});


function gallery() {

    //if no IMGs have the show class, grab the first image
    var current = ($('ul.slideshow li.show') ? $('ul.slideshow li.show') : $('#ul.slideshow li:first'));
    var currentMenuOption = ($('ul.HomePageMenu li.show') ? $('ul.HomePageMenu li.show') : $('#ul.HomePageMenu li:first'));
    var currentImage = ($('ul.MainImageAnimation li.show') ? $('ul.MainImageAnimation li.show') : $('#ul.MainImageAnimation li:first'));

    //Get next image, if it reached the end of the slideshow, rotate it back to the first image
    var next = ((current.next().length) ? ((current.next().attr('id') == 'slideshow-caption') ? $('ul.slideshow li:first') : current.next()) : $('ul.slideshow li:first'));
    var nextMenuOption = ((currentMenuOption.next().length) ? (currentMenuOption.next()) : $('ul.HomePageMenu li:first'));
    var nextImage = ((currentImage.next().length) ? (currentImage.next()) : $('ul.MainImageAnimation li:first'));

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


    //Hide the current image
    current.animate({ opacity: 0.0 }, 500).removeClass('show');
    currentMenuOption.removeClass('show');
    currentImage.animate({ opacity: 0.0 }, 1500).removeClass('show');

}