dommenu.js

j2ee源码

    var distributeRatio = Math.round(100/container.data.items['numChildren']) + '%';

    // the first menu is the rootMenu, which is a child of the zero level element
    var rootMenu = document.createElement('div');
    rootMenu.id = in_containerId + '[0]';
    rootMenu.className = settings.items['menuBarClass'];
    container.data.setItem('subMenu', rootMenu);

    var rootMenuTable = rootMenu.appendChild(document.createElement('table'));
    if (domMenu_isKonq) {
        rootMenuTable.cellSpacing = 0;
    }

    rootMenuTable.style.border = 0;
    rootMenuTable.style.borderCollapse = 'collapse';
    rootMenuTable.style.width = settings.items['menuBarWidth'];
    var rootMenuTableBody = rootMenuTable.appendChild(document.createElement('tbody'));

    var numSiblings = container.data.items['numChildren'];
    for (var index = 1; index <= numSiblings; index++) {
        // create a row the first time if horizontal or each time if vertical
        if (index == 1 || settings.items['axis'] == 'vertical') {
            var rootMenuTableRow = rootMenuTableBody.appendChild(document.createElement('tr'));
        }

        // create an instance of the root level menu element
        var rootMenuTableCell = rootMenuTableRow.appendChild(document.createElement('td'));
        rootMenuTableCell.style.padding = 0;
        rootMenuTableCell.id = in_containerId + '[' + index + ']';
        // add element to list of parent children
        container.data.items['childElements'].setItem(rootMenuTableCell.id, rootMenuTableCell);

        // assign the settings to the root level element
        // {!} this is a problem if two menus are using the same data {!}
        rootMenuTableCell.data = data.items[index];
        rootMenuTableCell.data.merge(new domMenu_Hash(
            'basename', in_containerId,
            'parentElement', container,
            'numChildren', rootMenuTableCell.data.numericLength,
            'childElements', new domMenu_Hash(),
            'offsets', new domMenu_Hash(),
            'level', container.data.items['level'] + 1,
            'index', index
        ));

        // assign the styles
        rootMenuTableCell.style.cursor = 'default';
        if (settings.items['axis'] == 'horizontal') {
            if (settings.items['distributeSpace']) {
                rootMenuTableCell.style.width = distributeRatio;
            }
        }

        var rootElement = rootMenuTableCell.appendChild(document.createElement('div'));
        rootElement.className = settings.items['menuElementClass'];
        // fill in the menu element contents
        rootElement.innerHTML = '<span>' + rootMenuTableCell.data.items['contents'] + '</span>' + (rootMenuTableCell.data.hasItem('contentsHover') ? '<span style="display: none;">' + rootMenuTableCell.data.items['contentsHover'] + '</span>' : '');

        // attach the events
        rootMenuTableCell.onmouseover = function(in_event) { domMenu_openEvent(this, in_event, settings.items['openMouseoverMenuDelay']); };
        rootMenuTableCell.onmouseout = function(in_event) { domMenu_closeEvent(this, in_event); };

        if (settings.items['openMousedownMenuDelay'] >= 0 && rootMenuTableCell.data.items['numChildren']) {
            rootMenuTableCell.onmousedown = function(in_event) { domMenu_openEvent(this, in_event, settings.items['openMousedownMenuDelay']); };
            // cancel mouseup so that it doesn't propogate to global mouseup event
            rootMenuTableCell.onmouseup = function(in_event) { var eventObj = domMenu_isIE ? event : in_event; eventObj.cancelBubble = true; };
            if (domMenu_isIE) {
                rootMenuTableCell.ondblclick = function(in_event) { domMenu_openEvent(this, in_event, settings.items['openMousedownMenuDelay']); };
            }
        }
        else if (rootMenuTableCell.data.items['uri']) {
            rootMenuTableCell.style.cursor = domMenu_pointerStyle;
            rootMenuTableCell.onclick = function(in_event) { domMenu_resolveLink(this, in_event); };
        }

        // prevent highlighting of text
        if (domMenu_isIE) {
            rootMenuTableCell.onselectstart = function() { return false; };
        }

        rootMenuTableCell.oncontextmenu = function() { return false; };
    }

    // add the menu rootMenu to the zero level element
    rootMenu = container.appendChild(rootMenu);

    // even though most cases the top level menu does not go away, it could
    // if this menu system is used by another process
    domMenu_detectCollisions(rootMenu);
}

