/// <reference path = "lib/jquery-1.4.1-vsdoc.js" />

/**************************************
@file - Moondog Slideshow functionality
@author - Christian Schlensker <TAG>
**************************************/

var slideShowTimer;
var slideShowRunning = false;

var buttons;
var slideShow;
var slides;
var currentSlide;

/**************************
//Document Ready Function
**************************/
$(function () {
    buttons = $('.specials-show .buttons');
    slideShow = $('.specials-show');
    slides = $('.specials-show .slides li');
    currentSlide = slides.first();

    //hide all but the first slide
    slides.hide();
    currentSlide.show();

    //hide buttons
    buttons.hide();

    //start slideshow loop
    runSlideShow();


    //hover event
    slideShow.hover(function () {
        $(buttons).slideToggle();
    });


    //previous button click function
    buttons.find('.prev').click(function () {
        clearTimeout(slideShowTimer);
        goToPreviousSlide();
        return false;
    });

    //next button click function
    buttons.find('.next').click(function () {
        transitionSlides();
        return false;
    });


    buttons.find('.play-pause').toggle(function () {
        stopSlideShow();
        return false;
    }, function () {
        transitionSlides();
        runSlideShow();
        return false;
    });
});


/**************************
/// Function that starts the slideshow.
**************************/
function runSlideShow() {
    slideShowTimer = setTimeout("transitionSlides()", 4000);
    slideShowRunning = true;

    //toggle play/pause button
    $(buttons).find('.play').removeClass('play').addClass('pause');
}


/**************************
/// Function that stops the slideshow
**************************/
function stopSlideShow() {
    clearTimeout(slideShowTimer);
    slideShowRunning = false;
    

    //toggle play/pause button
    $(buttons).find('.pause').removeClass('pause').addClass('play');
}


/**************************
///Transitions from one slide the another. if next index is not provided then currentIndex++ will be used
**************************/
function transitionSlides(nextSlide) {
    //clear any timeouts
    clearTimeout(slideShowTimer);

    //set next slide if it isn't provided
    if(nextSlide == null) {
        //if current slide is the last slide make the first slide next in order
        if (currentSlide.is(":last-child")) {
            nextSlide = slides.first();
        } else {
            nextSlide = currentSlide.next();
        }
    }
    

    //set the container height to the height of the next slide
    $(slideShow).animate({
        'height': $(nextSlide).height(),
        'width': $(nextSlide).width()
    });

    //take slides out of document flow
    currentSlide.css('position', 'absolute');
    nextSlide.css('position', 'absolute');

    //fadeOut current img then put it back into flow
    currentSlide.fadeOut(function () {
        $(this).css('position', 'static');
        nextSlide.css('position', 'absolute');
    });

    //fadeIn next img (simultaneous with previous step)
    nextSlide.fadeIn();

    //update current slide index
    currentSlide = nextSlide;

    //if slideshow is playing loop it.
    if (slideShowRunning == true) {
        //loop
        runSlideShow();
    }
}

/**************************
///Transition to the previous slide
**************************/
function goToPreviousSlide() {

    //if current slide is the first slide then go to the last slide. Else go to the previous slide.
    if (currentSlide.is(":first-child")) {
        transitionSlides(slides.last());
    } else {
        transitionSlides(currentSlide.prev());
    }
}