tabstrip.htc

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

        if (cell.getAttribute("_type") == "tab")
        {
            cell.setAttribute("index", tabIndex, 0);
            tabIndex++;
        }
    }
}

//
// Fix the selected index when a tab was removed
//
function f_FixSelectedIndex()
{
    var numTabs = f_NumTabs();
    if (numTabs == 0)
    {
        if (_nSelectedIndex >= 0)
        {
            _nSelectedIndex = -1;
            f_FireIndexChangeEvent();
        }
        return;
    }

    if (_nSelectedIndex < 0)
        f_SetSelectedIndex(0);
    else if (_nSelectedIndex < numTabs)
    {
        var tab = f_GetTab(_nSelectedIndex);
        f_SetTabActive(tab);
    }
    else
        f_SetSelectedIndex(numTabs - 1);
}

//
// Removes an item from the tabstrip
//
function f_PublicRemoveItem(item)
{
    var renumber = false;
    var fixIndex = false;
    var fireIndexChange = false;
    var isTab = (item.getAttribute("_type") == "tab");
    if (isTab)
    {
        var itemIndex = item.getAttribute("index");
        if (itemIndex == _nSelectedIndex)
            fixIndex = true;
        else if (itemIndex < _nSelectedIndex)
        {
            _nSelectedIndex--;
            fireIndexChange = true;
        }

        renumber = true;
        _NumTabs--;
    }

    if (!_bHorizontal)
        item = item.parentElement;

    item.removeNode(true);

    if (renumber)
        f_RenumberTabs();

    if (fixIndex)
        f_FixSelectedIndex();
    else if (fireIndexChange)
    {
        f_FireIndexChangeEvent();
        f_NavigateMultiPage(f_GetTab(_nSelectedIndex));
    }

    f_NumItemsChanged();
    if (isTab)
        f_NumTabsChanged();
}

//
// Retrieves the contract object for an item
//
function f_PublicGetItem(index)
{
    if ((index < 0) || (index >= _Tabs.children.length))
        return null;

    var item = _Tabs.children[index];
    if (!_bHorizontal)
        item = item.children[0];

    return f_PublicMakeContract(item);
}

//
// Retrieves the contract object for a tab
//
function f_PublicGetTab(index)
{
    if ((index < 0) || (index >= _NumTabs))
        return null;

    return f_PublicMakeContract(f_GetTab(index));
}

//
// Creates a contract object for the item
//
function f_PublicMakeContract(item)
{
    var obj = new Object();

    obj.getType = function() { return item.getAttribute("_type"); };
    obj.remove = function() { f_PublicRemoveItem(item); };
    obj.getAttribute = function(name) { return f_PublicGetAttribute(item, name); };
    obj.setAttribute = function(name, value) { f_PublicSetAttribute(item, name, value); };

    return obj;
}

//
// Retrieves an attribute
//
function f_PublicGetAttribute(item, name)
{
    return item.getAttribute(name);
}

//
// Sets an an attribute
//
function f_PublicSetAttribute(item, name, value)
{
    var cacheImage;
    var lname = name.toLowerCase();

    if ((item.getAttribute("_type") == "tab") && ((lname == "tabindex") || (lname == "title")))
    {
        item = item.children[0];
    }

    if ((lname != "innertext") && (lname != "innerhtml") && (lname != "outerhtml"))
        item.setAttribute(name, value, 0);
    
    switch (lname)
    {
    case "defaultstyle":
    case "hoverstyle":
    case "selectedstyle":
        f_ApplyState(item, "redraw");
        break;

    case "defaultimageurl":
    case "hoverimageurl":
    case "selectedimageurl":
        cacheImage = new Image();
        cacheImage.src = value;
        f_ApplyState(item, "redraw");
        break;
        
    case "text":
    case "innertext":
        f_DoText(item, value);
        break;

    case "innerhtml":
        f_DoHTML(item, value);
        break;
    }
}

