var SlideShowWithCaptions = new Class ({
    Extends: SimpleImageSlideShow,
    options: {
        captionSpans: '',
        caption: 'caption'
    },
    initialize: function (options) {
        this.parent(options);
        this.addImageIds();
        this.addCaptionSpanIds();
        this.addCaptionClicks();
        this.updateCaption(this.options.startIndex);
        $(this.options.container).setStyle('display', '');
    },
    addImageIds: function () {
        var i=0;
        this.options.slides.each(function (aSlide) {
            aSlide.set('id', 'slide-'+i++);
            aSlide.setStyle('cursor', 'pointer');
            aSlide.addEvent('click', function (e, slide) {
                var id = slide.id.split('-')[1].toInt();
                this.forward();
                
                if (id+1 > this.slides.length-1) {
                    this.updateCaption(0);
                } else if (id+1 <= this.slides.length-1) {
                    this.updateCaption(id+1);
                }
            }.bindWithEvent(this, aSlide));
        }, this);
    },
    addCaptionSpanIds: function () {
        // Initially add an ID to each caption
        if (!this.options.captionSpans) { return; }
        var i=0;
        
        $(this.options.captionSpans).getChildren('span').each(function (caption) {
            caption.setStyle('display', 'none');
            caption.set('id', 'captionSpan-'+i++);
        });
    },
    addCaptionClicks: function () {
		$(this.options.nextLink).addEvent('click', function () {
		    var next;
		    if (Browser.Engine.trident) { next = this.now+1; }
		    else { next = this.now; }

		    if (next >= this.slides.length) {
		        // Go to the first slide
    			this.updateCaption(0);
		    } else {
		        // Go forward 1
    			this.updateCaption(next);
		    }
		}.bind(this));

		$(this.options.prevLink).addEvent('click', function () {
		    var prev;
		    if (Browser.Engine.trident) { prev = this.now-1; }
		    else { prev = this.now; }

		    if (prev < 0) {
		        // Go to the last slide
    			this.updateCaption(this.slides.length-1);
		    } else {
		        // Go back 1
    			this.updateCaption(prev);
		    }
		}.bind(this));
    },
    updateCaption: function (id) {
        if (!this.options.captionSpans) {
            $(this.options.container).getChildren('img').each(function (img) {
                // Update the caption to the current image alt tag
                if (img.get('id') == 'slide-'+id) {
                    $(this.options.caption).set('html', img.get('alt'));
                }
            }, this);
        }
        else {
            $(this.options.captionSpans).getChildren('span').each(function (caption) {
                // Hide all the previous, and show the current
                caption.setStyle('display', 'none');
                if (caption.get('id') == 'captionSpan-'+id) {
                    caption.setStyle('display', 'block');
                }
            });
        }
    }
});

var initSlideShowContainer = new Class ({
    Implements: Options,
    options: {
        container: 'container',
        url: '',
        linkIndex: 0
    },
    initialize: function (options) {
        this.setOptions(options);
        this.initLinks();
    },
    initLinks: function () {
        $$('#'+this.options.container+' a').each(function (a) {
            a.set('href', this.options.url+this.options.linkIndex++);
        }, this);
    }
});