/*****************************************************
*   Author:     dada
*   E-Mail:     dada_dotnet@hotmail.com
*   CreateTime: 2006.10.22.1645
*   Version:    2006.11.07.1521
*   Summary:    System.UI.TabStrip.js
*****************************************************/

var System; if (!System) System = {};
if(!System.UI) System.UI = {};
System.UI.TabStrip = function(_tabStripId)
{
    /// define properties
    this.tabStripId = _tabStripId;
    this.dataSource = [];
    this.cssClass = 'tabstrip';
    this.width = '';
    this.tabSelected = '';
    this.splitBegin = '';
    this.splitCenter = '';
    this.splitEnd = '';
    this.onclickEvent = '';
    this.onmouseoverEvent = '';
    this.onmouseoutEvent = '';
    
    // tabstrip create
    this.create = function(_id)
    {
        if(_id && typeof(_id) == 'string' && _id != '')
        {
            // create the tabstrip to ..
            $(_id).innerHTML = System.UI.TabStrip.createStruct(this, _id);
        }
        else
        {
            // write the struct of tabstrip to document.
            document.write(System.UI.TabStrip.createStruct(this));
        }
        
        // set all <ul>'s class to default.
        System.UI.TabStrip.setAllStatus(this, 'default');
        
        // add events but selected tab.
        System.UI.TabStrip.allAddEvent(this);
        
        // set selected <ul> and remove the event of selected tab.
        if(this.tabSelected && typeof(this.tabSelected) == 'string' && this.tabSelected != '')
        {
            System.UI.TabStrip.setStatus(this, this.tabStripId + '_' + this.tabSelected, 'selected');
            System.UI.TabStrip.removeEvent(this.tabStripId + '_' + this.tabSelected);
        }
    };
    
    // add tab to tabstrip.
    this.addTab = function(tab)
    {
        
    };
};

// create tabstrip struct.
System.UI.TabStrip.createStruct = function(obj, _id)
{
    if(obj && typeof(obj.tabStripId) == 'string' && obj.tabStripId != '')
    {
        var data = obj.dataSource;
        if(data && typeof(data) == 'object' && data.constructor == Array)
        {
            var struct = '<div id="' + obj.tabStripId + '" class="' + obj.cssClass + '_div">';
            for(var i=0; i<data.length; i++)
            {
                if(data[i].length >= 2)
                {
                    var ulId = obj.tabStripId + '_' + data[i][1];
                    struct += '<ul id="' + ulId + '">';
                    struct += '<li>&nbsp;</li>';
                    struct += '<li';
                    
                    if(data[i][2])
                    {
                        struct += ' style="width:' + data[i][2] + '"';
                    }
                    else if(obj.width)
                    {
                        struct += ' style="width:' + obj.width + '"';
                    }
                    
                    struct += '>' + data[i][0] + '</li>';
                    struct += '<li>&nbsp;</li>';
                    struct += '</ul>';
                }
            }
            return struct += '</div>';
        }
        else
        {
            alert('TabStrip: Data source format error.');
        }
    }
    else
    {
        alert('TabStrip: The \'id\' of tabstrip was invalid.');
    }
};

// set the special _tabId of <ul>'s class to _status.
System.UI.TabStrip.setStatus = function(obj, _tabId, _status)
{
    if(obj && typeof(obj.cssClass) == 'string' && obj.cssClass != '')
    {
        var ul = $(_tabId);
        if(ul && typeof(ul) == 'object')
        {
            var cssClass = obj.cssClass;
            ul.className = cssClass + '_ul ' + cssClass + '_ul_' + _status;
            
            var lis = ul.getElementsByTagName('li');
            for(var i=0,li; li=lis[i]; i++)
            {
                li.className = cssClass + '_li ' + cssClass + '_li_' + (i+1) + '_' + _status;
            }
        }
    }
    else
    {
        alert('TabStrip: obj is null or obj.cssClass is empty.');
    }
};

// set all <ul>'s class to _status.
System.UI.TabStrip.setAllStatus = function(obj, _status)
{
    var tabstrip = $(obj.tabStripId);
    if(tabstrip)
    {
        var uls = tabstrip.getElementsByTagName('ul');
        for(var i=0,ul; ul=uls[i]; i++)
        {
            System.UI.TabStrip.setStatus(obj, ul.id, _status);
        }
    }
};

