var xmlHttp;
try
{ xmlHttp=new XMLHttpRequest(); }	// Firefox, Opera 8.0+, Safari
catch (e)
{
	try
	{ xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); }	// Internet Explorer
	catch (e)
	{
		try
		{ xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); }
		catch (e)
		{ alert("Your browser does not support AJAX!"); }
	}
}

var SubTableMgr =
{
	// <img>'s used for expand (+) and collapse (-)
	sExpandIMG: '<img src="/images/expand.gif" class="BlackTri" alt="Expand" title="Expand" height="9" width="9" />',
	sCollapseIMG: '<img src="/images/collapse.gif" class="BlackTri" alt="Collapse" title="Collapse" height="9" width="9" />',

	showSubTable: function (collapsedNode, contentURL)
	{
		// we're assuming that collapsedNode is the link to click on to get the subtable to expand/appear
		// example: right-pointing arrow
		// change arrow to "fetching" (square)

		// add savedOnClick property to the node for saving the current onclick event
		collapsedNode.savedOnClick = collapsedNode.onclick;

		// clear the current onclick event
		// collapsedNode.onclick = undefined;

		// determine what row the collapsed node is in using DOM navigation
		var testNode = collapsedNode;
		while (testNode.tagName != 'TR' && testNode.parentNode != undefined)
			testNode = testNode.parentNode;

		if (testNode.tagName != 'TR')
			return;

		var currentRow = testNode;

		// determine number of cells in row
		var colSpan = currentRow.childNodes.length;

		// create new row
		var newRow = document.createElement('TR');
		newRow.style.backgroundColor = currentRow.style.backgroundColor;
		newRow.bgColor = currentRow.bgColor;

		// create new cell in row with a colspan of the number of cells in the current row
		var newCell = document.createElement('TD');
		newCell.setAttribute('colspan', colSpan);	// non-IE
		newCell.colSpan = colSpan;						// IE
		newRow.appendChild(newCell);

		// insert the new row after the current row
		currentRow.parentNode.insertBefore(newRow, currentRow.nextSibling);

		// set inner HTML of new cell with AJAX and the contentURL parameter
		this.contentTarget = newCell;

		/* I had trouble getting the asynchronous method to work in IE, so I'm resorting to this: BKG, 04/11/07
		xmlHttp.onreadystatechange = function ()
		{
			if (xmlHttp.readyState == 4)
			{
				alert(xmlHttp.responseText);
				SubTableMgr.contentTarget.innerHTML = xmlHttp.responseText;
			}
		}
		*/

		xmlHttp.open('GET', contentURL, false);
		xmlHttp.send(null);

		if (xmlHttp.status == 200)
			this.contentTarget.innerHTML = xmlHttp.responseText;

		// change the appearance of the now-expanded node to the down-arrow
		collapsedNode.innerHTML = SubTableMgr.sCollapseIMG;

		// Fix IE5.5 & 6's transparent PNG issues
		if (window.correctPNG)
			correctPNG();

		// change the onclick of the now-expanded node
		collapsedNode.onclick = function () { SubTableMgr.hideSubTable(this); }
	},

	hideSubTable: function (expandedNode)
	{
		// we're assuming that expandedNode is the link to click on to get the subtable to collapse/disappear
		// example: down-pointing arrow

		// determine what row the expanded node is in using DOM navigation
		var testNode = expandedNode;
		while (testNode.tagName != 'TR' && testNode.parentNode != undefined)
			testNode = testNode.parentNode;

		if (testNode.tagName != 'TR')
			return;

		var currentRow = testNode;

		// remove the next sibling, which is presumably the row with the subtable
		currentRow.parentNode.removeChild(currentRow.nextSibling);

		// restore the saved onclick event
		expandedNode.onclick = expandedNode.savedOnClick;

		// change the appearance of the now-collapsed node to the right-arrow
		expandedNode.innerHTML = SubTableMgr.sExpandIMG;

		// Fix IE5.5 & 6's transparent PNG issues
		if (window.correctPNG)
			correctPNG();
	}
}