/* Toggles
    All 3 of these elements must be present:
    <DIV class=Toggle2Container>
        <H3 class="Toggle2H3" onclick="toggle(this)">The clickable title</H3>  
        <DIV class="Toggle2Content">The content that will be hidden / shown</div>
    </div>

    <H3 class="Toggle2H3" onclick="toggle(this)" style="background-image: none;">The clickable title</H3>  <-- Use this one if not using an image button.

    Only the text in the Toggle2Content div will be hidden.
    Toggle2Container must contain only 1 Toggle2H3 and 1 Toggle2Content classes.
    
    global variables:
    Define these in the top of the page to customize the toggle.
    
        Toggle2Images : if false, the toggle images will not be used.
        Toggle2ImageOpen: the image to use for the open button
        Toggle2ImageClose: the image to use for the close button
        Toggle2CloseAll: if false more than 1 element can be opened at one time
*/

if (!Toggle2Images) {
    var Toggle2Images = true;  // Uses images by default
}
if (!Toggle2ImageOpen) {
    var Toggle2ImageOpen = "url(/images/shared/btnToggleDown.gif)";  // Uses this image by default for the open button
}
if (!Toggle2ImageClose) {
    var Toggle2ImageClose = "url(/images/shared/btnToggleUp.gif)";  // Uses this image by default fot the close button
}
if (!Toggle2CloseAll) {
    var Toggle2CloseAll = true;  // By default, only one Toggle div can be opened
}

function toggle2CloseAll(which, whichNotToClose) {
    // Close all Toggles
    // which = the div containing all the "Toggle2Container" classed Divs
    // l is the number of sibling "Toggle2Container"s
    l = which.childNodes.length;

    // We need to search all the siblings to close all the toggles
    for (i=0; i < l; i++) {
        // te = this element
        te = which.childNodes[i];

        if (te.className == "Toggle2Container" && te != whichNotToClose) {
            // We've found a sibbling, we need to search it for a "Toggle2Content" to hide and
            // a "Toggle2H3" to switch the +/- background
            // sl = number of elements in this toggleContainer
            sl = te.childNodes.length;
            for (j=0; j < sl; j++) {
            
                // tse = this sub-element
                tse = te.childNodes[j];
                if (te.childNodes[j].className) {
                    // hide this content
                    if (te.childNodes[j].className == "Toggle2Content") {
                            te.childNodes[j].style.display = "none";
                    }
                    // Change this icon
                    if (te.childNodes[j].className == "Toggle2H3" && Toggle2Images) {
                         te.childNodes[j].style.backgroundImage = Toggle2ImageClose;
                    }
                }
            }               
        }
    }
}

function toggle2(which) {
    // Close all Toggles before we open another
    if (Toggle2CloseAll) {
        toggle2CloseAll(which.parentNode.parentNode, which.parentNode); // Close all toggles EXCEPT this one
    }
    
    // Check all elements whithin this ToggleContainer    
    l = which.parentNode.childNodes.length;
    
    for (i = 0; i < l; i++) {
        cn = which.parentNode.childNodes[i];
        // Find the title H3 and the content div
        if (cn.className) { 
            if (cn.className == "Toggle2H3") {
                title = which.parentNode.childNodes[i];
            }
            if (cn.className == "Toggle2Content") {
                content = which.parentNode.childNodes[i];
            }
        }
    }

    // Toggle them on / off
    if (content.style.display != "inline") {
        content.style.display = "inline";
        if (Toggle2Images) {
            title.style.backgroundImage = Toggle2ImageOpen;
        }    
    } else {
        content.style.display = "none";
        if (Toggle2Images) {
            title.style.backgroundImage = Toggle2ImageClose;
        }
    }
}

function openToggle(which) {
    // To Open a Toggle by it's ID
    // Assign an id to the ToggleH3 classed <H3> tag
    
    findElement = document.getElementById(which);
    toggle2(findElement)
}
