var Galeria = new Class({
    Implements: [Options, Events],
    options: {
        slides: [],
        startIndex: 0,
        wrap: true,
        fadeEnabled:true,
        onShow: $empty
    },
    initialize: function(options){
        this.setOptions(options)
        this.addSlides(this.options.slides);
        if(this.slides.length) this.showSlide(this.options.startIndex);
    },
    slides: [],
    addSlides: function(slides){
        $$(slides).each(function(slide){
            this.slides.include($(slide));
            slide.setStyle('display','none');
           //slide.addEvent('click', this.cycleForward.bind(this));
        }, this);
    },
    addSlide: function(slide){
        this.addSlides($splat($(slide)));
    },
    cycleForward: function(){
        if($chk(this.now) && this.now < this.slides.length-1) 
            this.showSlide(this.now+1);
        else if ((this.now) && this.options.wrap) 
            this.showSlide(0);
        else if(!$defined(this.now)) 
            this.showSlide(this.options.startIndex);
    },
    cycleBack: function(){
        if(this.now > 0) this.showSlide(this.now-1);
        else if(this.options.wrap) this.showSlide(this.slides.length-1);
    },
    showSlide: function(iToShow){
        if (this.fading) return;
        var now = this.now;        
        var currentSlide = this.slides[now];
        var slide = this.slides[iToShow];
        var fadeIn = function (s){
            this.fading = true;
            s.setStyles({
                display:'block',
                visibility: 'visible',
                opacity: 0
            });

            s.get('tween').start('opacity', 1).chain(function(){
                this.fading = false;
                this.fireEvent('onShow', [slide, iToShow]);
            }.bind(this));
        }.bind(this);
        if(slide) {
            if($chk(now) && now != iToShow){
                if(this.options.fadeEnabled){
                    this.fading = true;
                    currentSlide.get('tween').start('opacity', 0).chain(function(){
                        currentSlide.setStyle('display', 'none');
                        fadeIn(slide);
                    }.bind(this));
                }else{
                   currentSlide.setStyle('display', 'none');
                   slide.setStyles({
                        display:'block',
                        visibility: 'visible'
                        });   
                }
            } else fadeIn(slide);
            this.now = iToShow;
        }
    }
});

 
var NewsSlide = new Class({
    Extends: Galeria,
    Implements:Options,
    options: {
        news: [],
        container: false,
        carrousel_bots: false,
        selectores_bots: false
    },
    initialize: function(options){
        this.setOptions(options);
        this.parent(options);
        this.container = $(this.options.container);
        if(!this.container) return;
        this.showSlide(this.options.startIndex);
        if(this.options.carrousel_bots)this.botones();    
        if(this.options.selectores_bots)this.selectores();    
    },
    botones: function(){
           var prev=new Element('span', {
                id:'prev'
            }).inject(this.container);
           var next=new Element('span', {
                id:'next'
            }).inject(this.container);
            next.addClass('boton');
            prev.addClass('boton');
            next.addEvent('click', this.cycleForward.bind(this)); 
            prev.addEvent('click', this.cycleBack.bind(this)); 

    },
    selectores:function(){
        els=$$("#selectores_bots li");
        cant_el=els.length;
        i=0;
        while(i<cant_el){
            els[i].set('id','pos_'+i);
            i++;
        }
        $$("#selectores_bots li").each(function(el){
            el.addEvent('click',function(){
                this.marca_boton(el);
                pos=el.id.replace('pos_', '');
                this.showSlide(pos);
            }.bind(this));
        }.bind(this));
    },
    marca_boton:function(el){
        $$("#selectores_bots li").each(function(el){
            el.erase('class')
        });
        el.set('class','active');
    }
    
});