//
// Skips over links in tabs
//
function getContent(item)
{
    if (item.getAttribute("_type") == "tab")
        return item.children[0];

    return item;
}

//
// Changes the text in the item
//
function f_DoText(item, text)
{
    var content = getContent(item);
    f_RemoveTextNodes(item);
    var span = element.document.createElement("SPAN");
    span.innerText = text;
    content.appendChild(span);
}

//
// Changes the HTML in the item
//
function f_DoHTML(item, html)
{
    var content = getContent(item);

    f_RemoveTextNodes(item);
    var span = element.document.createElement("SPAN");
    span.innerHTML = html;
    content.appendChild(span);
}

//
// Removes nodes that would be replaced by a change to the text,
// innerText, or innerHTML properties.
//
function f_RemoveTextNodes(item)
{
    var content = getContent(item);

    if (content.hasChildNodes())
    {
        if (item.getAttribute("_spadded"))
            item.removeAttribute("_spadded");
        var index = (item.getAttribute("_imgadded") == null) ? 0 : 1;
        while (index < content.childNodes.length)
            content.childNodes[index].removeNode(true);
    }
}

//
// Fired when a node is clicked
//
function f_TabClick()
{
    if (_IsSubmitting)
        return;
    // Left mouse button and accessibility only
    if (event.button > 1)
        return;

    f_SetIndexByEvent();
}

//
// Fired when a node is hovered over
//
function f_TabOver()
{
    if (_IsSubmitting)
        return;

    var oNode = f_FindSurroundingCell(event.srcElement);
    if ((oNode == null) || oNode.contains(event.fromElement))
        return;

    if (oNode.isDisabled)
        return;

    var nIndex = oNode.getAttribute("index");
    if ((nIndex != null) && (nIndex != _nSelectedIndex))
    {
        if (oNode.getAttribute("_hover") == null)
        {
            if (_HoverIndex >= 0)
            {
                var oldTab = f_GetTab(_HoverIndex);
                if (oldTab != null)
                {
                    if (_HoverIndex != _nSelectedIndex)
                        f_SetTabInactive(oldTab);
                    oldTab.removeAttribute("_hover");
                }
            }

            f_SetTabHover(oNode);
            oNode.setAttribute("_hover", "true");

            _HoverIndex = nIndex;
        }
    }
}

//
// Fired when a node is "un"-hovered over
//
function f_TabOut()
{
    if (_IsSubmitting)
        return;

    var oNode = f_FindSurroundingCell(event.srcElement);
    if ((oNode == null) || oNode.contains(event.toElement))
        return;

    if (oNode.isDisabled)
        return;

    var nIndex = oNode.getAttribute("index");
    if ((nIndex != null) && (nIndex != _nSelectedIndex))
    {
        f_SetTabInactive(oNode);
        oNode.removeAttribute("_hover");
        
        if ((_HoverIndex >= 0) && (_HoverIndex != nIndex))
        {
            var oldTab = f_GetTab(_HoverIndex);
            if (oldTab != null)
            {
                if (_HoverIndex != _nSelectedIndex)
                    f_SetTabInactive(oNode);
                oNode.removeAttribute("_hover");
            }
        }

        _HoverIndex = -1;
    }
}

//
// Cancels an event
//
function f_CancelEvent()
{
    event.returnValue = false;
}

//
// Finds the surrounding TD of a node
//
function f_FindSurroundingCell(oNode)
{
    while (oNode != null)
    {
        if (oNode.getAttribute("_type") != null)
            return oNode;

        oNode = oNode.offsetParent;
    }

    return null;
}

//
// Given a tab index, returns the tab
//
function f_GetTab(index)
{
    var nIndex = f_ConvertIndexToNodeIndex(index);
    if (nIndex >= 0)
    {
        var oTab = _Tabs.children[nIndex];
        return _bHorizontal ? oTab : oTab.childNodes[0];
    }

    return null;
}

