﻿(function ($) {
    $.fn.slide = function (options) {
        var opts = $.extend({}, $.fn.slide.defaults, options);
        return this.each(function () {
            var o = $.meta ? $.extend({}, opts, $this.data()) : opts;

            var images = mainimagelist;

            if (images.length <= 1)
                return;

            var $container = $(this);
            var $controls;
            var playTimer;
            var currentIndex = 0;
            var replacing = false;

            createControls();
            showPlayControls();

            if (o.autoplay) {
                //Start the show.
                slide();
                showPauseControls();
            }

            //EVENTS

            //Pause
            $controls.find('.pause').click(function () {
                //Stop slide timer. Slideshow stopped.
                clearTimeout(playTimer);
                showPlayControls();
            });
            //Play
            $controls.find('.play').click(function () {
                //Start slideshow.
                slide();
                showPauseControls();
            });
            
            //FUNCTIONS

            function slide() {
                //Replace image with an interval.
                playTimer = setTimeout(function () {
                    //incrementIndex();
                    replaceImage();
                    if (o.autoplay) {
                        slide();
                    }
                }, o.interval);
            }

            function incrementIndex() {
                if (currentIndex + 1 < images.length) {
                    currentIndex += 1;
                }
                else {
                    //Reset index if all images has been shown.
                    currentIndex = 0;
                }
            }
            function decrementIndex() {
                if (currentIndex > 0) {
                    currentIndex -= 1;
                }
                else {
                    //Reset index if all images has been shown.
                    currentIndex = images.length - 1;
                }
            }

            function replaceImage() {
                var index = currentIndex;
                incrementIndex();
                var nextIndex = currentIndex;
                $container.find("#" + images[nextIndex]).fadeIn(1000, function () {
                    $container.find("#" + images[index]).fadeOut(500);
                });
            }
            function showPlayControls() {
                $controls.find('.play, .next, .prev, span').show();
                $controls.find('.pause').hide();
            }
            function showPauseControls() {
                $controls.find('.play, .next, .prev, span').hide();
                $controls.find('.pause').show();
            }
            function createControls() {
                //Add controls to slideshow
                $controls = $('<div class="controls"></div>')
                if (!o.disablePlay) {
                    $controls.append('<img src="/images/pause.png" alt="Pause" class="pause" />');
                    $controls.append('<img src="/images/play.png" alt="Play" class="play" />');
                }
                $container.append($controls);
            }
        });
    }
    $.fn.slide.defaults = {
        autoplay: true,
        interval: 15000,
        disablePlay: false
    };
})(jQuery);