//
System.UI.TabStrip.selected = function(obj, _tabId)
{
    // set the selected tab
    obj.tabSelected = _tabId.replace(obj.tabStripId + '_', '');
    
    // set all <ul>'s class to default.
    System.UI.TabStrip.setAllStatus(obj, 'default');
    
    // set <ul> with '_tabId' selected
    System.UI.TabStrip.setStatus(obj, _tabId, 'selected');
    
    // reset all event
    System.UI.TabStrip.allAddEvent(obj);
    
    // remove the selected tab's event
    System.UI.TabStrip.removeEvent(_tabId);
    
};

// set selected <ul>
System.UI.TabStrip.hover = function(obj, _tabId)
{
    var ul = $(_tabId);
    if(ul)
    {   
        if(ul.className.indexOf('selected') < 0)
        {
            // set <ul> with '_tabId' selected
            System.UI.TabStrip.setStatus(obj, _tabId, 'hover');
        }
    }
};

// set default <ul>
System.UI.TabStrip.out = function(obj, _tabId)
{
    var ul = $(_tabId);
    if(ul)
    {   
        if(ul.className.indexOf('selected') < 0)
        {
            // set <ul> with '_tabId' selected
            System.UI.TabStrip.setStatus(obj, _tabId, 'default');
        }
    }
};

// add event
System.UI.TabStrip.addEvent = function(obj, _tabId)
{
    var ul = $(_tabId);
    if(ul)
    {
        var _value = _tabId.replace(obj.tabStripId + '_', '');
        
        var _onclick = function(){System.UI.TabStrip.selected(obj, _tabId);};
        var onclickEvent = obj.onclickEvent;
        if(onclickEvent && typeof(onclickEvent) == 'function')
        {
            _onclick = function(){
                var oldID=obj.tabSelected;
                System.UI.TabStrip.selected(obj, _tabId);
                onclickEvent(_value, oldID);
            };
        }
        
        var _onmouseover = function(){System.UI.TabStrip.hover(obj, _tabId);};
        var onmouseoverEvent = obj.onmouseoverEvent;
        if(onmouseoverEvent && typeof(onmouseoverEvent) == 'function')
        {
            _onmouseover = function(){
                System.UI.TabStrip.hover(obj, _tabId);
                onmouseoverEvent(_value);
            };
        }
        
        var _onmouseout = function(){System.UI.TabStrip.out(obj, _tabId);};
        var onmouseoutEvent = obj.onmouseoutEvent;
        if(onmouseoutEvent && typeof(onmouseoutEvent) == 'function')
        {
            _onmouseout = function(){
                System.UI.TabStrip.out(obj, _tabId);
                onmouseoutEvent(_value);
            };
        }
        
        ul.onclick = _onclick;
        ul.onmouseover = _onmouseover;
        ul.onmouseout = _onmouseout;
    }
};

// all add event.
System.UI.TabStrip.allAddEvent = function(obj)
{
    var tabstrip = $(obj.tabStripId);
    if(tabstrip)
    {
        var uls = tabstrip.getElementsByTagName('ul');
        for(var i=0,ul; ul=uls[i]; i++)
        {
            System.UI.TabStrip.addEvent(obj, ul.id);
        }
    }
};

// remove attribute
System.UI.TabStrip.removeEvent = function(_tabId)
{
    var ul = $(_tabId);
    if(ul)
    {
        ul.onclick = "";
        ul.onmouseover = "";
        ul.onmouseout = "";
    }
};

// remove all attribute
System.UI.TabStrip.removeAllEvent = function(obj)
{
    var tabstrip = $(obj.tabStripId);
    if(tabstrip)
    {
        var uls = tabstrip.getElementsByTagName('ul');
        for(var i=0,ul; ul=uls[i]; i++)
        {
            System.UI.TabStrip.removeEvent(ul.id);
        }
    }
};

/*
// get object by id
function $(_id)
{
    return document.getElementById(_id);
};
*/