/******************************************************************************

    Table-based TreeView widget
    Copyright (c) 2008 by leemon
    
    requires jQuery library
    

* HTML:

<table id="mytree">
    <tr id="1" style="display:none;">
        <td><div class="folder" onClick="toggleRows(this)">This is folder</div></td>
        .....
    </tr>
    <tr id="1-1" style="display:none;">
        <td><div class="doc">And this is document</div></td>
        .....
    </tr>
</table>

* CSS:

.folder { background: url(images/folder-closed.gif)  no-repeat; float: left; padding-left: 30px; cursor:pointer; }
.doc { background: url(images/file.gif) no-repeat; float: left; padding-left: 30px; }

* IMAGES:

images/folder-open.gif
images/folder-closed.gif
images/file.gif

******************************************************************************/


function toggleRows(handle)
{
    var row   = $(handle).parents().filter("tr:first");
    var level = $(row).attr("id") + "-";
    
    // Are we expanding or contracting? If the first child is hidden, we expand
    var expanding = $(row).nextAll().filter("[id^=" + level + "]:first").css("display") == "none";
    
    var visible = document.all
        ? "block"       // Fucking IE
        : "table-row";  // Mozilla
    
    if (expanding)
        $(handle).removeClass("folder-closed").addClass("folder-open");
    else
        $(handle).removeClass("folder-open").addClass("folder-closed");
    
    var rows = $(row).nextAll().filter("[id^=" + level + "]");
    $(rows).each(
        function (index)
        {
            // When expanding, only expand one level.  Collapse all desendants.
            if (!expanding || $(this).attr("id").lastIndexOf("-") < level.length)
            {
                $(this).css("display", expanding ? visible : "none");
                $(this).find(".folder-open").removeClass("folder-open").addClass("folder-closed");
            }
        }
    );
}

function initTree(table)
{
    var visible = document.all
        ? "block"       // Fucking IE
        : "table-row";  // Mozilla
    
    $(table).children().children().filter("[id]").each(
        function ()
        {
            var nest = $(this).attr("id").split("-").length - 1;
            
            if (nest > 0)
            {
                $(this).find(".folder-open,.folder-closed,.doc").css("margin-left", 2 * nest + "em");
                $(this).hide();
            }
            else
                $(this).css("display", visible);
        }
    );
}

