var agdaSlideShow = new Class({
    initialize: function(el, thumb, options) {
        this.element = $(el);
        this.img;
        this.slides = [];
        this.thumb = $(thumb);
        this.current = null;
        this.caption = null;
        this.ptr = 0;
        this.active = true;
        this.autoplay = true;
        this.timer = null;
        this.images = 0;
        this.options = {fade: 500,
                        delay: 9000,
                        width: 479,
                        height: 304,
                        offset: 12};
        loop = 0;
        this.element.set('html', '')
        this.element.fx = this.element.tween('height', {transition: Fx.Transitions.Quad.easeInOut,
                                                         onComplete: function() { this.current.start(1) }.bind(this)});

        $$('.thumbnail a', this.thumb).each(function(thumb) {
            this.images++;
            thumb.loop = loop;
            thumb.addEvent('click', function(e) {
                e = new Event(e).stop();
                this.goTo(thumb.loop);
            }.bindWithEvent(this));
            var img = new Element('img').addEvent('load', this.preload.bind(this))
                                        .setProperty('src', thumb.getProperty('rel'))
                                        .setProperty('alt', thumb.getElement('img').getProperty('alt'))
                                        .setStyle('position', 'absolute')
                                        .setStyle('top', '0px')
                                        .setStyle('left', '0px')
                                        .setStyle('opacity', '0')
                                        .setStyle('display', 'block')
                                        .injectInside(this.element);
            var slide = new Fx.Tween(img, {
                duration: this.options.fade,
                onComplete: this._captionUpdate.pass([false], this)
            });
            this.slides[loop] = slide;
            loop++;
        }.bind(this));
        this.captionpnl = new Element('div').setProperty('id', 'gallery_caption')
                                            .setStyle('position', 'absolute')
                                            .setStyle('height', '20px')
                                            .setStyle('overflow', 'hidden');
        this.captiontxt = new Element('div').setStyle('opacity', 0.8)
                                            .injectInside(this.captionpnl);
        this.captionpnl.fx = new Fx.Tween(this.captionpnl);
        this.captionpnl.injectInside(this.element);
    },
    
    preload: function() {
        this.images--;
        if (this.images < 1) {
            this.start();
        }
    },
    
    start: function() {
        this._reset();
        this.active = true;
        this.next();
    },
    
    stop: function() {
        this._reset();
        this.slides[this.ptr].stop();
        this.active = false;
    },
    
    next: function() {
        if (this.current) {
            this.current.start('opacity', 0);
        }
        this.current = this.slides[this.ptr];
        this.caption = this.slides[this.ptr].element.alt;
        var w = (this.current.element.width) ? this.current.element.width : this.options.width;
        var h = (this.current.element.height) ? this.current.element.height : this.options.height;

        var wd = (this.element.getCoordinates().width) ? this.element.getCoordinates().width : this.options.height;
        var ht = (this.element.getCoordinates().height) ? this.element.getCoordinates().height : this.options.height;

        var x = ((wd / 2) - (w / 2)) + 'px';
        var y = (((ht / 2) - (h / 2)) + this.options.offset) + 'px';
        this.current.element.setStyle('left', x);
        this.current.element.setStyle('top', y);
        this.current.start('opacity', 1);
        this.ptr++;
        if (this.ptr >= this.slides.length) {
            this.ptr = 0;
        }
        this._captionUpdate(true);
        if (this.autoplay) {
            this.timer = this.next.delay(this.options.delay, this);
        }
    },
    
    goTo: function(el) {
        this.ptr = el;
        this.autoplay = false;
        this.start();
    },
    
    _reset: function() {
        if (this.timer) {
            $clear(this.timer);
            this.timer = null;
        }
    },
    
    _captionUpdate: function(close) {
        this.captionpnl.fx.cancel();
        if (close) {
            if (this.caption) {
                this.captionpnl.fx.start('height', 0);
            }
        } else if (this.active && this.caption) {
            this.captiontxt.set('html', this.caption);
            this.captionpnl.fx.start('height', this.captiontxt.offsetHeight);
        }
    }
});