// Erco's tree widget
// (C) Copyright Greg Ercolano 2005. All Rights Reserved.
// 1.00 erco@seriss.com 04/26/2005
//
// 2 Char Label Prefixes:
//     "| "   'I' (i.png)
//     "|-"   'T' (t.png)
//     "|_"   'L' (l.png)
//     "  "   'X' (x.png)
//
// Allowed Label 'node' types:
//     "+ "  a folder (open by default)    (folder.png)
//     "x "  a folder (closed by default)  (folder.png)
//     "> "  a document                    (doc.png)
//
// Special actions:
//     "<open>"       -- when user clicks label, tree expands
//

/********************************************* EXAMPLE
Label                        Action
------------------------     -----------------
var tree1 = [
   "Main",                   "", 
   "|-+ Sub 1.0.0",          "foo-1.0.0.html   target=CONTENTS",
   "| |-> Sub 1.1.0",        "foo-1.1.0.html   target=CONTENTS",
   "| |_+ Sub 1.2.0",        "foo-1.2.0.html   target=CONTENTS",
   "|   |-> Sub 1.2.1",      "foo-1.2.1.html   target=CONTENTS",
   "|   |-x Sub 1.2.2",      "foo-1.2.1.html   target=CONTENTS",	// closed by default (x)
   "|   | |_> Sub 1.2.2.0",  "foo-1.2.2.0.html target=CONTENTS",
   "|   |",                  "",					// (vertical space is optional)
   "|   |_> Sub 1.2.3",      "foo-1.2.2.html   target=CONTENTS",
   "|",                      "",					// (vertical space is optional)
   "|_+ Sub 2.0.0",          "foo-2.0.0.html   target=CONTENTS",
   "  |-+ Sub 2.1.0",        "foo-2.1.0.html   target=CONTENTS",
   "  | |-> Sub 2.1.1",      "foo-2.1.1.html   target=CONTENTS",
   "  | |_> Sub 2.1.2",      "foo-2.1.2.html   target=CONTENTS",
   "  |-+ Sub 2.2.0",        "<open>",					// click label to open
   "  | |-> Sub 2.2.1",      "foo-2.1.1.html   target=CONTENTS",
   "  | |_> Sub 2.2.2",      "foo-2.1.2.html   target=CONTENTS",
   "  |-> Sub 2.3.0",        "foo-2.2.0.html   target=CONTENTS",
   "  |_> Sub 2.4.0",        "foo-2.3.0.html   target=CONTENTS",
];

Tree2Html(tree1);	// generates the HTML for the above..

********************************************************/

// global variable -- must be a running variable, different for each tree
var div_id = 0;

// Parse the tree, and generate HTML output
function Tree2Html(tree)
{
    var level = 0;
    var lastlevel = 0;

    // Parse each record from the tree
    for ( var t = 0; (t+1) < tree.length; t += 2 )
    {
	var out = "";
	var post = "";

        var txt = tree[t+0];
	var act = tree[t+1];

	var act_on  = "";
	var act_off = "";

	// Parse 2 character fields from the 'Label'
	for ( level = 0; 1; level++ )
	{
	    var ss = txt.substr(0,2);

	    // Various versions of 'Indent'
	    if ( ss == "| " || ss == "|" )
	    {
		out += '<img src="etree/i.png" align=absmiddle>';
		txt = txt.substr(2);
	    }
	    else if ( ss == "|-" )
	    {
		out += '<img src="etree/t.png" align=absmiddle>';
		txt = txt.substr(2);
	    }
	    else if ( ss == "|_" )
	    {
		out += '<img src="etree/l.png" align=absmiddle>';
		txt = txt.substr(2);
	    }
	    else if ( ss == "  " )
	    {
		out += '<img src="etree/x.png" align=absmiddle>';
		txt = txt.substr(2);
	    }
	    else if ( ss == "+ " || ss == "x " )
	    {
	        // Folder?
		//    o Set 'onclick' (and dblclick) behavior to call Toggle()
		//    o Set mouse to pointer during hover
		//    o Add new '<div>' for entries that follow this one
		//
		div_id++;
		out += '<img src="etree/plus.png" align=absmiddle border=0 '+
		       'style=cursor:pointer '+
		       'onclick="Toggle(\'etree-'+div_id+'\')" ' +
		       'ondoubleclick="Toggle(\'etree-'+div_id+'\')">' +
		       '<img src="etree/folder.png" align=absmiddle border=0>';
		post = '<div id="etree-'+div_id+'"' + (( ss == "x ") ? 'style="display:none">': '>');
		if ( act == "<open>" )
		{
		    act_on = '<font "" ' +
			     'style=cursor:pointer '+
			     'onclick="Toggle(\'etree-'+div_id+'\')" ' +
			     'ondoubleclick="Toggle(\'etree-'+div_id+'\')">';
		    act_off = '</font>';
		}
		else
		{
		    act_on  = '<a href='+act+
			     ' onclick="Open(\'etree-'+div_id+'\')" ' +
			     ' ondoubleclick="Open(\'etree-'+div_id+'\')">';
		    act_off = '</a>';
		}
		txt = txt.substr(2);
		break;
	    }
	    else if ( ss == "> " )
	    {
	        // Document icon with href
		if ( act != "" )
		{
		    act_on  = '<a href='+act+'>';
		    act_off = '</a>';
		    out    += act_on + '<img src="etree/doc.png" align=absmiddle border=0>' + act_off;
		}
		txt = txt.substr(2);
		break;
	    }
	    else 
	    {
	        if ( level == 0 )
		{
		    out += '<img src="etree/xvert.png" align=absmiddle border=0>';
		}
	        break;
	    }
	}

	// Decreased a level? Close <div>'s
	if ( level < lastlevel )
	{
	    for ( var i = 0; i < ( lastlevel - level ); i++ )
		{ out = '</div>' + out; }
	}

	if ( act == "" )
	    { out += ' ' + txt; }			// label without action
	else
	    { out += ' ' + act_on + txt + act_off; }	// label with action

	// Write the HTML
	document.write(out);
	// document.write(" [LL="+lastlevel+", L="+level+" ]");	// debug
	document.write("<br>\n");
	document.write(post);		// prefix for /next/ line (if any)

	lastlevel = level;
    }

    // Finish off any leftover 'div's
    if ( level > 0 )
    {
	for ( var i = 0; i < level; i++ )
	    { document.write('</div>\n'); }
    }
}

// Open all folders
function OpenAll()
{
    for ( var id=1; id<=div_id; id++ )
    {
        var idstr = 'etree-' + id;
	var divo = document.getElementById(idstr);
	divo.style.display = '';
    }
}

// Close all folders
function CloseAll()
{
    for ( var id=1; id<=div_id; id++ )
    {
        var idstr = 'etree-' + id;
	var divo = document.getElementById(idstr);
	divo.style.display = 'none';
    }
}

// Open the folder
function Open(name)
{
    var divo = document.getElementById(name);
    divo.style.display = '';
}

// Toggle the folder to open/close
function Toggle(name)
{
    var divo = document.getElementById(name);
    // alert('display="'+divo.style.display+'"');	// debug
    divo.style.display = ( divo.style.display == '' ) ? 'none' : '';
}