/* =================================
    JavaScript FOR CATALooK.netStore 
    1/2007
   =================================
*/

function TabCtl(selectedClassName, unselectedClassName, mouseOverClassName)
{
    this.Main = function()
    {
        // TabCtl Internal properties
        this.lstTabs = new Array();
        this.selectedClassName = selectedClassName;
        this.unselectedClassName = unselectedClassName;
        this.mouseOverClassName = mouseOverClassName;
    }

    // Internal class
    function Tab(tabCtl, tabHeaderID, tabBodyID)
    {
        this.Main = function()
        {
            var ctlTabHeader = document.getElementById(tabHeaderID);
            var ctlTabBody = document.getElementById(tabBodyID);
            
            if (ctlTabHeader == null)
            {
                throw new Error("Cannot find the control with ID = '" + tabHeaderID + "' for the Tab Header");
            }
            
            if (ctlTabBody == null)
            {
                throw new Error("Cannot find the control with ID = '" + ctlTabBody + "' for the Tab Body");
            }    
        
            this.tabCtl = tabCtl;
            this.tabHeaderID = tabHeaderID;
            this.tabBodyID = tabBodyID;
            this.tabHeaderCtl = ctlTabHeader;
            this.tabBodyCtl = ctlTabBody;
            
            // Selects this tab
            this.tabHeaderCtl.SelectThisTab = function()
            {
                tabCtl.SelectTab(tabHeaderID);
            } 
            
            // MousesOver this tab
            this.tabHeaderCtl.MouseOverTab = function()
            {
                tabCtl.MouseOverTab(tabHeaderID);
            } 
            
            // MousesOut this tab
            this.tabHeaderCtl.MouseOutTab = function()
            {
                tabCtl.MouseOutTab(tabHeaderID);
            }             
        }

        this.Main();
    }

    // Adds a Tab to the internal collection by associating the tabHeader with the tabBody
    this.AddTab = function(tabHeaderID, tabBodyID)
    {
        var newTab = new Tab(this, tabHeaderID, tabBodyID);
        this.lstTabs.push(newTab);
        
        this.BrowserAddHandler(newTab.tabHeaderCtl, "click", "SelectThisTab")
        this.BrowserAddHandler(newTab.tabHeaderCtl, "mouseover", "MouseOverTab")
        this.BrowserAddHandler(newTab.tabHeaderCtl, "mouseout", "MouseOutTab")
    }
    
    // Hide tab contents for all unselected tabs and show selected tab contents
    this.SelectTab = function(tabHeaderID)
    {
        // Find the selected tab and display it
        for (var i = 0; i < this.lstTabs.length; i++)
        {
            var tab = this.lstTabs[i];
            
            if (tab.tabHeaderID == tabHeaderID)
            {
                if (tab.tabCtl.selectedClassName != null)
                {
                    tab.tabHeaderCtl.oldClassName = null;
                    tab.tabHeaderCtl.className = tab.tabCtl.selectedClassName;
                }
                tab.tabBodyCtl.style.display = "inline";
            }
            else
            {
                if (tab.tabCtl.unselectedClassName != null)
                {
                    tab.tabHeaderCtl.oldClassName = null;
                    tab.tabHeaderCtl.className = tab.tabCtl.unselectedClassName;
                }
                tab.tabBodyCtl.style.display = "none";
            }
        }
    }
    
    // Changes the style for the tab header to the mouse over style
    this.MouseOverTab = function(tabHeaderID)
    {
        // Find the selected tab
        for (var i = 0; i < this.lstTabs.length; i++)
        {
            var tab = this.lstTabs[i];
        
            if (tab.tabHeaderID == tabHeaderID)
            {
                if (tab.tabCtl.mouseOverClassName != null)
                {
                    tab.tabHeaderCtl.oldClassName = tab.tabHeaderCtl.className;
                    tab.tabHeaderCtl.className = tab.tabCtl.mouseOverClassName;
                }
            }
        }
    }
    
    // Changes the style for the tab header from the mouse over style to the previous style
    this.MouseOutTab = function(tabHeaderID)
    {
        // Find the selected tab
        for (var i = 0; i < this.lstTabs.length; i++)
        {
            var tab = this.lstTabs[i];
        
            if (tab.tabHeaderID == tabHeaderID)
            {
                if (tab.tabHeaderCtl.className == tab.tabCtl.mouseOverClassName)
                {
                    if (tab.tabHeaderCtl.oldClassName != null)
                    {
                        tab.tabHeaderCtl.className = tab.tabHeaderCtl.oldClassName;
                        tab.tabHeaderCtl.oldClassName = null;
                    }
                }
            }
        }
    }
    
    this.BrowserAddHandler = function(target, eventName, handlerName)
    //******************************************************************************
    // Cross browser function to programatically add an event handler to an HTML
    // control.
    //******************************************************************************
    {
     if ( target.addEventListener )
     {
       target.addEventListener(eventName, function(e){target[handlerName](e);}, false);
     }
     else if ( target.attachEvent )
     {
       target.attachEvent("on" + eventName, function(e){target[handlerName](e);});
     }
     else
     {
       var originalHandler = target["on" + eventName];
       if ( originalHandler )
       {
         target["on" + eventName] = function(e){originalHandler(e);target[handlerName](e);};
       }
       else
       {
         target["on" + eventName] = target[handlerName];
       }
     }
    }  
    
    this.Main();  
}