// JScript File
if( ! Function.createDelegate ){
    Function.prototype.createDelegate = function(instance, method) {
        return function() { return method.apply(instance, arguments); }
    }
}
var TabsetStyle = function( data ){
    this.TabHead = ("tabHead" in data)?data.tabHead:'';
    this.TabHeadStrip = ("tabHeadStrip" in data)?data.tabHeadStrip:'';
    this.ActiveTab = ("tabActiveHead" in data)?data.tabActiveHead:'';
    this.TabPage = ("tabPage" in data)?data.tabPage:'';
    this.Container = ("container" in data)?data.container:'';
}
var Tabset = function( cfgData ){
    var _data = cfgData;
    var _styles = null;
    var _headelement = null;
    var _paneelement = null;
    var _viewIndex = 0;
    var _viewHeads = [];
    var _viewPanes = [];
    var _viewClickHandler;
    var _contentHandler;
    var _clickHandler;
    var _reload = false;
    this.set_viewIndex = function(value){
        if( _viewIndex != value ){
            _viewIndex = value;
            _showCurrentPane.call(this);
        }
    }
    function loadTabHeads(){
        var children = _headelement.getElementsByTagName("ul");
        var ts = [];
        for (var i = 0; i < children.length; i++) {
            if (children[i].nodeName == 'UL') {
                children[i].className = _styles.TabHeadStrip;
                ts = children[i].childNodes;
                break;
            }
        }
        //attach hooks
        var tmpViewIndex = 0;
        for (var i = 0, p = 0; i < ts.length; i++) {
            if (ts[i].nodeName == 'LI') {
                ts[i].attachEvent('onclick', _viewClickHandler);
                ts[i].viewIndex = tmpViewIndex;
                ts[i].className = _styles.TabHead;
                _viewHeads.push( ts[i] );
                tmpViewIndex++;
            }
        }
    }
    function loadPanes(){
        var children = _paneelement.getElementsByTagName("div");
        for (var i = 0; i < children.length; i++) {
            var child = children[i];
            var bIsPane = (window.addEventListener) ? child.hasAttribute("ispane") : "ispane" in child;
            if (bIsPane){
                child.className = _styles.TabPage;
                child.contentloaded = false;
                _viewPanes.push(child);
            }
        }
    }
    function _onViewClick() {
        var pane = window.event.srcElement;
        while (pane && (typeof(pane.viewIndex) == 'undefined'))
            pane = pane.parentNode;
        this.set_viewIndex(pane.viewIndex);
        var index = pane.viewIndex;
        if(_clickHandler)
            _clickHandler.call(this, index);
        return false;
    }
    function _showCurrentPane() {
        for (var i = _viewPanes.length - 1; i >= 0; i--) {
            _viewHeads[i].className = (i == _viewIndex)? 
                                        _styles.ActiveTab:
                                        _styles.TabHead;
            if(! _viewPanes[i].contentloaded && _contentHandler )
                _contentHandler.apply(this,[i]);
            _viewPanes[i].style.display = (i == _viewIndex)?'block':'none';
        }
    }
    function _loadContent(data){
        if( "paneid" in data ){
            if( _viewPanes[data.paneid] ){
                _viewPanes[data.paneid].contentloaded = true;
                if( "contenttype" in data ){
                    if( data.contentType == "html" )
                        _viewPanes[data.paneid].innerHTML = data.data;
                    else
                        _viewPanes[data.paneid].innerText = data.data;
                }
            }
        }
    }
    this.contentRenderer;
    this.viewIndex = 0;
    this.initialize = function() {
        _headelement = ("tabstrip" in _data)?document.getElementById(_data.tabstrip):null;
        _paneelement = ("pane" in _data)?document.getElementById(_data.pane):null;
        if( _headelement == null || _paneelement == null ){ 
            alert('unable to initialize the tab control');
            return false;
        }
        if( "loadingHandler" in _data ) _contentHandler = _data.loadingHandler;
        if( "clickHandler" in _data ) _clickHandler = _data.clickHandler;        
        _viewClickHandler = Function.createDelegate(this, _onViewClick);
        this.contentRenderer = Function.createDelegate( this, _loadContent );
        if( "style" in _data ) _styles = new TabsetStyle( _data.style );
        else _styles = new TabsetStyle( {} );
        loadTabHeads( );
        loadPanes();
        _showCurrentPane.call(this);
    }
    
    this.reloadPane = function( value ){
        if( _viewIndex != value ){
            _reload = true;
            this.set_viewIndex( value );
        }
    }
    this.dispose = function(){
        if (_viewClickHandler) {
          for (var i = _viewHeads.length - 1; i >= 0; i--)
            if (_viewHeads[i]) _viewHeads[i].detachEvent('onclick', _viewClickHandler);
          _viewClickHandler = null;
          _viewHeads = null;
          _viewPanes = null;
        }
    }
}