menuSpace = document.getElementById&&!document.all ? document.getElementById("menu") : menu ;


     //holds all the nodes in the tree
    nodesArray = new Array();  

    //treeNode object 
    
    function treeNode (displayText, state, children, url) {
         //displayText is the value to be displayed on the menu
         //state is wether the menu is expanded or contracted
         //children is an array containing the children of this node
         //url is the link applied to displayText
        this.displayText = displayText;
        this.state = state;
        this.children = children;
        this.url = url;
    }

    function outputDepth (nodeNumber, spacing) {
        this.nodeNumber = nodeNumber;
        this.spacing = spacing;    
    }


     //draws out the menu again

    function redrawMenu () {
         //start at node 0 and get the children.... 
         //recursion without recursion 
    
        newHTML = '';
        
        stack = new Array();

        stack.push(new outputDepth(0,0));      //root node, always!

        while (stack.length >= 1) {
            outputNode = stack.pop();

            currentNode = nodesArray[outputNode.nodeNumber];
            spacing = outputNode.spacing;
            

            leaf = 1;
                
            
            if (currentNode.children.length > 0) {
                leaf = 0;                
            
                 //add the children to the stack
                if (currentNode.state == 1) 
                    for (i=currentNode.children.length - 1; i > -1; i--)    {
                        stack.push(new outputDepth(currentNode.children[i],spacing+1));
                    }
            }
            
             //print out the information for the menu.
            
            for (i = 0; i < spacing; i++)
                newHTML = newHTML + "  ";
            
            if (leaf == 1)
                newHTML = newHTML + "*";

             // expanded
            else if (currentNode.state == 1)
                newHTML = newHTML + '<a href="javascript:actionMenu(' + outputNode.nodeNumber + ',0)">-</a>';
            else 
                newHTML = newHTML + '<a href="javascript:actionMenu(' + outputNode.nodeNumber + ',1)">+</a>';

            if (currentNode.url != 0) 
                newHTML = newHTML + '<a href="' + currentNode.url + '">';
            
            newHTML = newHTML + currentNode.displayText;
            
            if (currentNode.url != 0) 
                newHTML = newHTML + '</a>';

            newHTML = newHTML + '<br>';
            
        }
        menuSpace.innerHTML = newHTML;
    }


     //adds a child node to a previously added node

    function addChild ( parent, child ) {
         //parent is the array address of the parent node
         //child is the array address of the child node
        nodesArray[parent].children.push(child);
    }

     //changes the state of one of the nodes and then redraws the menu.

    function actionMenu ( node, action ) {
         // node is the array address of the parent node
         // action is the new state of the node
         //   0 - collapsed
         //   1 - expanded
        nodesArray[node].state = action;
        redrawMenu();
    }    



    nodesArray.push(new treeNode("Main Menu",0,new Array(),"0"));  //0
        nodesArray.push(new treeNode("First Tier",0,new Array(),"0"));   //1
        addChild(0,1);
            nodesArray.push(new treeNode("Second Tier",0,new Array(),"0"));  //2
            addChild(1,2);
                nodesArray.push(new treeNode("Final Tier",0,new Array(),"http://www.yahoo.com"));  //3
                addChild(2,3);
        nodesArray.push(new treeNode("First Tier-2",0,new Array(),"0"));  //4
        addChild(0,4);
    
    redrawMenu();