var XMLHttpRequestObject = false; 
var lastMenu = "m2";

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

function displayData(xmlDocument) {

var xmlDataNode;
var idNode, descriptionNode, photoNode, titleNode;
var idText, descriptionText, photoText, titleText;


xmlDataNode = xmlDocument.documentElement;
idNode = xmlDataNode.firstChild;
descriptionNode = idNode.nextSibling;
photoNode = descriptionNode.nextSibling;
titleNode = photoNode.nextSibling;

idText = idNode.firstChild.nodeValue;
descriptionText = descriptionNode.firstChild.nodeValue;
photoText = photoNode.firstChild.nodeValue;
titleText = titleNode.firstChild.nodeValue;

document.getElementById("webSwapDetails").innerHTML="<pre id='preID' ><h3>"+titleText+"</h3><br />"+descriptionText+"</pre>";
//document.getElementById("magicBoxContainer").innerHTML="<img src='images/web"+photoText+".jpg' />";
//document.getElementById("servicesSwapPhoto").innerHTML="<a href='images/services/"+photoText+"'><img style='width:100px; height:100px; border:0px' src='images/services/"+photoText+"' /></a>";

	if(titleText == "Web Design") {
		document.getElementById("webSiteDetails").innerHTML="Click <a href='http://www.coolblueonline.com/' target='_blank' >Here</a> to visit our online portfolio (link opens a new window)";
	} else {
		document.getElementById("webSiteDetails").innerHTML="";
	}

}

function getData(dataID) 
{
	var url = "Scripts/webData.php";	  
	if(XMLHttpRequestObject) 
	{

		XMLHttpRequestObject.open("POST", url); 
		XMLHttpRequestObject.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
		XMLHttpRequestObject.onreadystatechange = function() 
		{	 
			
			if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200) 
			{
				var xmlDocument =  XMLHttpRequestObject.responseXML;
				displayData(xmlDocument)
			} 

		} 
		XMLHttpRequestObject.send("id=" + dataID); 
	}
	
	origHTML = document.getElementById(lastMenu).innerHTML;												////  Remove the colour from the previous menu item ///
	newHTML = origHTML.replace('<a href="#" style="color: rgb(254, 124, 2);">', '<a href="#">');
	newHTML = newHTML.replace('<A style="COLOR: #fe7c02"', '<A');
	document.getElementById(lastMenu).innerHTML=newHTML;
	
	
	origHTML = document.getElementById("m"+dataID).innerHTML;											//// Change the colour of the clicked menu item ///
	newHTML = origHTML.replace('#"', '#" style="color:#fe7c02;"');
	
	document.getElementById("m"+dataID).innerHTML = (newHTML);
	
	lastMenu = ("m"+dataID);																			//// Set the clicked menu item to be lastMenu ///
	
}