function SlideShowViewer (elementId, imageUrlList)
{
    this.container = jQuery('#'+elementId);
    this.imageUrlList = imageUrlList;
    this.imageCount = imageUrlList.length;
    this.currentIndex = 0;
    this.preLoadedCount = 0;
    this.isPreLoaded = false;
    this.imageList = Array;
    this.timer = null;
    thisViewer = this;
    this._preLoadImages();
    this.playAction = function () {
        thisViewer._nextSlide();
    }
}

SlideShowViewer.prototype.play = function () {
    firstImageSrc = this.imageUrlList[this.currentIndex];
    this.container.css({background: 'transparent url('+firstImageSrc+') left top no-repeat'});
    fisrtImage = this.container.find('img:first');
    fisrtImage.attr('src', firstImageSrc).css({'opacity': '1'});
    if (this.currentIndex < this.imageCount-1) {
        this.currentIndex++;
    } else {
        this.currentIndex = 0;
    }
    this.timer = setInterval(this.playAction, 3000);
    return false;
};

SlideShowViewer.prototype.stop = function (imageSrc) {
    clearInterval(this.timer);
    largeImage = this.container.find('img:first');
    largeImage.stop();
    largeImage.show().css({'opacity': '1'}).attr('src', imageSrc);
    return false;
}

SlideShowViewer.prototype.showIndex = function (index) {
    if (this.isPreLoaded) {
        this.stop(this.imageUrlList[index]);
    }
    return false;
}

SlideShowViewer.prototype._nextSlide = function () {
    nextImageSrc = this.imageUrlList[this.currentIndex];
    this.container.css({background: 'transparent url('+nextImageSrc+') left top no-repeat'});
    currentImage = this.container.find('img:first');
    currentImage.animate({opacity: 0}, 1500, function(){
        currentImage.attr('src', nextImageSrc).css({'opacity': '1'});
    });
    
    if (this.currentIndex < this.imageCount-1) {
        this.currentIndex++;
    } else {
        this.currentIndex = 0;
    }
    return false;
}

SlideShowViewer.prototype._preLoadImages = function() {
    for(var i = 0; i<this.imageUrlList.length; i++)
    {
        this.imageList[i] = new Image();
        thisSlideShowViewer = this;
        this.imageList[i].onload = function () {
            thisSlideShowViewer.preLoadedCount++;
            if (thisSlideShowViewer.preLoadedCount == thisSlideShowViewer.imageCount) {
                thisSlideShowViewer.isPreLoaded = true;
                thisSlideShowViewer.play();
            }
        };
        this.imageList[i].src = this.imageUrlList[i];
    }
}