// JavaScript Document
/*
AJAX-based code using the XMLHTTPRequest object
The parameter 'fname' passed to the getData function is the name of the
php file that pulls the data from the database.  In this case it is the
file 'xml2.php'.
*/

function getData(fname)
{
	var XMLHttpRequestObject = false;
	var mozillaFlag = false;
	// The XMLHttpRequest object is for nonIE browsers
	// IE uses an ActiveX object
	if (window.XMLHttpRequest) {
	XMLHttpRequestObject = new XMLHttpRequest();
	
		if(XMLHttpRequestObject.overrideMimeType) {
		XMLHttpRequestObject.overrideMimeType('text/xml');		
		}
	// use this to flag the file for whitespace clean-up - removeWhitespace() function
	mozillaFlag = true;

	} else if(window.ActiveXObject) {
		XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
	}

	if(XMLHttpRequestObject) {
		//Get the 'XML2.php' XML data and store in variable xmlDoc
		XMLHttpRequestObject.open("GET", fname);
		XMLHttpRequestObject.onreadystatechange = function()
		{
			if(XMLHttpRequestObject.readyState==4 && XMLHttpRequestObject.status==200) {
			var xmlDoc = XMLHttpRequestObject.responseXML;
				if(mozillaFlag){
				  removeWhitespace(xmlDoc);
				}
				
			displayData(xmlDoc);  //parse the XML data and display
			}
		}
	}
		
		XMLHttpRequestObject.send(null)
}		

/*
This function iterates through the xmlDoc file and pulls out
the data we need for the display lists. Puts into 2 columns and
writes the html code to the div called 'live_content' on the calling page.
*/
function displayData (xmlDoc)
{
	var displayText = "";
	var displayImage = "";
	
	tablerows = xmlDoc.getElementsByTagName("tablerow");
	memTypes = xmlDoc.getElementsByTagName("mem_type");
	m_ids = xmlDoc.getElementsByTagName("m_id");
	titles = xmlDoc.getElementsByTagName("title");
	taglines = xmlDoc.getElementsByTagName("tagline");
	descriptions = xmlDoc.getElementsByTagName("description");
	images = xmlDoc.getElementsByTagName("cover_image");
	memCats = xmlDoc.getElementsByTagName("mem_cat");
	memCatIDs = xmlDoc.getElementsByTagName("mem_cat_id");
	
	//count the rows returned then divide by 2 because were displaying
	//in 2 columns.  This tells us how many table rows we need to create.
	var memCount = tablerows.length;
	var numRows = parseInt(memCount/2);
	//if there is remainder after dividing by 2 then there is an
	//odd number of data elements and we need to add an extra row.
	if(memCount%2 >0) {
		numRows++;
	}
	displayText = "<div style='float:left;width:560px;'>";
	
	for(loopIndex=0; loopIndex < memCount; loopIndex++)
	{
	   //write the first table cell
		var firstMem = titles[loopIndex].firstChild.data;
		var firstTagline = "";
	  //Safari browsers break if XML elements are empty
	  //We therefore always set empty elements = "_" then
	  //check if length is greater than one before writing data.
		if(taglines[loopIndex].firstChild.data.length>1) {
				firstTagline = taglines[loopIndex].firstChild.data;
			}
		var firstMemIdx = m_ids[loopIndex].firstChild.data;
		var firstMemType = memTypes[loopIndex].firstChild.data;
		var firstMemCat = memCats[loopIndex].firstChild.data;
		var firstMemCatID = memCatIDs[loopIndex].firstChild.data;
		//displayText=displayText + "<tr>";
		displayText=displayText + "<div style='float:left;width:130px;height:180px;padding-right:10px;padding-bottom:20px;'>" + "<a href='member_details.php?mem_id=" + firstMemIdx + "&amp;mem_type="+ firstMemType + "'>" + "<img src='/media/members/images/" + images[loopIndex].firstChild.data + "' alt ='" + titles[loopIndex].firstChild.data + "' width ='70%' height ='70%' border='0'></a>" + "<br/>";
		displayText=displayText + "<a href='member_details.php?mem_id=" + firstMemIdx + "&amp;mem_type="+ firstMemType + "&title=" + firstMem + "'>";
		displayText=displayText + firstMem + "</a><br/><b>In: </b><a href='member_categories.php?m_type=" + firstMemType + "&m_cat=" + firstMemCatID + "&m_catname=" + firstMemCat+ "'>" + memCats[loopIndex].firstChild.data + "</a>";
		displayText=displayText + "</div>";
		/* Because we want to sort alphabetically in columns we need to 
		count all the rows to be written, then start the second column
		with the second half of the list. */
		/*if(titles[loopIndex + numRows]) {
			var secondMem = titles[loopIndex + numRows].firstChild.data;
			var secondTagline = "";
			if(taglines[loopIndex + numRows].firstChild.data.length>1) {
				secondTagline = taglines[loopIndex + numRows].firstChild.data;
			}
			var secondMemIdx = m_ids[loopIndex + numRows].firstChild.data;
			var secondMemType = memTypes[loopIndex + numRows].firstChild.data;
			
			displayText=displayText + "<td width='33%' valign='top'><img src='/media/members/images/" + images[loopIndex + numRows].firstChild.data + "' alt ='" + titles[loopIndex + numRows].firstChild.data + "' width ='50%' height ='50%'>" + "<br/>";
			displayText=displayText + "<a href='member_details.php?mem_id=" + secondMemIdx + "&amp;mem_type="+ secondMemType + "'>";
			displayText=displayText + secondMem + "</a><br />" + "<br/><b>In:</b> "+ memCats[loopIndex + numRows].firstChild.data; +"</td>";
		}*/
		
		/*if(titles[loopIndex + numRows]) {
			var thirdMem = titles[loopIndex + numRows].firstChild.data;
			var thirdTagline = "";
			if(taglines[loopIndex + numRows].firstChild.data.length>2) {
				thirdTagline = taglines[loopIndex + numRows].firstChild.data;
			}
			var thirdMemIdx = m_ids[loopIndex + numRows].firstChild.data;
			var thirdMemType = memTypes[loopIndex].firstChild.data;
			
			displayText=displayText + "<td width='33%' valign='top'><img src='/media/members/images/" + images[loopIndex + numRows].firstChild.data + "' alt ='" + titles[loopIndex + numRows].firstChild.data + "' width ='50%' height ='50%'>" + "<br/>";
			displayText=displayText + "<a href='member_details.php?mem_id=" + thirdMemIdx + "&amp;mem_type="+ thirdMemType + "'>";
			displayText=displayText + thirdMem + "</a><br />" + thirdTagline + "</td>";
		}*/
		//displayText=displayText + "</tr>";
	}
		displayText=displayText +"</div>";
		
		var targetText = document.getElementById("live_content");
		targetText.innerHTML=displayText;

}

//Firefox - Mozilla doesn't render whitespace in XML properly so we have to clean it up
function removeWhitespace(xml) 
{
	var loopIndex;
	
	for (loopIndex = 0; loopIndex < xml.childNodes.length; 
	  loopIndex++) {
	
	  var currentNode = xml.childNodes[loopIndex];
	
	  if (currentNode.nodeType == 1) {
		removeWhitespace(currentNode);
	  }
	
	  if (((/^\s+$/.test(currentNode.nodeValue))) &&   
		(currentNode.nodeType == 3)) {
		  xml.removeChild(xml.childNodes[loopIndex--]);
	  }
	}
}