treeview.htc

浏览器端看到树型目录结构,用户可以完整地看到像windows资源管理器一样的效果

            break;
        case 32:    // spacebar
            var cb = oldNode.subtree.all.item("_cb", 0);
            if (cb != null)
            {
                cb.setAttribute("checked", !cb.getAttribute("checked"), 0);
                doCheckboxClick(oldNode);
                fireQueuedEvents();
            }
            event.returnValue = false;
            break;
        case 13:    // enter key
            doNodeClick(oldNode)
            if (!navigateNode(oldNode))
            {
                if (element.getAttribute("selectExpands") == true)
                    doNodePlusMinusClick(oldNode);
                fireQueuedEvents();
            }
            event.returnValue = false;
            break;
    }
}

//
// changeFocus()
//
function changeFocus(node, oldNode)
{
    var accessnode = node.subtree.all.item("_tnaccess", 0);
    accessnode.tabindex = 1;
    accessnode.focus();
    accessnode = oldNode.subtree.all.item("_tnaccess", 0);
    accessnode.tabindex = -1;
}

//
// updateStatus()
//
function updateStatus(node)
{
    var href = node.getAttribute("navigateurl");
    if (href != null)
        window.status = href;
    else
        window.status = window.defaultStatus;
}

//
// onstop
//
function onstop()
{
    g_numStop++;
    if (g_numStop >= 2)
    {
        g_bInteractive = true;
    }

    for (var i = 0; i < g_pendingBinds.length; i++)
    {
        if (g_pendingBinds[i] != null && g_pendingBinds[i].el != null)
            g_pendingBinds[i].el._bound = null;
    }
}

//
// onfocus
//
function onfocus()
{
    if (!g_bFocus)
    {
        dofocus();
    }
}

//
// dofocus
//
function dofocus()
{
    var node = null;
    g_bFocus = true;  // sometimes we just call dofocus() without going through onfocus()
    try
    {
        node = getNodeFromIndex(selectedNodeIndex);
    }
    catch (e)
    {
    }
    if (node != null)
    {
        var oItem = node.subtree.all.item("_tnaccess", 0);
        if (oItem != null)
        {
            if (g_bInteractive)
            {
                focusFilter(oItem);
                oItem.tabIndex = 1;
                if (!g_bMouseDown) // don't scroll the window when selecting a new node
                {
                    try
                    {
                        var prevScrollTop = element.scrollTop;
                        var prevScrollLeft = element.scrollLeft;

                        oItem.focus();

                        element.scrollTop = prevScrollTop;
                        element.scrollLeft = prevScrollLeft;
                    }
                    catch (e)
                    {
                    }
                }
            }
        }
    }

    node = null;
    try
    {
        node = getNodeFromIndex(HoverNodeIndex);
    }
    catch (e)
    {
    }

    if (node != null && g_bInteractive)
    {
        var oItem = node.subtree.all.item("_tnaccess", 0);
        if (oItem != null)
            focusFilter(oItem);
    }
}

//
// focusFilter
//
function focusFilter(oItem)
{
    if (oItem.id == "_tnaccess")
        oItem = oItem.all.item("_tntext", 0); 
    if (oItem.filters.length > 0)
    {
        var oFilter = oItem.filters.item("DXImageTransform.Microsoft.Alpha");
        if (oFilter)
        {
            oFilter.opacity *= 2;
        }
    }
}

//
// onblur
//
function onblur()
{
    var node = null;
    g_bFocus = false;
    try
    {
        node = getNodeFromIndex(selectedNodeIndex);
    }
    catch (e)
    {
    }

    if (node != null)
    {
        var oItem = node.subtree.all.item("_tnaccess", 0);
        if (oItem != null)
        {
            blurFilter(oItem);
            oItem.tabIndex = -1;
        }
    }

    node = null;
    try
    {
        node = getNodeFromIndex(HoverNodeIndex);
    }
    catch (e)
    {
    }
    if (node != null)
    {
        var oItem = node.subtree.all.item("_tnaccess", 0);
        if (oItem != null)
        {
            blurFilter(oItem);
            oItem.tabIndex = -1;
        }
    }    
    setHiddenHelperValue();
}

