/*
aqtree.js

Makes nested ULs into expand/collapse trees.
Requires a full-on DOM browser with support for createElement.

Usage: 

makeATree UL-element [,imgOpenURL,imgCloseURL [,imgItemURL [,indent]]]

UL-element must be a UL element object (perhaps got with document.getElementById)
imgOpenURL and imgCloseURL must wither both be specified or neither specified.
  imgOpenURL is an image meaning 'this submenu is now open', and quite often
  looks like a plus sign.
imgItemURL is a bullet image displayed against list items (rather than submenu headers).
indent is a number of pixels to indent a submenu from its parent menu, and
  defaults to 10 if unspecified.

Notes:
Your UL elements must have a title attribute, and that
  attribute is what becomes the clickable section header
  for that submenu.
All tree elements have a class of aqtree, and the headings
  also have a class of aqtreeheading. Bullet and open/close
  images have a class of aqtreebulletimg.

*/

treeID = 0;

function toggleSub(menuHeader) {
    mh = document.getElementById(menuHeader);
    ds = document.getElementById(menuHeader.getAttribute('toggleID')).style.display;
    document.getElementById(menuHeader.getAttribute('toggleID')).style.display = (ds == 'none') ? 'block' : 'none';
    
    imgid = menuHeader.getAttribute('toggleimg');
    img = document.getElementById(imgid);
    newImgType = (ds == 'none') ? 'srcclose' : 'srcopen';
    newImgSrc = img.getAttribute(newImgType);
    img.src = newImgSrc;

    menuHeader.blur();
}

