//This function will go through all rows and setup the onclick event for each image that drives
//  the tree view.  In addition, it will reset the table to display only the first and second level nodes.
function setupTable(tableId) {
	//If browser doesn't support getElementById it is not a new browser and we should exit
	if (!document.getElementById)
		return;
		
	var table = document.getElementById(tableId);
	var rows = table.rows;
	
	table.border = 0;
	if (table.style)
		table.style.border = "1px solid #cccccc";
	
	for (var i = 0; i < rows.length; i++) {
		var row = rows[i];
		var index = getProperty(row, "index");		//The index represents the hierarchy (parent.child.grandchild.etc)
		var level = getNodeLevel(index);			//The function will return the level of the row based on the index

		for (var j = 0; j < row.cells.length; j++) {
			var cell = row.cells[j];				//Look for the first image inside the first cell of the current row
			var imageControl;						//The image will drive the contract/expand of child nodes
			
			if (cell.style) {
				cell.style.borderLeft = "1px solid #cccccc";
				cell.style.borderRight = "1px solid #cccccc";
				cell.style.paddingLeft = "2px";
				cell.style.paddingRight = "2px";
			}
			
			
			if (j == 0) {
				var imageControl = cell.firstChild.firstChild;
				//tagName tells us the type of element we currently have
				if (imageControl) {
					//Set the proper style and margin of the image to represent the tree
					if (imageControl.style) {
						imageControl.style.marginLeft = ((level - 1) * 10) + "px";
					}

					//Add the event handler for onclick.
					if (row.getElementsByTagName("A").length > 1 || index.indexOf(".") == -1) {
						imageControl.onclick = function () {
							var row = findParentByTag(this, "TR");
							
							//The image URL determines if the row is open or closed.
							if (this.src.indexOf("f_plus") != -1) {
								setRowState(row, "open");
							} else {
								setRowState(row, "closed");
							}
						}
					}
				}
			}
		}
		
		// Close all top level nodes.  Later open only the first node
		if (level == 1) {
			setRowState(row, "close");
		}
	}
	
	//Open the first row in the menu
	row = table.rows[0];
	setRowState(row, "open");
}


//This function will draw or hide the border around each cell in the row.
function setBorder(row, state) {
	for (var i = 0; i < row.cells.length; i++) {
		var cell = row.cells[i];
		if (state == "show") {
			cell.style.borderTop = "1px solid #cccccc";
			cell.style.borderBottom = "1px solid #cccccc";
		} else {
			cell.style.borderTop = "";
			cell.style.borderBottom = "";
		}
	}
}

//Based on an element, determine if an attribute exists and if the value is set to true or yes
function isPropertyOn(el, prop) {
	var value = getProperty(el, prop);
	if (value == null)
		return false;
	else 
		if (value == true || value == "true" || value == "yes")
			return true;
		else
			return false;
}

//Based on the node index (an attribute in the row), returns the depth level for the node (from an index like 1.2.3.4)
function getNodeLevel(node) {
	return node.split(".").length;
}

//This function will open or close a row.  State can be either "open" or "closed".  When a row is open,
//the children are displayed (only one level).  When it is closed, all children, grandchildren, etc. are
//hidden from view.
function setRowState(row, state) {
	var children = row.cells[0].childNodes;
	var index = getProperty(row, "index");
	var level = getNodeLevel(index);
	var imageControl;
	var displayState = "";
	
	//Find the image in the first cell (which is always the plus or minus image)
	//for (var i = 0; i < children.length; i++) {
	//	var control = children[i];
	//	if (control.tagName == "IMG")
	//		imageControl = control;
	//}
	
	imageControl = row.cells[0].firstChild.firstChild;
	
	//Hide or display the row based on info
	if (state == "closed") {
		if (row.getElementsByTagName("A").length > 1 || index.indexOf(".") == -1) {
			imageControl.src = "/design/global/images/find/f_plus.gif";
			row.style.backgroundColor = (level == 1 ? "#e5cb90" : "");	//Level one show orange otherwise use default (white)
			displayState = "none";
		}
	} else {
		imageControl.src = "/design/global/images/find/f_minus.gif";
		row.style.backgroundColor = (level == 1 ? "#e5cb90" : "#ffffff");
	}
	
	//This section will show or hide the content of each cell in the row except for the first cell.
	//Start with the second cell because the first one should always be visible
	if (level > 1) {
		for(var i = 1; i < row.cells.length; i++) {
			var cell = row.cells[i];
			
			children = cell.childNodes;

			for(var j = 0; j < children.length; j++) {
				var control = children[j];
				if (control.style && control.tagName != "IMG") {
					control.style.display = displayState;
				}
			}
		}
	}
		
	//Make row visible, regardless of opening or closing.
	if (row.style)
		row.style.display = "";
		
	//This only seems to work predictably in IE, may delete code
	//This section should draw borders around the selected row
	//if it is suppossed to be open, otherwise, it hides the borders
	//if it should be closed.
	//if (state == "closed") {
	//	if (level > 1) 
	//		setBorder(row, "hide");
	//} else {
	//	if (level > 1)
	//		setBorder(row, "show");
	//}		

	//Show or hide the children rows for this row if it is a parent.
	while (nextSibling(row) != null) {
		row = nextSibling(row);
		var currentIndex = getProperty(row, "index");
		var currentLevel = getNodeLevel(currentIndex);
		if (currentIndex.indexOf(index) == 0) {
			//If we are opening, show only one level deep, for closed, hide every child, grandchild, etc.
			if (state == "close") {
				if (currentLevel == (level + 1)) 
					setRowState(row, "close");
			} else {
				if (row.style)
					row.style.display = displayState;
			}
		} else {
			break;
		}				
	}
}

//Get the srcElement for the event 
function srcElement(e) {
	var el;
	if (!e) e = window.event;
	if (e.target) el = e.target;
	if (e.srcElement) el = e.srcElement;
	return el;
}

//Get the value for a property (attribute) set in an element
function getProperty(object, property) {
	var returnValue;
	if(object){
		returnValue = object[property];
		if(returnValue == null && object.getAttribute)
			returnValue = object.getAttribute(property);
	}
	return returnValue;
}		

//Set the attribute in the object
function setProperty(object,property,value) {
	if(object.setAttribute)
		object.setAttribute(property,value);
	else
		object[property]=value;
}

//Netscape has intermediate objects when calling nextSibling or previousSibling when using
//rows or cells.  This function will look at the tagName of the source element and will then 
//step through the siblings until it finds another element with a matching tagName.
function nextSibling(element) {
	var sibling = element.nextSibling;
	while (sibling != null && sibling.tagName != element.tagName) {
		sibling = sibling.nextSibling;
	}
	return sibling;
}

function previousSibling(element) {
	var sibling = element.previousSibling;
	while (sibling != null && sibling.tagName != element.tagName) {
		sibling = sibling.previousSibling;
	}
	return sibling;
}

//IE and Netscape use different methods to get the parent element		
function parentElement(element) {
	if (element.parentElement) 
		return element.parentElement;
	if (element.parentNode)
		return element.parentNode;
		
	return null;
}

//Function to simplify navigating the hierarchy of the document to allow the finding
//of a specific parent by tagName	
function findParentByTag(element, tagName) {
	var currentElement = element;
	while (parentElement(currentElement) != null && currentElement.tagName != tagName) {
		currentElement = parentElement(currentElement);
	}
	return (currentElement.tagName == tagName ? currentElement : null);
}
