
var FeatureSlideshow = new Class({
    options: {
        showControls: true,
        showDuration: 12000,
        showTOC: true,
        tocWidth: 20,
        tocClass: 'toc',
        tocActiveClass: 'toc-active'
    },
    Implements: [Options,Events],
    initialize: function(container,elements,options) {
        //settings
        this.container = document.id(container);
        this.elements = document.getElements(elements);
        this.currentIndex = 0;
        this.interval = '';
        if(this.options.showTOC) this.toc = [];
        this.initialized = false;
    
        //assign
        if (this.elements.length > 1){
            var reverse = this.elements.length;
            this.elements.each(function(el,i){
                if(this.options.showTOC) {
                    this.toc.push(new Element('a',{
                        text: i+1,
                        href: '#',
                        'class': this.options.tocClass + '' + (i == 0 ? ' ' + this.options.tocActiveClass : ''),
                        events: {
                            click: function(e) {
                                if(e) e.stop();
                                this.stop();
                                this.show(i);
                            }.bind(this)
                        },
                        styles: {
                            right: (reverse * (this.options.tocWidth + 10))
                        }
                    }).inject(this.container));
                    reverse--;
                }
                if(i > 0) el.set('opacity',0);
            },this);
    
            //next,previous links
            if(this.options.showControls) {
                this.createControls();
            }

            //events
            this.container.addEvents({
                mouseenter: function() { this.stop(); }.bind(this),
                mouseleave: function() { this.start(); }.bind(this)
            });
        }
        /*
        console.log('done');
        */
    },
    show: function(to) {
        this.elements[this.currentIndex].fade('out');
        if(this.options.showTOC) this.toc[this.currentIndex].removeClass(this.options.tocActiveClass);
        this.elements[this.currentIndex = ((to != undefined) ? to : (this.currentIndex < this.elements.length - 1 ? this.currentIndex+1 : 0))].fade('in');
        if(this.options.showTOC) this.toc[this.currentIndex].addClass(this.options.tocActiveClass);
        if (!this.initialized){
            this.container.setStyle('visibility', 'visible');
            this.container.getElements('.slide').setStyle('visibility', 'visible');
            this.container.getElements('.info').setStyle('visibility', 'visible');
            this.initialized = true;
        }
    },

    start: function() {
        if (this.elements.length > 1){
            this.interval = this.show.bind(this).periodical(this.options.showDuration);
        }
    },

    stop: function() {
        clearInterval(this.interval);
    },

    //"private"
    createControls: function() {
        var next = new Element('a',{
            href: '#',
            'class': 'next',
            events: {
                click: function(e) {
                    if(e) e.stop();
                    this.stop(); 
                    this.show();
                }.bind(this)
            }
        }).inject(this.container);
        var previous = new Element('a',{
            href: '#',
            'class': 'previous',
            events: {
                click: function(e) {
                    if(e) e.stop();
                    this.stop(); 
                    this.show(this.currentIndex != 0 ? this.currentIndex -1 : this.elements.length-1);
                }.bind(this)
            }
        }).inject(this.container);
    }
});