//
// Forces a redraw of the control
//
function f_Redraw()
{
    for (var nIndex = 0; nIndex < _Tabs.children.length; nIndex++)
    {
        var oNode = _Tabs.children[nIndex];
        if (!_bHorizontal)
            oNode = oNode.childNodes[0];

        f_ApplyState(oNode, "redraw");
    }
}

//
// Gets the tab index of a tab
//
function f_GetTabNodeIndex(tab)
{
    return f_ConvertIndexToNodeIndex(tab.getAttribute("index"));
}

//
// Converts an tab index to an index into the children collection
//
function f_ConvertIndexToNodeIndex(index)
{
    if ((index == null) || (index < 0) || (_Tabs == null) || (index >= _Tabs.children.length))
        return -1;

    for (var nIndex = 0; nIndex < _Tabs.children.length; nIndex++)
    {
        var oNode = _Tabs.children[nIndex];
        if (!_bHorizontal)
            oNode = oNode.childNodes[0];
        var attrIndex = oNode.getAttribute("index");
        if ((attrIndex != null) && (attrIndex == index))
            return nIndex;
    }

    return -1;
}

//
// Creates a CSS style string and does all the inheritance work.
//
// szState should be one of the following:
//      default
//      hover
//      selected
//
function f_CreateStyleString(tab, szState)
{
    var state = _StateVals[szState];
    var isTab = (tab.getAttribute("_type") == "tab");
    var localDefault = tab.getAttribute("defaultStyle");
    var local = tab.getAttribute(szState + "Style");
    var calcDefault;

    var builtInColor = element.style.color;
    if ((builtInColor == null) || (builtInColor == ""))
        builtInColor = ";color:buttontext";
    else
        builtInColor = "";

    if (isTab)
        calcDefault = _BuiltInTabDefaultStyle + builtInColor + ";" + tabDefaultStyle + ";" + localDefault + ";";
    else
        calcDefault = _BuiltInSepDefaultStyle + ";" + sepDefaultStyle + ";" + localDefault + ";";

    if (tab.isDisabled || element.isDisabled)
        calcDefault += "cursor:default" + ";";

    if (szState == "default")
        return calcDefault;

    var isHover = (szState == "hover");

    if (isTab && isHover)  // Tab, hover
    {
        return calcDefault + _BuiltInTabHoverStyle + ";" + tabHoverStyle + ";" + local;
    }
    else if (isTab)        // Tab, selected
    {
        return calcDefault + _BuiltInTabSelectedStyle + ";" + tabSelectedStyle + ";" + local;
    }
    else if (isHover)      // Separator, hover
    {
        return calcDefault + _BuiltInSepHoverStyle + ";" + sepHoverStyle + ";" + local;
    }
    else                   // Separator, selected
    {
        return calcDefault + _BuiltInSepSelectedStyle + ";" + sepSelectedStyle + ";" + local;
    }
}

//
// Creates an image url string and does all the inheritance work.
//
// szState should be one of the following:
//      default
//      hover
//      selected
//
function f_CreateImageUrl(tab, szState)
{
    var state = _StateVals[szState];
    var szLocal = tab.getAttribute(szState + "ImageUrl");
    if (szLocal != null)
        return szLocal;

    // If there was no hover or selected image, then load the default image
    szLocal = tab.getAttribute("defaultImageUrl");
    if (szLocal != null)
        return szLocal;

    if (tab.getAttribute("_type") == "tab")
        return null;

    if ((state == _StateHover) && (sepHoverImageUrl != null) && (sepHoverImageUrl != ""))
    {
        return sepHoverImageUrl;
    }
    else if ((state == _StateSelected) && (sepSelectedImageUrl != null) && (sepSelectedImageUrl != ""))
    {
        return sepSelectedImageUrl;
    }
    else if ((sepDefaultImageUrl != null) && (sepDefaultImageUrl != ""))
    {
        return sepDefaultImageUrl;
    }
    
    return null;
}

//