/*
 * menuExpandable2.js - implements an expandable menu based on a HTML list
 * Original Author: Dave Lindquist (http://www.gazingus.org)
 *
 * Expects to find a "id=default" element in the list
 */
function getElementById(name) {
	return(document.getElementById ? 
		document.getElementById(name) : document.all[name]);
}

function initializeMenu(menuId, actuatorId, selection) {
    var menu = getElementById(menuId);
    var list = menu.getElementsByTagName("li");
    var actuator = getElementById(actuatorId);
    var listElement;

    if (menu == null || actuator == null) return;

    menu.actuator = actuator;
    menu.defaultTitle = actuator.innerHTML;


    setToolTip(menu);

    for (i = 0; i < list.length; i++) {
       listElement = list[i];
       listElement.menu = menu;
       setSelectable(listElement);
       setHover(listElement);

       if(i == selection) {
          doSelection(listElement);
       }
    }

    actuator.innerHTML = "<b>" + menu.selected.innerHTML + "</b>";
    setHover(actuator);

    actuator.onclick = function() {
       if(menu.style.display == "block") {
          actuator.style.backgroundImage = "url(/map/img/right.gif)";
          menu.style.display = "none";
       } 
       else {
          actuator.style.backgroundImage = "url(/map/img/down.gif)";
          menu.style.display = "block";
       }
       return false;
    }	
}	

function setToolTip(menu) { 
	menu.actuator.title = menu.defaultTitle + 
		(menu.selected ? ": " + menu.selected.innerHTML : "");
}

function doSelection(node) {
	var menu = node.menu;
	if((old=menu.selected) != null) {
	    old.className = "unselected";
        }

	(menu.selected = node).className = "selected"
	setToolTip(menu);
        menu.actuator.innerHTML = "<b>" + menu.selected.innerHTML + "</b>";

	/* turn off this functionality for now */
	if (false && node == old) {  /* this is a "double click", close the menu */
		menu.actuator.onclick();
		node.onmouseout();   /* Some browsers don't call this on close */
	}
}

/* make this element clickable */
/* note: this function will preserve any previous onclick handler */
function setSelectable(node) {
	var f = node.onclick;
	node.onclick = function() { if (f) f(); doSelection(node); }
}

function setHover(node) {
	node.onmouseover = function() { node.style.backgroundColor = "#dfc78b"; node.style.cursor = "pointer";}
	node.onmouseout  = function() { node.style.backgroundColor = ""; }
}