// JavaScript Document
document.onClick=clicked

function clicked(elementClicked) {
	//alert("I'm in clicked!");
	if (elementClicked == null) {
		elementClicked = window.event.srcElement;
	}

	if (elementClicked.className = "plusMinus") {
		//alert("Element clicked has this html: " + elementClicked.innerHTML);
		//alert("Parent className is: " + elementClicked.parentNode.nodeName);
		//alert("The Parent has " + elementClicked.parentNode.childNodes.length + " child nodes.");
		if (elementClicked.innerHTML == "+") {
			expandCollapse(elementClicked.parentNode, true);
			elementClicked.innerHTML = "-";
		} else {
			expandCollapse(elementClicked.parentNode, false);
			elementClicked.innerHTML = "+";
		}
	} else if (elmentClicked.className = "graphic") {
		if (elementClicked.firstChild.src == "../styles/a_down.gif") {
			elementClicked.firstChild.src == "../styles/a_up.gif";
		} else {
			elementClicked.firstChild.src == "../styles/a_down.gif";
		}
	}
	if (elementClicked.className = "hasLeaves") {
		// nothing right now
	}
}

function expandCollapse(divisionClicked, expand) {
	// If the division clicked was not passed to this function (some browsers
	// don't handle the 'document.onClick' construct), then the element can be
	// obtained directly like this:
	//
	//	var divisionClicked = window.event.srcElement;
	//
	//alert("Im in expandCollapse");
	
	var div;
	if (divisionClicked == null) {
		div = window.event.srcElement;
	} else {
		div = divisionClicked
	}

	if (div.className == "mainCategory") {
		nodeClass = "branch"
	} else {
		nodeClass = "branch"
	}
	
		if (expand) {
			setStyleDisplayIfMatch(div.childNodes, nodeClass, "block");
		} else {
			setStyleDisplayIfMatch(div.childNodes, nodeClass, "none");
		}
	//}
}	

function setStyleDisplayIfMatch(childElements, className, displayName) {
	//alert("Im in setStyleDisplayIfMatch");

	var child;
	for (var i = 1; i < childElements.length; i++) {
		child = childElements.item(i);
		if (child.className == className) {
			child.style.display = displayName;
		}
	}
}