//
// blurFilter
//
// decreases alpha filter opacity on given node by 50%, adding one if needed
//
function blurFilter(oItem)
{
    if (oItem.id == "_tnaccess")
        oItem = oItem.all.item("_tntext", 0); 
    if (oItem.filters.length > 0)
    {
        var oFilter = oItem.filters.item("DXImageTransform.Microsoft.Alpha");
        if (oFilter)
        {
            oFilter.opacity /= 2;
            return;
        }
    }
    oItem.style.filter += "progid:DXImageTransform.Microsoft.Alpha(opacity=50,style=0)";
}

//
// oncontentready
//
// oncontentready handler for the TREEVIEW element.  Initializes the tree.
//
function oncontentready()
{
    if (element.document.parentWindow.name.indexOf("__hifSmartNav") == 0)
        return; // don't run script in SmartNav's IFrame
 
    g_styles = new Object();
    var strFont = "font: " + L_fontSize_Text + " " + L_fontName_Text + "; ";
    g_styles["parent"] = strFont + "text-decoration: none; color: black; overflow:hidden;";
    g_styles["child"] = strFont + "overflow:hidden;";
    g_styles["defaultstyle"] = strFont + "display:inline-block; color: black; text-decoration:none; cursor: hand; overflow:hidden;";
    g_styles["hoverstyle"] = "color: highlighttext; background-color:highlight; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50,style=0);";
    g_styles["selectedstyle"] = "color: highlighttext; background-color:highlight;";
    g_styles["icon"] = "cursor:hand;";
    
    if (element.style.overflowX == "");
        element.style.overflowX = "auto";
    
    //
    // Set treeview attributes to boolean
    //
    verifyBooleanAttribute(element, "showPlus");
    if (element.getAttribute("showPlus") == false && element.getAttribute("selectExpands") == null)
        element.setAttribute("selectExpands", true, 0);
    verifyBooleanAttribute(element, "selectExpands");
    verifyBooleanAttribute(element, "autoSelect");
    verifyBooleanAttribute(element, "showLines");
    verifyBooleanAttribute(element, "showToolTip");
    
    var systemImagesPath = element.getAttribute("SystemImagesPath");
    if (systemImagesPath == null)
        element.setAttribute("SystemImagesPath", "treeimages/", 0);
    else if (systemImagesPath.charAt(systemImagesPath.length - 1) != '/')
        element.setAttribute("SystemImagesPath", systemImagesPath + '/', 0);
    if (isRtl())
    {
        element.setAttribute("SystemImagesPath", element.getAttribute("SystemImagesPath") + "rtl/", 0);
    }
    
    // Create div for parsing content
    contentNode = element.document.createElement("treeview");
    contentNode.innerHTML = element.innerHTML;
    
    element.tabIndex=0;
    element.attachEvent("onkeydown", onkeydown);
    element.attachEvent("onfocus", onfocus);
    element.attachEvent("onblur", onblur);
    f_AddStopEvent();
    element.hideFocus = true;

    if (element.getAttribute("selectedNodeIndex") == null)
        prop_selectedNodeIndex = "";

    if (element.getAttribute("HoverNodeIndex") == null)
        element.setAttribute("HoverNodeIndex", "", 0);
           
    // Create nodeTypes collection on the element
    if (element.getAttribute("TreeNodeTypeSrc") == null)
    {
        element.nodeTypes = contentNode.children.tags("TREENODETYPE");
        verifyTypeValues();
        g_bTypesReady = true;
    }
    else
        databindTypes();

    if (treeNodeSrc != null)
    {
        if (element.nodeTypes != null)
        {
            contentNode.innerHTML = getNodeTypeHtml();
            element.nodeTypes = contentNode.children.tags("TREENODETYPE");
        }
        else
            contentNode.innerHTML = "";
        databindNode(element);
    }
    else
    {
        g_bNodesReady = true;
        tryToBuildTreeFromRoot();
    }
}

