var slideShow = {
    slideNumber: '0',
    totalImages: '',
    duration: '4',
    on: false,
    next: function() {
        this._getSlide();
        this.slideNumber++;
    },
    previous: function() {
        this.slideNumber--;
        if (this.slideNumber == '0' || this.slideNumber == '-1') this.slideNumber = this.totalImages;
        this._getSlide();
    },
    pause: function() {
        this.on = false;
        var status = document.getElementById('status');
        var playButton = document.getElementById('play');
        status.innerHTML = "Slide show has been paused.  Click on PLAY to continue the slide show.";
        playButton.innerHTML = 'PLAY';
        playButton.onclick = function(){slideShow.play()};
    },
    play: function(slideNumber) {
        clearTimeout();
        var status = document.getElementById('status');
        if (slideNumber) {
            this.slideNumber = slideNumber;
            this._getSlide();
        }
        if(this.on == false) {
            this.on = true;
            this._autoPlay();
            status.innerHTML = "Slide show started.  Click on PAUSE to stop the slide show.";
            var playButton = document.getElementById('play');
            playButton.innerHTML = 'PAUSE';
            playButton.onclick = function(){slideShow.pause()};
        }
    },
    _autoPlay: function() {
        if (this.on == true) {
            this._getSlide();
            this.slideNumber++;
            setTimeout("slideShow._autoPlay()",this.duration*1000);
        }
    },
    _loadImages: function() {
        var slideArea = document.getElementById('slide');
        this.totalImages = images.length - 1;

        maxWidth = '400';
        dotWidth = maxWidth / this.totalImages;
        
        for (index in images) {
                //var slideName = images[index].split('.')[0];
                //var fileType = images[index].split('.')[1];

            //if (fileType == 'png' || fileType == 'jpg') {
                preloadimage[index] = new Image();
                preloadimage[index].src= images[index].largeImage;
               // preloadimage[index].alt = slideName;
            //}
        }
        //images.sort();
        for (i=0;i<=this.totalImages;i++) {
            if(typeof preloadimage[i] == 'object') {
                loaded = this._isLoaded( preloadimage[i] );
            }
        }
    },
    _loadedImages: '0',
    _isLoaded: function( image ) {
        var progressBar = document.getElementById('progressBar');
        var status = document.getElementById('status');
        this.totalImages = images.length;
        progressBar.style.display = 'block';
        maxWidth = '400';
        dotWidth = maxWidth / this.totalImages;
        
        if(image.complete) {
            this._loadedImages++;
            dot = document.createElement('div');
            dot.style.width = dotWidth + 'px';
            dot.style.height = '20px';
            dot.style.cssFloat = 'left';
            dot.style.styleFloat = 'left';
            dot.style.position = 'relative';
            dot.style.backgroundColor = 'red';
            progressBar.appendChild(dot);
        
            if (this._loadedImages == this.totalImages) {
                status.innerHTML = 'Images are Loaded.';
                progressBar.innerHTML = '';
                progressBar.style.backgroundColor = 'black';
                progressBar.style.border = 'none';
                progressBar.style.display = 'none';
                
                setTimeout(function() {slideShow.play()}, 1000);
            }
            return true;
        } else {
            setTimeout(function() {slideShow._isLoaded( image )}, 1000);
        }
    },
    _getSlide: function() {
        if(!images[this.slideNumber]) {
            this.slideNumber = '0';
        }
        
       // var sortNumber = images[this.slideNumber].split('.')[0];
       // var slideName = images[this.slideNumber].split('.')[1];
       // var fileType = images[this.slideNumber].split('.')[2];

        var slideArea = document.getElementById('slide');
        
        image = new Image(); 
        image.src=images[this.slideNumber].largeImage;
        //image.alt = slideName;
        image.setAttribute('id', 'currentImage');
        
        caption = document.createElement('div');
        if (images[this.slideNumber].caption.match(/jpg/)) {
            var captionText = "";
        } else {
            var captionText = images[this.slideNumber].caption;
        }
        caption.innerHTML = '<h4> ' + captionText + ' </h4> ';
        caption.style.color = 'white';
        caption.setAttribute('id', 'currentCaption');
        
        var oldImage = document.getElementById('currentImage');
        var oldCaption = document.getElementById('currentCaption');
        
        if (oldImage == null) {
            slideArea.appendChild(caption);
            slideArea.appendChild(image);
        } else {
            slideArea.replaceChild(caption, oldCaption);
            slideArea.replaceChild(image, oldImage);
        }
    },
    fullscreen: function(url) {
        window.location = url;
    }
} 

var i = 0;