/* ---- basic useage and options
  
  var myTabs = new tabSwitch('yourActivatorsContainer','yourTabsContainer',{options});
  
  options:
    startTab: defaults to one
    linkable:boolean  - defaults to false, when set to true will fire tabSwitch on the hash/URL anchor on page load
    autoClass = auto assigns the class you specify to the active element - i.e. autoclass:'activeTabClass'
*/

var tabSwitch = new Class ({
    presetOptions: function() {
        return {
        startTab:1,
        linkable:false,
        autoClass:''
        };
    },
    initialize:function(actCont,tabCont,Opts) {
        this.setOptions(this.presetOptions(),Opts);
        var startTab = this.options.startTab;
        var linkable = this.options.linkable;
        var autoClass= this.options.autoClass;
        
        //define the elements to bind to 
        var eachAct = $(actCont).getChildren();
        var eachTabCont = $(tabCont).getChildren();
        var eachTab = 1;
        var eachTabAct = 1;
        
        //bind class to each TAB Content Container
        $each(eachTabCont,function(el){
            $(el).set('class','tabsCont'+eachTab);
            eachTab++;
        });

        //bind TAB reference in storage to links
        $each(eachAct,function(el){
            $(el).set('id','tabAct'+eachTabAct);
            $(el).store('tabNum',eachTabAct);
            
                $(el).addEvent('click',function(el) {
                    if (autoClass!=null){
                    $each(eachAct,function(el){
                        if (el.hasClass(autoClass)){
                            el.removeClass(autoClass);
                        }
                    });
                    this.addClass(autoClass);
                }
                    if (linkable==true && this.get('rel')) {
                        window.location.href= '#'+this.get('rel');
                    }
                    $each($$('#'+tabCont+' div'),function (el){el.setStyle('display','none')});
                    
                    /*set any inner divs to block inside tabs */
                     if ($$('#'+tabCont+' div div')){$each($$('#'+tabCont+' div div'),function (el){el.setStyle('display','block')});}
                    $each($$('.tabsCont'+this.retrieve('tabNum')),function(el) {
                        el.setStyle('display','block');
                    });
                });
            eachTabAct++;
        });
        $each($$('.tabsCont'+startTab),function(el){el.setStyle('display','block')});
        if (autoClass!=null){
            $('tabAct'+startTab).addClass(autoClass);
        }
    }
});
tabSwitch.implement(new Options);