var bAnimating = false;
var slideshowWidth;
var timer = null;

function animateSlide(slideDir) {
    if (timer != null)
        clearTimeout(timer);
    bAnimating = true;
    if (slideDir == 'left') {
        iDirMod = 1;
    } else {
        iDirMod = -1;
    }
    // Get the currently displayed slide
    curSlide = $('.slideshow .active');
    // animate this slide and bring in the next one
    $(curSlide).animate({
        'left': (slideshowWidth * iDirMod) + 'px',
        'opacity': '0'
    }, 700, 'swing', function () {
        $(this).toggleClass('active');
        //console.info($(this).html() + "; " + $(this).attr("style"));
        $(this).attr("style", "");
    });
    //determine whether the next or previous slide will be selected to animate
    if (slideDir == 'left') {
        nextSlide = $(curSlide).next();
        if (nextSlide.length == 0) {
            nextSlide = $('.slideshow .slide').eq(0);
        }
    } else {
        nextSlide = $(curSlide).prev();
        if (nextSlide.length == 0) {
            nextSlide = $('.slideshow .slide:last').eq(0);
        }
    }
    //animate in the next slide to display
    $(nextSlide).css('left', slideshowWidth * -iDirMod).toggleClass('active');
    //animate in the next slide to display
    $(nextSlide).animate({
        'left': '0px',
        'opacity': '1'
    }, 700, 'swing', function () {
        bAnimating = false;
        //console.info($(this).html() + "; " + $(this).attr("style"));
        $(this).attr("style", "");

    });
    autoRotate();
}

function autoRotate() {
    timer = setInterval(function () { animateSlide('right'); }, 4000);
    // console.info("set timer");
}

$(function () {
    slideshowWidth = $('.slideshow').width();
    $(".btnPrev").click(function () {
        if (!bAnimating) {
            animateSlide('left');
        }
    });
    $(".btnNext").click(function () {
        if (!bAnimating) {
            animateSlide();
        }
    });

    autoRotate();
    $(".slideshow .slide .content").mouseenter(function () {
        if (timer != null)
            clearTimeout(timer);
    }).mouseleave(function () {
        autoRotate();
    });

});