var States = { "Idle": 0, "FadingIn": 1, "FadingOut": 2 };

function TabControl(MainDiv, VarName, ActiveTab) {

    this.MainDiv = MainDiv;
    this.VarName = VarName;
    this.ActiveTab = ActiveTab;
    this.FadeFreq = 20;
    this.FadeStep = 0.05;
    this.AutoPostBack = false;
    this.RadioID = null;
    this.UniqueID = null;
    this.ActiveTop = 0;
    this.InactiveTop = 0;

    this.TabList = new Array();

    this.IE = (navigator.appName.indexOf('Internet Explorer') >= 0);

    this.AddDiv = function(DivID) {
        var div = document.getElementById(DivID);
        this.TabList.push(new Tab(div));
    }

    this.PostBack = function() {
    //alert('__doPostBack(\'' + this.MainDiv.ID + '$selTab$' + this.ActiveTab + '\',\'\')');
      //  setTimeout('__doPostBack(\'' + this.MainDiv.ID + '$selTab$' + this.ActiveTab + '\',\'\')', 0)
    }

    this.SelectTab = function(I) {
        if (this.ActiveTab == I)
            return;

        var ul = null;
        for (var i = 0; i < this.MainDiv.childNodes.length; i++) {
            var cul = this.MainDiv.childNodes[i];
            if (cul.tagName == 'UL') {
                ul = cul;
                break;
            }
        }
        if (ul == null)
            return;
        var tabNo = 0;
        for (var j = 0; j < ul.childNodes.length; j++) {
            var cn = ul.childNodes[j];
            if ((cn.tagName == 'LI') && (cn.id.length > 0)) {
                var a = cn.childNodes[0];
                var currX = a.style.backgroundPosition.split(' ')[0];
                if (tabNo != I) {
                    cn.className = '';
                    a.style.backgroundPosition = currX + ' ' + this.InactiveTop + 'px';
                }
                else {
                    cn.className = 'selected';
                    a.style.backgroundPosition = currX + ' ' + this.ActiveTop + 'px';
                }
                tabNo++;
            }
        }

        this.FadeOut(this.ActiveTab);
        this.FadeIn(I);
        this.ActiveTab = I;
        if (this.AutoPostBack)
            this.PostBack();
    }

    this.getIEOpacity = function(T) {
        if (!this.IE)
            return;
        var sp = T.Div.style.filter.split('=');
        if (sp[0] == 'alpha(opacity')
            return parseInt(sp[1]);
        else
            alert('error');
    }

    this.setIEOpacity = function(T, O) {
        if (!this.IE)
            return;
        T.Div.style.filter = 'alpha(opacity=' + O + ')';
    }

    this.FadeIn = function(I) {
        var tab = this.TabList[I];
        if (this.IE) {
            if (this.getIEOpacity(tab) == 100)
                return;
        }
        else
            if (tab.Div.style.opacity == 1)
            return;
        clearInterval(tab.Interval);
        tab.State = States.FadingIn;
        tab.Div.style.display = 'block';
        var action = this.VarName + '.FadeInAction(' + I + ')';
        tab.Interval = setInterval(action, this.FadeFreq);
    }

    this.FadeInAction = function(I) {
        var tab = this.TabList[I];
        if (!this.IE) {
            var newOp = Math.min(1, parseFloat(tab.Div.style.opacity) + this.FadeStep);
            tab.Div.style.opacity = newOp;
            if (newOp == 1) {
                clearInterval(tab.Interval);
                tab.State = States.Idle;
                tab.Div.style.display = 'block';
            }
        }
        else {
            var newOp = Math.min(100, parseInt(this.getIEOpacity(tab) + (this.FadeStep * 100)));
            this.setIEOpacity(tab, newOp);
            if (newOp == 100) {
                clearInterval(tab.Interval);
                tab.State = States.Idle;
                tab.Div.style.display = 'block';
            }
        }
        //alert(I + '=' + newOp);
    }

    this.FadeOut = function(I) {
        var tab = this.TabList[I];
        if (this.IE) {
            if (this.getIEOpacity(tab) == 0)
                return;
        }
        else
            if (tab.Div.style.opacity == 0)
                return;
        clearInterval(tab.Interval);
        tab.State = States.FadingOut;
        var action = this.VarName + '.FadeOutAction(' + I + ')';
        tab.Interval = setInterval(action, this.FadeFreq);
    }

    this.FadeOutAction = function(I) {
        var tab = this.TabList[I];
        if (!this.IE) {
            var newOp = Math.max(0, parseFloat(tab.Div.style.opacity) - this.FadeStep);
            tab.Div.style.opacity = newOp;
            if (newOp == 0) {
                clearInterval(tab.Interval);
                tab.State = States.Idle;
                tab.Div.style.display = 'none';
            }
        }
        else {
            var newOp = Math.max(0, parseInt(this.getIEOpacity(tab) - (this.FadeStep * 100)));
            this.setIEOpacity(tab, newOp);
            if (newOp == 0) {
                clearInterval(tab.Interval);
                tab.State = States.Idle;
                tab.Div.style.display = 'none';
            }
        }

        //alert(I + '=' + newOp);
    }
    
}

function Tab(Div) {
    this.Div = Div;
    this.Selected = false;

    this.Interval = null;

    this.State = States.Idle;

    this.SetOpacity = function(O) {
        this.Div.style.opacity = O;
    }

    this.SetZIndex = function(Z) {
        this.Div.style.zIndex = Z;
    }
}