//
// ondocumentready()
//
function ondocumentready()
{
    if (element.document.parentWindow.name.indexOf("__hifSmartNav") == 0)
        return; // don't run script in SmartNav's IFrame

    f_CleanupEvents();

    g_strQueuedEvents = "";

    if (HoverNodeIndex.length > 0)
        HoverNode(getNodeFromIndex(HoverNodeIndex));

    g_bInteractive = true;

    if (element.getAttribute("Focused") != null)
        dofocus();
    else
        onblur();

    var newScrollTop = element.getAttribute("__scrollTop");
    var newScrollLeft = element.getAttribute("__scrollLeft");
    if (newScrollTop != null)
        element.scrollTop = newScrollTop;
    if (newScrollLeft != null)
        element.scrollLeft = newScrollLeft;

    var parent = element.offsetParent;
    if (parent != null)
    {
        var newParentTop = element.getAttribute("__parentTop");
        var newParentLeft = element.getAttribute("__parentLeft");
        if (newParentTop != null)
            parent.scrollTop = newParentTop;
        if (newParentLeft != null)
            parent.scrollLeft = newParentLeft;
    }
    
    // verify selectedNodeIndex
    if (getNodeFromIndex(selectedNodeIndex) == null)
    {
        if (getNodeFromIndex("0") != null)
            selectedNodeIndex = "0";
        else
            selectedNodeIndex = "";
    }    
}

//
// changeIcon(node, imageUrl)
//
// Change the icon to the given Url.  If the Url isn't found, don't change anything.  The exception
// is if we try to set the icon to an unspecified ExpandedImageUrl, we instead show the ImageUrl.
//

function changeIcon(node, imageUrl)
{
    var icon1;
    var imageUrlLC = imageUrl.toLowerCase();
    var textnode = node.subtree.all("_tntext", 0);
    var accessnode = node.subtree.all("_tnaccess", 0);
    var spacer = accessnode.previousSibling;
    if (spacer != null)
    {   
        icon1 = spacer.previousSibling;
        if (icon1 != null && icon1.id != "_nodeicon")   
            icon1 = null; 
    }
    else
        icon1 = null;
    var newSrc = getNodeAttribute(node, imageUrlLC);
    
    if (newSrc != null && icon1 == null)
    {
        // node's ImageUrl attribute was not defined, so there is no icon.  Make one.
        icon1 = node.document.createElement("<IMG align='absmiddle' border='0' class='icon' id='_nodeicon' >");
        icon1.src = newSrc;
        accessnode.parentElement.insertBefore(icon1, accessnode);
        // don't forget the spacer
        spacer = node.document.createElement("<SPAN>");
        spacer.style.width = 5;
        accessnode.parentElement.insertBefore(spacer, accessnode);        
    }
    else if (newSrc != null)
    {
        icon1.src = newSrc;
        icon1.style.display = "inline";
    }
    else if (imageUrlLC == "imageurl")
    {
        if (icon1 != null)
        {
            // If the node's ImageUrl isn't defined, we don't want to leave a selected or expanded icon showing.  Hide it.
            icon1.style.display = "none";
        }
    }
    else if (imageUrlLC == "selectedimageurl" && node.getAttribute("expanded") == true)
        changeIcon(node, "expandedimageurl");
    else 
        changeIcon(node, "imageurl");
    if (icon1 != null)
    {
        icon1.style.cursor = textnode.style.cursor;
        spacer.style.cursor = textnode.style.cursor;
    }
}   

//
// selectNode(node)
//
// Make node the selected node, unselecting the previously selected node.
//
// node: node to select
// delay: TRUE to delay event firing (used on keyboard nav with autoselect=true)
//
function selectNode(node, delay)
{
    var nodeIndex;
    var selectedNode = null;
    var strImage;
    var oItem;
    var oOldItem = null;

    if (node && node.subtree == null)
        node = getNodeFromIndex("0"); // can't select a node that hasn't been built; select root instead      
        
    nodeIndex = getNodeIndex(node);
    if (selectedNodeIndex != nodeIndex)