function addTabEvent(element, ev, handler) {
    var doHandler = function (e) { return handler(e || window.event); };
    if (element.addEventListener) element.addEventListener(ev, doHandler, false);
    else if (element.attachEvent) element.attachEvent("on" + ev, doHandler);
}

function HideAll() {
    var pages = document.getElementById('tdMultiPage').getElementsByTagName('div');
    for (var i = 0; i < pages.length; i++) if (pages[i].getAttribute('ctype') == 'page') pages[i].style.display = 'none';
    var tabs = document.getElementById('tdTabStrip').getElementsByTagName('div');
    for (var i = 0; i < tabs.length; i++) {
        var tab = tabs[i];
        var eltype = tab.getAttribute('eltype');
        if (eltype == 'divider') {
            var elclass = 'div__ll';
            if (i == 0) elclass = 'div__el';
            else if (i == tabs.length - 1) elclass = 'div__le';
            tab.setAttribute('class', elclass);
            tab.setAttribute('className', elclass);
        }
        else {
            tab.setAttribute('status', 'low');
            tab.setAttribute('class', 'tabHotArea');
            tab.setAttribute('className', 'tabHotArea');
        }
    }
}

function ActivateTab(tabId, pageId, idx, tabCount) {
    if (document.getElementById('ctl00_MainContentHolder_hTab') != null) {
        document.getElementById('ctl00_MainContentHolder_hTab').value = idx;
    }
    HideAll();
    var tab = document.getElementById(tabId);
    var tabindex = parseInt(tab.getAttribute('tabindex'));
    var prevClass = 'div__lh', nextClass = 'div__hl';
    if (tabindex == 0 && tabCount == 1) { prevClass = 'div__eh'; nextClass = 'div__he'; }
    else if (tabindex == 0) prevClass = 'div__eh';
    else if (tabindex == tabCount - 1) nextClass = 'div__he';
    var prevDiv = document.getElementById('div__' + tabindex);
    var nextDiv = document.getElementById('div__' + (tabindex + 1));
    prevDiv.setAttribute('class', prevClass); prevDiv.setAttribute('className', prevClass);
    nextDiv.setAttribute('class', nextClass); nextDiv.setAttribute('className', nextClass);
    var page = document.getElementById(pageId);
    tab.setAttribute('class', 'tabHotArea_active');
    tab.setAttribute('className', 'tabHotArea_active');
    tab.setAttribute('status', 'high');
    page.style.display = 'block';
}

function HighLight(tabId, tabCount) {
    var tab = document.getElementById(tabId);
    if (tab.getAttribute('status') == 'high') return;
    var tabindex = parseInt(tab.getAttribute('tabindex'));
    var prevtab, nexttab, prevClass, nextClass;
    prevtab = document.getElementById(tab.getAttribute('ptab'));
    nexttab = document.getElementById(tab.getAttribute('ntab'));
    if (prevtab != null) if (prevtab.getAttribute('status') == 'high') prevClass = 'div__hv'; else prevClass = 'div__lv';
    if (nexttab != null) if (nexttab.getAttribute('status') == 'high') nextClass = 'div__vh'; else nextClass = 'div__vl';
    if (tabindex == 0 && tabCount == 1) { prevClass = 'div__ev'; nextClass = 'div__ve'; }
    else if (tabindex == 0) prevClass = 'div__ev';
    else if (tabindex == tabCount - 1) nextClass = 'div__ve';
    var prevDiv = document.getElementById('div__' + tabindex);
    var nextDiv = document.getElementById('div__' + (tabindex + 1));
    prevDiv.setAttribute('class', prevClass); prevDiv.setAttribute('className', prevClass);
    nextDiv.setAttribute('class', nextClass); nextDiv.setAttribute('className', nextClass);
    tab.setAttribute('class', 'tabHotArea_hover');
    tab.setAttribute('className', 'tabHotArea_hover');
}

function Disable(tabId, tabCount) {
    var tab = document.getElementById(tabId);
    if (tab.getAttribute('status') == 'high') return;
    var tabindex = parseInt(tab.getAttribute('tabindex'));
    var prevtab, nexttab, prevClass, nextClass;
    prevtab = document.getElementById(tab.getAttribute('ptab'));
    nexttab = document.getElementById(tab.getAttribute('ntab'));
    if (prevtab != null) if (prevtab.getAttribute('status') == 'high') prevClass = 'div__hl'; else prevClass = 'div__ll';
    if (nexttab != null) if (nexttab.getAttribute('status') == 'high') nextClass = 'div__lh'; else nextClass = 'div__ll';
    if (tabindex == 0 && tabCount == 1) { prevClass = 'div__el'; nextClass = 'div__le'; }
    else if (tabindex == 0) prevClass = 'div__el';
    else if (tabindex == tabCount - 1) nextClass = 'div__le';
    var prevDiv = document.getElementById('div__' + tabindex);
    var nextDiv = document.getElementById('div__' + (tabindex + 1));
    prevDiv.setAttribute('class', prevClass); prevDiv.setAttribute('className', prevClass);
    nextDiv.setAttribute('class', nextClass); nextDiv.setAttribute('className', nextClass);
    tab.setAttribute('class', 'tabHotArea');
    tab.setAttribute('className', 'tabHotArea');
}
