var a4Tabber = Class.create({

    /**
     * Constructor method that sets up a tabber.  The options parameter is a hash that specifies
     * the following options (all of which have associated default values):
     *
     * options.id: The id of the element containing the tabber and the only required option
     * options.tabsClass: The class name assigned the container element around the tabs
     * options.contentClass: The class name assigned to the container element around the content
     * options.activeTabClass: The class name to apply to an active tab
     * options.activeContentClass: The class name to apply to an active content area
     * options.defaultTab: The default tab shown (count, not index)
     *
     * Care should be taken to note that this is a Prototype 1.6 hash; not simply a JS object
     * acting as a hash.
     *
     * @param    options        The options hash as specified in the function description
     * @return    object        Returns a Tabber JS Object
     */
    initialize: function(options){
        this.options = $H({ id: null,
                            tabsClass: "tab-nav",
                            contentClass: "tab-content",
                            activeTabClass: "tabber-active",
                            activeContentClass: "tabber-content-active",
                            defaultTab: 1}).update(options);

        if(this.options.get("id") == null || $(this.options.get("id")) == undefined){
            throw("You have specified an invalid tabber id");
        }
        this.tabber = $(this.options.get("id"));
        this.tabContainer = $(this.options.get("id") + '-' + this.options.get("tabsClass"));
        this.contentContainer = $(this.options.get("id") + '-' + this.options.get("contentClass"));
//        this.constructTabPanel();
        this.tabs = this.tabContainer.childElements();
        this.content = this.contentContainer.childElements();
        /*if(this.tabs.length != this.content.length){
            if(this.tabs.length > this.content.length) throw("Not all tabs have content items");
            if(this.tabs.length < this.content.length) throw("Too many content items for the number of tabs");
        }*/
        this.tabber.observe(atx.clickEvent, this.tabClickHandler.bindAsEventListener(this));
        this.currentIndex = this.options.get("defaultTab") - 1;
        this.activateTab(this.tabs[this.currentIndex]);
        this.activateContent(this.currentIndex);
        if (this.tabber.hasClassName('tabber-primary')) {
            this.enablePrimaryTabs();
            this.handlePrimaryTabs();
        }

    },

    /**
     * Watches for clicks on any of the tab elements and determines which tab was clicked
     */
     tabClickHandler: function(e){
         var el;
         if(e.element().up().up() == this.tabContainer){
            el = e.element().up();
         } else if(e.element().up().up().up() == this.tabContainer){
             el = e.element().up().up();
         } else {
             el = e.element();
         }
         if (el.down('input')){
            el.down('input').click();
         }
        //var el = (e.element().up().up() == this.tabContainer) ? e.element().up() : e.element();
        if((el.up() == this.tabContainer) || (el.up().up() == this.tabContainer) || (el.up().up().up() == this.tabContainer)){
            var tabIndex = this.getTabIndex(el);
            if(tabIndex == null){
                throw("Could not determine the tab index");
            }
            this.activateTab(el);
            this.activateContent(tabIndex);
            this.currentIndex = tabIndex;
        }
        if (this.tabber.hasClassName('tabber-primary')) this.handlePrimaryTabs();
     },

    
    /**
     * Activates a tab and ensures that no other tabs are shown as active state.
     *
     * @param el     The element object that was clicked to activate
     */
    activateTab: function(el){
        this.tabs[this.currentIndex].removeClassName(this.options.get("activeTabClass"));
        el.addClassName(this.options.get("activeTabClass"));

    },

    /**
     * Activates a content area and forcibly hides the other content areas
     *
     * @param tabIndex    The index of the tab that was activated
     */
    activateContent: function(tabIndex){
        if (!this.content[tabIndex].hasClassName(this.options.get("activeContentClass"))){
            var tmpContent = this.content[tabIndex];
            this.content[this.currentIndex].removeClassName(this.options.get("activeContentClass"));
            tmpContent.addClassName(this.options.get("activeContentClass"));
        }
    },


    /**
     * Gets the index of the clicked tab
     *
     * @param tab        The tab that was clicked
     * @return int    The index of the tab that was clicked
     */
    getTabIndex: function(tab){
        var length = this.tabs.length;
        for(var i=0; i<length; i++){
            if(tab == this.tabs[i]){
                return i;
            }
        }
        return null;
    }
});