﻿var slideshowID = 0;
var firstIteration = true;
function funStartSlideShow() {
    slideshowID = setInterval("slideSwitch()", 5000);
    if ($('#divSlideIcon').length) {
        $("#divSlideIcon").removeAttr('onclick');
        $('#divSlideIcon').unbind('click').bind('click', function() { funStopSlideShow(); });
        $('#divSlideIcon').toggleClass('slideIconPlay', false);
        $('#divSlideIcon').toggleClass('slideIconPause', true);
    }
}

function funStopSlideShow() {
    clearInterval(slideshowID);
    slideshowID = 0;
    $("#divSlideIcon").removeAttr('onclick');
    $("#divSlideIcon").unbind('click').bind('click', function() { funStartSlideShow(); });
    $('#divSlideIcon').toggleClass('slideIconPlay', true);
    $('#divSlideIcon').toggleClass('slideIconPause', false); 
}

function RestartSlideShow() {
    funStopSlideShow();
    funStartSlideShow();
}

function slideSwitch() {
    
    // If the page contains only one image exit the function
    if ($('.slideshowNavButton').length == 0)
        return;
    if (firstIteration == true) {
        firstIteration = false;
        //return;
    }
    
    var $active = $('#slideshow IMG.active');
    if ($active.length == 0) $active = $('#slideshow IMG:first');
    var $next = $active.next().length ? $active.next()
        : $('#slideshow IMG:first');
    $active.addClass('last-active');

    $next.css({ opacity: 0.0 })
        .addClass('active')        
        .animate({ opacity: 1.0 }, 2000, function() {
            $active.removeClass('active last-active');        
        });

    $('.slideshowNavButton').eq($active.index()).attr("src", "Images/sml_box_empty.gif");
    $('.slideshowNavButton').eq($next.index()).attr("src", "Images/sml_box_full.gif");    
 }

 function funSetSlideShowImage(imageIndex) {

    var $active = $('#slideshow IMG.active');
    if ($active.length == 0) $active = $('#slideshow IMG.active:first');
    
    var $next = $('#slideshow IMG:eq(' + imageIndex + ')');
      
    $active.addClass('last-active');

    $next.css({ opacity: 0.0 })
        .addClass('active')
        .animate({ opacity: 1.0 }, 2000, function() {
            $active.removeClass('active last-active');
        });

    $('.slideshowNavButton').attr("src", "Images/sml_box_empty.gif");
    $('.slideshowNavButton').eq(imageIndex).attr("src", "Images/sml_box_full.gif");
    RestartSlideShow();
}

function funChangeSlideShowImage(strType) {        
    var $active = $('#slideshow IMG.active');

    if (strType == "Next") {
        var $next = $active.next();
        if ($next.length == 0)
            return;        
        if ($next.next().length == 0) {            
            $('#hlSlideshowNext').toggleClass('arrowRight_black', false);
            $('#hlSlideshowNext').toggleClass('arrowRight_grey', true);
        }        
        $('#hlSlideshowPrev').toggleClass('arrowLeft_grey', false);
        $('#hlSlideshowPrev').toggleClass('arrowLeft_black', true);
                
        $active.addClass('last-active');
        $next.css({ opacity: 0.0 })
        .addClass('active')
        .animate({ opacity: 1.0 }, 2000, function() {
            $active.removeClass('active last-active');
        });
        
    } else if (strType == "Prev") {
        var $prev = $active.prev();
        if ($prev.length == 0)
            return;          
        if ($prev.prev().length == 0) {
            $('#hlSlideshowPrev').toggleClass('arrowLeft_black', false);
            $('#hlSlideshowPrev').toggleClass('arrowLeft_grey', true);            
        }
        $('#hlSlideshowNext').toggleClass('arrowLeft_grey', false);
        $('#hlSlideshowNext').toggleClass('arrowRight_black', true);        
        
        $active.addClass('last-active');
        $prev.css({ opacity: 0.0 })
        .addClass('active')
        .animate({ opacity: 1.0 }, 2000, function() {
            $active.removeClass('active last-active');
        });
    }
}