function makeSubTree(ul,indent,level,imgOpenURL,imgCloseURL,imgItemURL,treeID) {
    // Walk through the subelements of the passed UL, adding each to the tree    
    var thisLevelRoot = document.createElement('div');
    thisLevelRoot.id = 'aqtree-'+treeID+'-'+level;
    thisLevelRoot.style.paddingLeft = ((level.length/2) * indent) + 'px';
    thisLevelRoot.style.display = (level.length == 0) ? 'block' : 'none';
    
    var realItemCount = 0;
    for (var cnc=0;cnc<ul.childNodes.length;cnc++) {
        var cn = ul.childNodes[cnc];
        
        //alert(cn.childNodes[0].childNodes[0].nodeValue);
        switch (cn.nodeName) {
            case 'UL':
            // This browser makes nested ULs children of their parent UL,
            // which is norty and non-compliant. But Mozilla does it, so
            // we need this code.
            realItemCount++; var levelVar = level + '.' + realItemCount;
            var itm = document.createElement('a');
            itm.style.display = 'block';
            itm.className = 'aqtree aqtreeheading';
            itm.setAttribute('href','#');
            itm.setAttribute('onclick','toggleSub(this)');

            if (imgOpenURL && imgCloseURL) {
                var openImg = document.createElement('img');
                openImg.setAttribute('src',imgOpenURL);
                openImg.setAttribute('srcopen',imgOpenURL);
                openImg.setAttribute('srcclose',imgCloseURL);
                openImg.className = 'aqtreebulletimg';
                openImg.id = 'aqtree-'+treeID+'-'+levelVar+'-toggleImg';
                openImg.style.borderWidth = '0px';
                itm.setAttribute('toggleimg',openImg.id);
                itm.appendChild(openImg);
            }

            txt = document.createTextNode(cn.getAttribute('title'));
            itm.appendChild(txt);
            itm.setAttribute('toggleID','aqtree-'+treeID+'-'+levelVar);
            
            thisLevelRoot.appendChild(itm);
            thisLevelRoot.appendChild(document.createTextNode('\n'));
            
            // and then recursively call this function to add its children
            var subTree = makeSubTree(cn,indent,levelVar,imgOpenURL,imgCloseURL,imgItemURL,treeID)
            thisLevelRoot.appendChild(subTree);
            thisLevelRoot.appendChild(document.createTextNode('\n'));
            break;
            
            case 'LI':
            realItemCount++; var levelVar = level + '.' + realItemCount;
            var itm = document.createElement('div');
            itm.className = 'aqtree';
            
            // Add a bullet image if one is specified
            if (imgItemURL != '') {
                itmImg = document.createElement('img');
                itmImg.src = imgItemURL;
                itmImg.className = 'aqtreebulletimg';
                itm.appendChild(itmImg);
            }

            // Add each childNode
            var compliantBrowser = false;
            var compliantBrowserContainerNode = document.createElement('div');
            
            for (var icnc=0;icnc<cn.childNodes.length;icnc++) {
                if (cn.childNodes[icnc].nodeName == 'UL') {
                // This is a compliant browser that makes nested ULs children of the preceding LI
                    compliantBrowser = true;
                    realItemCount++; var levelVar = level + '.' + realItemCount;
                    // Add the UL to this level's div
                    var thisHeader = document.createElement('a');
                    thisHeader.style.display = 'block';
                    thisHeader.className = 'aqtree aqtreeheading';
                    thisHeader.id = 'aqtree-'+treeID+'-header-'+levelVar;
                    
                    // IE5.5 (which is compliant) doesn't seem to recognise 
                    // the onclick handler, so do it in the href instead.
                    // Passing "this" doesn't work, either. Bah!
                    thisHeader.setAttribute('href','javascript:toggleSub(document.getElementById("'+thisHeader.id+'"))');
        
                    if (imgOpenURL && imgCloseURL) {
                        var openImg = document.createElement('img');
                        openImg.setAttribute('src',imgOpenURL);
                        openImg.setAttribute('srcopen',imgOpenURL);
                        openImg.setAttribute('srcclose',imgCloseURL);
                        openImg.className = 'aqtreebulletimg';
                        openImg.id = 'aqtree-'+treeID+'-'+levelVar+'-toggleImg';
                        openImg.style.borderWidth = '0px';
                        thisHeader.setAttribute('toggleimg',openImg.id);
                        thisHeader.appendChild(openImg);
                    }
        
                    txt = document.createTextNode(cn.childNodes[icnc].getAttribute('title'));
                    thisHeader.appendChild(txt);
                    thisHeader.setAttribute('toggleID','aqtree-'+treeID+'-'+levelVar);
                    
                    compliantBrowserContainerNode.appendChild(thisHeader);

                    // and then recursively call this function to add its children
                    var subTree = makeSubTree(cn.childNodes[icnc],indent,levelVar,imgOpenURL,imgCloseURL,imgItemURL,treeID)
                    compliantBrowserContainerNode.appendChild(subTree);
                    
                } else {
                    // A non-compliant browser, where nested ULs are children of their parent UL, and so there are no ULs in
                    // the LI.
                    nNode = cn.childNodes[icnc].cloneNode(true);
                    itm.appendChild(nNode)
                }
            }
            
            thisLevelRoot.appendChild(itm);
            
            // The way this works is: if we have a compliant browser, then we haven't added the new sublist 
            // (from the nested UL) to the tree root yet, because otherwise we'd add it before we've 
            // finished building the new list item (from the LI), because the UL is a child of the LI. 
            // So we have to add it now, now that we've added the LI (called itm) in the line above.

            if (compliantBrowser) {
                for (var cb=0;cb<compliantBrowserContainerNode.childNodes.length;cb++) {
                    nNode = compliantBrowserContainerNode.childNodes[cb].cloneNode(true);
                    thisLevelRoot.appendChild(nNode);
                }
            }
            
            thisLevelRoot.appendChild(document.createTextNode('\n'));
            break;
        }
    }
    return thisLevelRoot;
}

function makeATree(el,imgOpenURL,imgCloseURL,imgItemURL,indent) {
    // Check we've got the nuts to run the script
    if (el.tagName != 'UL') return;
    if (!document.createElement) return;
    
    // ID for this tree
    treeID += 1;

    container = document.createElement('div');
    if (indent) {
        thisIndent = indent; 
    } else { 
        thisIndent = 10;
    } 
    tree = makeSubTree(el,thisIndent,'',imgOpenURL,imgCloseURL,imgItemURL,treeID);

    container.appendChild(tree);
    
    pn = el.parentNode;
    pn.replaceChild(container,el);
}