// }}}
// {{{ domMenu_activateSubMenu()

function domMenu_activateSubMenu(in_parentElement)
{
    // see if submenu already exists
    if (in_parentElement.data.hasItem('subMenu')) {
        domMenu_toggleSubMenu(in_parentElement, 'visible');
        return;
    }

    var settings = domMenu_settings.items[in_parentElement.data.items['basename']];

    // build the submenu
    var menu = document.createElement('div');
    menu.id = in_parentElement.id + '[0]';
    menu.className = settings.items['subMenuBarClass'];
    menu.style.zIndex = settings.items['baseZIndex'];
    menu.style.position = 'absolute';
    // position the menu in the upper left corner hidden so that we can work on it
    menu.style.visibility = 'hidden';
    menu.style.top = 0;
    menu.style.left = 0;

    in_parentElement.data.setItem('subMenu', menu);

    var menuTable = menu.appendChild(document.createElement('table'));
    // ** opera wants to make absolute tables width 100% **
    if (domMenu_isOpera) {
        menuTable.style.width = '1px';
        menuTable.style.whiteSpace = 'nowrap';
    }

    if (domMenu_isKonq) {
        menuTable.cellSpacing = 0;
    }

    menuTable.style.border = 0;
    menuTable.style.borderCollapse = 'collapse';
    var menuTableBody = menuTable.appendChild(document.createElement('tbody'));

    var numSiblings = in_parentElement.data.items['numChildren'];
    for (var index = 1; index <= numSiblings; index++) {
        var dataIndex = in_parentElement.data.items['level'] == 1 && settings.items['verticalExpand'] == 'north' && settings.items['axis'] == 'horizontal' ? numSiblings + 1 - index : index;
        var menuTableCell = menuTableBody.appendChild(document.createElement('tr')).appendChild(document.createElement('td'));
        menuTableCell.style.padding = 0;
        menuTableCell.id = in_parentElement.id + '[' + dataIndex + ']';

        // add element to list of parent children
        in_parentElement.data.items['childElements'].setItem(menuTableCell.id, menuTableCell);

        // assign the settings to nth level element
        menuTableCell.data = in_parentElement.data.items[dataIndex];
        menuTableCell.data.merge(new domMenu_Hash(
            'basename', in_parentElement.data.items['basename'],
            'parentElement', in_parentElement,
            'numChildren', menuTableCell.data.numericLength,
            'childElements', new domMenu_Hash(),
            'offsets', new domMenu_Hash(),
            'level', in_parentElement.data.items['level'] + 1,
            'index', index
        ));

        // assign the styles
        var parentStyle = in_parentElement.data.items['level'] == 1 ? in_parentElement.parentNode.style : in_parentElement.style;
        menuTableCell.style.cursor = 'default';

        var element = menuTableCell.appendChild(document.createElement('div'));
        var outerElement = element;
        outerElement.className = settings.items['subMenuElementClass'];

        if (menuTableCell.data.items['numChildren']) {
            element = outerElement.appendChild(document.createElement('div'));
            // {!} depends on which way we are opening {!}
            element.style.backgroundImage = 'url(arrow.gif)';
            element.style.backgroundRepeat = 'no-repeat';
            element.style.backgroundPosition = 'right center';
            // add appropriate padding to fit the arrow
            element.style.paddingRight = '12px';
        }

        // fill in the menu item contents
        element.innerHTML = menuTableCell.data.items['contents'];

        // attach the events
        menuTableCell.onmouseover = function(in_event) { domMenu_openEvent(this, in_event, settings.items['openMouseoverSubMenuDelay']); };
        menuTableCell.onmouseout = function(in_event) { domMenu_closeEvent(this, in_event); };

        if (settings.items['openClickSubMenuDelay'] >= 0 && menuTableCell.data.items['numChildren']) {
            menuTableCell.onmousedown = function(in_event) { domMenu_openEvent(this, in_event, settings.items['openClickSubMenuDelay']); };
            menuTableCell.onmouseup = function(in_event) { var eventObj = domMenu_isIE ? event : in_event; eventObj.cancelBubble = true; };
            if (domMenu_isIE) {
                menuTableCell.ondblclick = function(in_event) { domMenu_openEvent(this, in_event, settings.items['openClickSubMenuDelay']); };
            }
        }
        else if (menuTableCell.data.items['uri']) {
            menuTableCell.style.cursor = domMenu_pointerStyle;
            menuTableCell.onclick = function(in_event) { domMenu_resolveLink(this, in_event); };
        }
        else if (!menuTableCell.data.items['numChildren']) {
            outerElement.className += ' ' + settings.items['subMenuElementHeadingClass'];
        }

        // prevent highlighting of text
        if (domMenu_isIE) {
            menuTableCell.onselectstart = function() { return false; };
        }

        menuTableCell.oncontextmenu = function() { return false; };
    }

    menu = document.body.appendChild(menu);
    domMenu_toggleSubMenu(in_parentElement, 'visible');
}

