<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<!-- Template: Copyright, ZZEE, 2001-2005. All rights reserved. -->
<!-- Only registered users of ZZEE Art HTML Listing can use the template
and javascript code contained in their projects. Any other use is prohibited. -->

<head>
<title>Menu</title>
<meta name="generator" content="ZZEE Art HTML Listing" />
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />

<style type="text/css">
<!--
    td.im 
    {
		font-family: "Times New Roman";
		font-size: 9pt;
        background: #e3e3e3;
        color: #000000;
        border: 1px solid #cccccc; 
        height: 30px;
        width:240px;
        padding: 0px;
        margin: 2px;
    }
    td.fol
    {
		font-family: "Times New Roman";
		font-size: 9pt;
        background: #e3e3e3;
        color: #000000;
        border: 1px solid #cccccc; 
        height: 30px;
        width:240px;
        padding: 0px;
        margin: 2px;
        background-image: url('<!--#echo var='image_dir'-->trRight.gif');
        background-repeat: no-repeat;
        background-position: right center;
    }
    table.mitable
    {
        border: 1px solid #808080;
        background: #ffffff;
        table-layout: fixed;
        width:244px;
    }
	a, a:visited {color: #000000; text-decoration: none;}
	a:hover {color: #ffffff; text-decoration: none;}
-->
</style>

<script type="text/javascript">
<!--

function markIt(it)
{
    it.style.background = '#000080';
    it.style.color = '#ffffff';
    if (it.className == 'fol')
    {
        it.style.backgroundImage = "url('<!--#echo var='image_dir'-->trRightI.gif')";
        it.style.backgroundRepeat = "no-repeat";
        it.style.backgroundPosition = 'right center';
    }
}

function unMarkIt(it)
{
    it.style.background = '#e3e3e3';
    it.style.color = '#000000';
    if (it.className == 'fol')
    {
        it.style.backgroundImage = "url('<!--#echo var='image_dir'-->trRight.gif')";
        it.style.backgroundRepeat = "no-repeat";
        it.style.backgroundPosition = 'right center';
    }
}

function imov(it)
{
    markIt(it);
}

function imou(it)
{
    var i;
    for (i = 0; i < marked.length; i++)
    {
        if (marked[i] == it) return;
    }
    unMarkIt(it);
}

function getLeft(td)
{
    var left = td.offsetLeft;
    var el = td;
    while (el = el.offsetParent) left += el.offsetLeft;
    return left;
}

function getTop(td)
{
    var top = td.offsetTop;
    var el = td;
    while (el = el.offsetParent) top += el.offsetTop;
    return top;
}


var boxes = new Array(0);

var itemURLs = new Array(0);
var itemNums = new Array(0);
var i = 0;
<!--#for var="tree" --><!--#if var="real" --><!--#if var="isdir"--><!--#if var="size"-->
itemURLs[i] = '<!--#echo var='relurl' -->';
itemNums[i] = <!--#echo var='counter' -->;
i++;<!--#endif--><!--#endif--><!--#endif var="real"--><!--#endfor-->

var boxURLs = new Array(0);
var boxNums = new Array(0);
i = 0;
<!--#for var="tree" --><!--#if var="recurse" -->
boxURLs[i] = '<!--#echo var='relurl' -->';
boxNums[i] = <!--#echo var='counter' -->;
i++;<!--#endif--><!--#endfor-->

var pr1 = "td";
var pr2 = "div";

function item2Box(itemID)
{
    var id = 0 + itemID.substring(pr1.length);

    var i;
    for (i = 0; i < itemNums.length; i++)
    {
        if (id == itemNums[i]) break;
    }
    if (i >= itemNums.length) return 0;

    var url = itemURLs[i];

    for (i = 0; i < boxURLs.length; i++)
    {
        if (url == boxURLs[i]) break;
    }
    if (i >= boxURLs.length) return 0;

    return (pr2 + boxNums[i]); 
}

function box2Item(boxID)
{
    var id = 0 + boxID.substring(pr2.length);

    var i;
    for (i = 0; i < boxNums.length; i++)
    {
        if (id == boxNums[i]) break;
    }
    if (i >= boxNums.length) return 0;

    var url = boxURLs[i];

    for (i = 0; i < itemURLs.length; i++)
    {
        if (url == itemURLs[i]) break;
    }
    if (i >= itemURLs.length) return 0;

    return (pr1 + itemNums[i]); 
}

var expanded = new Array(0);
var marked = new Array(0);

function subExp(td)
{
    var i, j;    

    if (td.id == '') return true;

    var left = getLeft(td) + td.offsetWidth;
    var top = getTop(td);

    var divid = item2Box(td.id);
    if (!divid) return true;
    var div = document.getElementById(divid);
    if (!div) return true;

    div.style.visibility = 'visible';
    div.style.position = 'absolute';
    div.style.left = left;
    div.style.top = top;
    // alternative
    var val = "visibility:visible; position:absolute; left:" + left + "px; top:" + top + "px; visibility:visible;";
    div.setAttribute('style', val);

    expanded.length = 0;
    expanded[0] = div;
    var markedOld = new Array(marked.length);
    for (i = 0; i < marked.length; i++)
        markedOld[i] = marked[i];
    marked.length = 0;
    marked[0] = td;

    var parent = getParentDiv(td);
    for (i = 1; parent; i++)
    {
        expanded[i] = parent;

        var cell = 0;
        if (parent.id != '')
        {
            cell = box2Item(parent.id);
            if (cell) cell = document.getElementById(cell);
        }
        if (cell)
        {
            parent = getParentDiv(cell);
            marked[i] = cell;
        }
        else parent = 0;
    } 

    for (i = markedOld.length; i; )
    {
        // XHTML doesn't validate when "i minus minus" is used :)
        // I had to remake everything :(
        i -= 1; 
        for (j = marked.length; j; )
        {
            j -= 1;
            if (markedOld[i] == marked[j])
            {
                j = 1; 
                break;
            }
        }
        if (j > 0) continue;
        unMarkIt(markedOld[i]);
    }
    markIt(td);
     
    return false;
}

function getParentDiv(td)
{
    var el = td.parentNode;
    for (; el; el = el.parentNode)
    {
        if (el.tagName.toLowerCase() == 'div') return el;
    }
    return 0;
}

function hideBox(id)
{
    var div = document.getElementById(id);
    if (!div) return;
    div.style.visibility = 'hidden';
    div.style.position = 'absolute';
}

function bodyClick()
{
    var i,j;
    if (!boxes.length)
    {
        for (i = 0; i < boxNums.length; i++)
        {
            var div = document.getElementById("div" + boxNums[i]);
            boxes[i] = div;
        }
    }

    for(i = boxes.length; i; )
    {
        i -= 1;
        var div = boxes[i];
        j = expanded.length;
        while (j)
        {
            j -= 1;
            if (div == expanded[j])
            {
                j = 1;
                break;
            }
        }
        if (j > 0) continue;
        if (div) div.style.visibility = 'hidden';
    }

    if (!expanded.length) 
    {
        for (j = marked.length; j; )
        {
            j -= 1;
            unMarkIt(marked[j]);
        }
        marked.length = 0;
    }
    
    expanded.length = 0;
}

function itGo(url)
{
    window.location.href = url;
    return true;
}

function hideDivs()
{
<!--#for var="tree" --><!--#if var="recurse" --><!--#if var="level" -->
  hideBox("div<!--#echo var='counter' -->");<!--#endif--><!--#endif--><!--#endfor-->
}

//-->
</script>
</head>

<body onclick="return bodyClick();" onload="hideDivs();">

<!--#for var="tree" -->
<!--#if var="recurse" -->
  <div <!--#if var="level" -->id="div<!--#echo var='counter' -->"<!--#endif--> >
  <table class="mitable">
<!--#endif-->
<!--#if var="endrecurse" -->
  </table>
  </div>
<!--#endif-->
<!--#if var="real" -->
  <!--#if var="isdir"--><!--#if var="size"-->
<tr><td id="td<!--#echo var='counter' -->" class="fol" onclick="return subExp(this);" onmouseover="imov(this);" onmouseout="imou(this);">
<img src="<!--#echo var='image_dir'-->folder.gif" width="24" height="24" alt="icon"/>
<!--#echoen var="fullname" size="25"-->
</td></tr>
  <!--#endif--><!--#else-->
<tr><td id="td<!--#echo var='counter' -->" class="im" onclick="return itGo('<!--#echo var='relurl' -->');" onmouseover="imov(this);" onmouseout="imou(this);">
<img src="<!--#echo var='image_dir'--><!--#echo var='icon'-->" width="24" height="24" alt="icon"/>
<a href="<!--#echo var='relurl'-->">
<!--#if var="htmltitle" re="[a-z0-9]+"--><!--#echoen var="htmltitle" size="25"--><!--#else--><!--#echoen var="fullname" size="25"--><!--#endif--></a>
</td></tr>
  <!--#endif-->
<!--#endif var="real"-->
<!--#endfor-->

</body>
</html>