﻿function DynamicTabGroup(tabGroupId, dynamicTabs)
{
    this.element = document.getElementById(tabGroupId);
    this.element.tabs = dynamicTabs;
    this.activate = function(e)
    {
        var currentTab;
        for(var i = 0; i < this.tabs.length; i++)
        {
            currentTab = this.tabs[i].element;
            if(currentTab != null)
            {
                DynamicTab.resetTab(currentTab);
                DynamicTab.inactivateTab(currentTab);
            }
        }
        for(var i = 0; i < this.tabs.length; i++)
        {
            currentTab = this.tabs[i].element;
            if(currentTab != null)
            {
                if(currentTab.className.search(/\bActivatingTab\b/) > -1)
                {
                    DynamicTab.activateTab(currentTab);
                }
            }
        }
    }
    
    this.init = function()
    {
        // Remove hrefs
        var anchorElements = this.element.getElementsByTagName("a");
        for(var i = 0; i < anchorElements.length; i++)
        {
            anchorElements[i].removeAttribute("href");
        }
        
        this.element.tabs[0].element.className += " ActivatingTab";
        
        var currentTab;
        for(var i = 0; i < this.element.tabs.length; i++)
        {
            currentTab = this.element.tabs[i].element;
            if(currentTab != null)
            {
                DynamicTab.resetTab(currentTab);
                DynamicTab.inactivateTab(currentTab);
            }
        }
        DynamicTab.activateTab(this.element.tabs[0].element);
    }
    
    addEventHandler(this.element, "click", this.activate, false, false);
}

function DynamicTab(tabId, tabContentIds)
{
    this.element = document.getElementById(tabId);
    if(this.element != null)
    {
        this.element.tabContentArray = DynamicTab.getContentNodes(tabContentIds);

        this.activate = function(e)
        {
            this.className += " ActivatingTab";
        }
        
        if(this.element != null)
        {
            addEventHandler(this.element, "click", this.activate, false, false);    
        }
    }
}
DynamicTab.resetTab = function(tab)
{
    if(tab != null)
    {
        tab.className = tab.className.replace(/\bInactiveTab\b/, "");
        tab.className = tab.className.replace(/\bTab\b/, "");
        tab.className = tab.className.replace(/\bActiveTab\b/, "");    
    }
}

DynamicTab.activateTab = function(tab)
{
    if(tab != null)
    {
        tab.className = tab.className.replace(/\bActivatingTab\b/, "");
        tab.className += " ActiveTab Tab";
        for(var i = 0; i < tab.tabContentArray.length; i++)
        {
            tab.tabContentArray[i].style.display = "block";
        }
    }
}

DynamicTab.inactivateTab = function(tab)
{
    if(tab != null)
    {
        if(tab.className.indexOf("ActivatingTab") == -1)
        {
            tab.className += " InactiveTab Tab";
            for(var i = 0; i < tab.tabContentArray.length; i++)
            {
                tab.tabContentArray[i].style.display = "none";
            }
        }
    }
}
DynamicTab.getContentNodes = function(domIdArray)
{
    var domNodeArray = new Array();
    for(var i = 0; i < domIdArray.length; i++)
    {
        domNodeArray[i] = document.getElementById(domIdArray[i]);
    }
    return domNodeArray;
}