// }}}
// {{{ domMenu_changeActivePath()

/**
 * Close the old active path up to the new active element
 * and return the value of the new active element (or the same if unchanged)
 * If the new active element is not set, the top level is assumed
 *
 * @return mixed new active element or false if not set
 */
function domMenu_changeActivePath(in_newActiveElement, in_oldActiveElement, in_closeDelay)
{
    // protect against crap
    if (!in_oldActiveElement && !in_newActiveElement) {
        return false;
    }

    // cancel open timeouts since we know we are opening something different now
    for (var i in domMenu_timeouts['open'].items) {
        domMenu_cancelTimeout(i, 'open');
    }

    // grab some info about this menu system
    var basename = in_oldActiveElement ? in_oldActiveElement.data.items['basename'] : in_newActiveElement.data.items['basename'];
    var settings = domMenu_settings.items[basename];

    // build the old and new paths
    var oldActivePath = new domMenu_Hash();
    if (in_oldActiveElement) {
        var tmp_oldActivePathElement = in_oldActiveElement;
        do {
            oldActivePath.setItem(tmp_oldActivePathElement.id, tmp_oldActivePathElement);
        } while ((tmp_oldActivePathElement = tmp_oldActivePathElement.data.items['parentElement']) && tmp_oldActivePathElement.id != basename);

        // unhighlight the old active element if it doesn't have children open
        if (!in_oldActiveElement.data.items['subMenu'] || in_oldActiveElement.data.items['subMenu'].style.visibility == 'hidden') {
            domMenu_toggleHighlight(in_oldActiveElement, false);
        }
    }

    var newActivePath = new domMenu_Hash();
    var intersectPoint;
    if (in_newActiveElement) {
        var actualActiveElement = in_newActiveElement;
        window.status = in_newActiveElement.data.items['statusText'] + ' ';

        // in the event we have no old active element, just highlight new one and return
        // without setting the new active element (handled later)
        if (!in_oldActiveElement) {
            domMenu_cancelTimeout(in_newActiveElement.id, 'close');
            domMenu_toggleHighlight(in_newActiveElement, true);
            return false;
        }
        // if the new element is in the path of the old element, then pretend event is
        // on the old active element
        else if (oldActivePath.hasItem(in_newActiveElement.id)) {
            in_newActiveElement = in_oldActiveElement;
        }

        var tmp_newActivePathElement = in_newActiveElement;
        do {
            // if we have met up with the old active path, then record merge point
            if (!intersectPoint && oldActivePath.hasItem(tmp_newActivePathElement.id)) {
                intersectPoint = tmp_newActivePathElement;
            }

            newActivePath.setItem(tmp_newActivePathElement.id, tmp_newActivePathElement);
            domMenu_cancelTimeout(tmp_newActivePathElement.id, 'close');
            // {!} this is ugly {!}
            if (tmp_newActivePathElement != in_oldActiveElement || actualActiveElement == in_oldActiveElement) {
                domMenu_toggleHighlight(tmp_newActivePathElement, true);
            }
        } while ((tmp_newActivePathElement = tmp_newActivePathElement.data.items['parentElement']) && tmp_newActivePathElement.id != basename);

        // if we move to the child of the old active element
        if (in_newActiveElement.data.items['parentElement'] == in_oldActiveElement) {
            return in_newActiveElement;
        }
        // if the new active element is in the old active path
        else if (in_newActiveElement == in_oldActiveElement) {
            return in_newActiveElement;
        }

        // find the sibling element
        var intersectSibling;
        if (intersectPoint) {
            for (var i in oldActivePath.items) {
                if (oldActivePath.items[i].data.items['parentElement'] == intersectPoint) {
                    intersectSibling = oldActivePath.items[i];
                    break;
                }
            }