// stores the reference to the XMLHttpRequest object
var xmlHttp = createXmlHttpRequestObject();

var CharId;


// creates an XMLHttpRequest instance
function createXmlHttpRequestObject()
{
	// will store the reference to the XMLHttpRequest object
	var xmlHttp;
	// this should work for all browsers except IE6 and older
	try
	{
		// try to create XMLHttpRequest object
		xmlHttp = new XMLHttpRequest();
	}
	catch(e)
	{
		// assume IE6 or older
		var XmlHttpVersions = new Array("MSXML2.XMLHTTP.6.0",
			"MSXML2.XMLHTTP.5.0",
			"MSXML2.XMLHTTP.4.0",
			"MSXML2.XMLHTTP.3.0",
			"MSXML2.XMLHTTP",
			"Microsoft.XMLHTTP");
		// try every prog id until one works
		for (var i=0; i<XmlHttpVersions.length && !xmlHttp; i++)
		{
			try
			{
				// try to create XMLHttpRequest object
				xmlHttp = new ActiveXObject(XmlHttpVersions[i]);
			}
			catch (e) {}
		}
	}
	// return the created object or display an error message
	if (!xmlHttp)
		alert("Error creating the XMLHttpRequest object.");
	else
		return xmlHttp;
}

function search()
{
	// proceed only if the xmlHttp object isn't busy
	if (xmlHttp.readyState == 4 || xmlHttp.readyState == 0)
	{
		//alert(escape(document.getElementById("searchterm").value));
		var searchterm = document.getElementById("searchterm").value;



//alert("searchengine.html?action=search&searchterm=" + searchterm);
/*
		if (searchterm.match(/[^A-Za-z0-9ü]/)) 
		{
			document.getElementById("searchresults").innerHTML =  '<div id="error">Only numbers and alphanumeric characters are supported!</div>';
		}
		else
*/
		{
			document.getElementById("searchresults").innerHTML =  '<div id="error">Searching ' + searchterm + '...</div>';
			xmlHttp.open("GET", "searchengine.html?action=search&searchterm=" + searchterm, true);
			// define the method to handle server responses
			xmlHttp.onreadystatechange = handleSearchResults;
			// make the server request
			xmlHttp.send(null);
		}
	}
	else
	{
		// if the connection is busy, try again after one second
		setTimeout('search()', 1000);
	}
}


function handleSearchResults()
{
	// move forward only if the transaction has completed
	if (xmlHttp.readyState == 4)
	{
		// status of 200 indicates the transaction completed successfully
		if (xmlHttp.status == 200)
		{
			// extract the XML retrieved from the server
			xmlResponse = xmlHttp.responseXML;
			// obtain the document element (the root element) of the XML structure
			//xmlDocumentElement = xmlResponse.documentElement;
			// get the text message, which is in the first child of
			// the the document element
			//query = xmlDocumentElement.firstChild.data;
			// update the client display using the data received from the server
			var elements = xmlResponse.getElementsByTagName("element");
			var resultstring = "";
			if (elements.length > 0)
			{
				resultstring="<ul>\n";
				for (var i=0; i<elements.length; i++)
				{
					try
					{
						element = elements.item(i);
						var pinyin = element.getElementsByTagName("pinyin").item(0).firstChild.data;
						var id = element.getElementsByTagName("id").item(0).firstChild.data;
						var character = element.getElementsByTagName("character").item(0).firstChild;
						resultstring += "<li><i>"+id+". " + pinyin + "</i>";
						if (character!=null)
						{	
							resultstring += " (<span class=\"character\">" + character.data + "</span>)";
						}
						else
							resultstring += " [<a href=\"?getaction=update&amp;char=" + id + "&amp;searchterm=" + document.getElementById("searchterm").value + "\">update character</a>]";
						resultstring+="</li>";
					}
					catch (e) {}
				}
				resultstring+="</ul>";
			}
			else
			{
				resultstring = '<div id="error">Nothing found!</div>';
			}
				
			
			document.getElementById("searchresults").innerHTML = resultstring;
		}
		// a HTTP status different than 200 signals an error
		else
		{
			alert("There was a problem accessing the server: " + xmlHttp.statusText);
		}
	}
}