var Tabs = Class.create(
{
    initialize: function(options) {
        
        // load options
        this.ctrl_class   = options.ctrl_class;
        this.target_class = options.target_class;
        this.effect       = options.effect == null ? false : options.effect;
        this.duration     = options.duration == null ? 0 : options.duration;
        this.active_class = options.active_class == null ? 'active' : options.active_class;
        
        if(!this.effect)
            $$('.'+this.ctrl_class).each(function(elem) { elem.observe('click', this.toggleTargets.bind(this)); }.bind(this), this);
        else
            $$('.'+this.ctrl_class).each(function(elem) { elem.observe('click', this.toggleTargetsWithOpacity.bind(this)); }.bind(this), this);
    },
    
    toggleTargets: function(event) {
        
        $$('.'+this.target_class).each(function(elem) {
                                          if(elem.id == event.target.href.substring(event.target.href.indexOf('#')+1))
                                              elem.show();
                                          else if(elem.visible())
                                              elem.hide();
        });
        
        $$('.'+this.ctrl_class).each(function(elem) {
                                         if(elem == event.target) {
                                              elem.addClassName(this.active_class);
                                              elem.up().addClassName(this.active_class);
                                         }
                                         else {
                                              elem.removeClassName(this.active_class);
                                              elem.up().removeClassName(this.active_class);
                                         }
        }.bind(this));
        
        event.stop();
    },
    
    toggleTargetsWithOpacity: function(event) {
        
        toshow = false;
        tohide = false;
        
        $$('.'+this.target_class).each(function(elem) {
                                          if(elem.id == event.target.href.substring(event.target.href.indexOf('#')+1))
                                              toshow = elem;
                                          else if(elem.visible())
                                              tohide = elem;
        });
        
        if(toshow != false && tohide != false) {
            tohide.fade({ duration: this.duration });
            toshow.appear({ duration: this.duration });
        }
        else if(toshow != false)
            toshow.appear({ duration: this.duration });
        
        
        $$('.'+this.ctrl_class).each(function(elem) {
                                         if(elem == event.target) {
                                              elem.addClassName(this.active_class);
                                              elem.up().addClassName(this.active_class);
                                         }
                                         else {
                                              elem.removeClassName(this.active_class);
                                              elem.up().removeClassName(this.active_class);
                                         }
        }.bind(this));
        
        event.stop();
    }
});

