var Evlon = {};
Evlon.createDelegate = function(instance, method) {
    return function() {
        method.apply(instance, arguments);
    }
}
Evlon.Tab = function(tabWnd, elmt, focusClassName, elmtContent, enableHoverSwitch) {
    this.tabWnd = tabWnd;
    this.elmt = elmt;
    this.focusClassName = focusClassName;
    this.content = elmtContent;
    this.enableHoverSwitch = enableHoverSwitch;
    this._timer = null;


    this.hide = function() {
        var re = new RegExp("\\s+" + focusClassName, "ig");
        var className = ' ' + this.elmt.className.toString();
        this.elmt.className = className.replace(re, '');
        this.content.style.display = 'none';
    }
    this.show = function() {
        this.elmt.className += ' ' + focusClassName;
        this.content.style.display = '';
    }
    this.menu_onclick = function() {
        this.menu_onmouseout();
        return this.tabWnd.switchTab(this);
    }

    this.menu_onmouseover = function() {
        window.status = new Date();
        this.menu_onmouseout();
        this._timer = window.setTimeout(Evlon.createDelegate(this.elmt, this.elmt.onclick), 100);
    }
    this.menu_onmouseout = function() {
        if (this._timer) {
            window.clearTimeout(this._timer);
        }
    }
    this.hide();
    this.elmt.onclick = Evlon.createDelegate(this, this.menu_onclick)
    if (this.enableHoverSwitch) {
        this.elmt.onmouseover = Evlon.createDelegate(this, this.menu_onmouseover)

        this.elmt.onmouseout = Evlon.createDelegate(this, this.menu_onmouseout)
    }
}

Evlon.TabWnd = function(idMenu, idDiv, focusClassName, enableHoverSwitch, defaultIndex) {
    defaultIndex = defaultIndex || 0;
    this._menu = document.getElementById(idMenu);
    this._content = document.getElementById(idDiv);
    this.tabs = [];
    this.enableHoverSwitch = false | enableHoverSwitch;

    this.switchTab = function(newTab) {
        this.current.hide();
        this.current = newTab;
        this.current.show();
    }

    function getChildren(elmt) {
        var elmts = [];
        var e = elmt.firstChild;
        while (e != null) {
            if (e.nodeType != 3) {
                elmts.push(e);
            }

            e = e.nextSibling;
        }
        return elmts;
    }

    var childrens = getChildren(this._menu); //.childNodes;
    var contents = getChildren(this._content); //.childNodes;
    if (contents.length != childrens.length)
        throw 'menu and content must ?';
    if (childrens.length > 0) {
        for (var i = 0; i < childrens.length; ++i) {
            var li = childrens[i];
            this.tabs.push(new Evlon.Tab(this, li, focusClassName, contents[i], this.enableHoverSwitch));
        }
        this.current = this.tabs[defaultIndex];
        this.current.show();
    }
}