/*
 * menuExpandable3.js - implements an expandable menu based on a HTML list
 * Author: Dave Lindquist (http://www.gazingus.org)
 *
 * Updated by: Jesse Smith
 * Date: 4-10-06
 * Changes: Instead of using document.getElementById I wrote a method to get the elements
 * by their class names. This way I can have menus expand based on their class names and initialize
 * them all with one command rather than initializing them each individually.
 *
 * I also wrote methods to expand and collapse all of the elements.
 */

/* Method to expand all of the menu/actuator class elements on a page */
function expandAll(menuClass, actuatorClass) {
		var menus = getElementsByClass(menuClass);
    var actuators = getElementsByClass(actuatorClass);
		if (menus == null || actuators == null) return;
		for (i=0; (i < actuators.length && i < menus.length); i++){
	    var display = menus[i].style.display;
	    actuators[i].parentNode.style.backgroundImage = "url(/images/minusButton.gif)";
	    menus[i].style.display = "block";
    }
    return false;
}

/* Method to collapse all of the menu/actuator class elements on a page */
function collapseAll(menuClass, actuatorClass) {
    var menus = getElementsByClass(menuClass);
    var actuators = getElementsByClass(actuatorClass);
		if (menus == null || actuators == null) return;
		for (i=0; (i < actuators.length && i < menus.length); i++){
	    var display = menus[i].style.display;
	    actuators[i].parentNode.style.backgroundImage = "url(/images/plusButton.gif)"
	    menus[i].style.display = "none";
    }
    return false;
}

/* Initializes the menus and actuators on a page specified by menuClass and actuatorClass.
 * These are the class names of the elements on the page. The onClick method is set to toggle
 * between expanded/collapsed items.
 */
function initializeMenuClass(menuClass, actuatorClass) {
    var menus = getElementsByClass(menuClass);
    var actuators = getElementsByClass(actuatorClass);
    if (menus == null || actuators == null) return;
    //if (window.opera) return; // I'm too tired
		for (i=0; (i < actuators.length && i < menus.length); i++){
	    actuators[i].parentNode.style.backgroundImage = "url(/images/plusButton.gif)";
	    actuators[i].onclick = function() {
	        act_index = actuators.indexOf(this);
	        var display = menus[act_index].style.display;
	        this.parentNode.style.backgroundImage =
	            (display == "block") ? "url(/images/plusButton.gif)" : "url(/images/minusButton.gif)";
	        menus[act_index].style.display = (display == "block") ? "none" : "block";
	        return false;
	    }
    }
}

/* Since there is no getElementsByClass present for javascript, I had to write one.
 * It searches the document for all of the tags from the DOM (IE) or the tag names (other browsers)
 * It then searches those elements for ones with the classname we are looking for and returns an
 * array of them.
 */
function getElementsByClass(classname){
 var inc=0;
 var classcollection = new Array();
 var alltags=document.all? document.all : document.getElementsByTagName("*");
 for (i=0; i<alltags.length; i++){
   if (alltags[i].className==classname)
     classcollection[inc++]=alltags[i];
 }
 return classcollection;
}
