$(document).ready(function () {

    ////////////////
    // Initialize //
    ////////////////
    var elements = $('li', $("#slideshow_footer")).each(function (index) { });
    var iterator = 1;
    var conf_delay = 5000;

    function slideShow() {
        if (iterator == elements.length) iterator = 0;
        switchSlide($(elements[iterator++]), true);
    }

    function switchSlide(liSelected, animate) {

        var selImg = $("#slideshow_img_container [rel='img" + liSelected.attr("rel") + "'] img");
        
        if (liSelected.attr("title") == "")
            $("#slideshow_header").hide();
        else
            $("#slideshow_header").show();

        
        $("#slideshow_img_container a.active").attr("class", "");
        selImg.parent().attr("class", "active");


        $('li', $("#slideshow_footer")).attr("class", "slideshow_btn");
        liSelected.attr("class", "slideshow_btn active");


        $("#slideshow_header_top").html(liSelected.attr("title"));
        $("#slideshow_header_bottom").html(liSelected.attr("alt"));
    }

    switchSlide($(elements[0]), $(elements[0]), false);

    var playSlideshow = setInterval(slideShow, conf_delay);


    ////////////////////////////////
    // Show slide by using button //
    ////////////////////////////////
    $(".slideshow_btn").mouseenter(function () {

        iterator = $(this).index() + 1;
        switchSlide($(this), false);

        $('li', $("#slideshow_footer")).attr("class", "slideshow_btn");
        $(this).attr("class", "slideshow_btn active");
    });

    ////////////////////
    // Pause on hover //
    ////////////////////
    $("#slideshow").hover(function () {
        clearInterval(playSlideshow);
    }, function () {
        playSlideshow = setInterval(slideShow, conf_delay);
    });
});