/* 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;
}



var FeatureSearch = {};

FeatureSearch.position = function (e, divSearchBox) {
	var x = e.clientX + document.documentElement.scrollLeft;
	var y = e.clientY + document.documentElement.scrollTop;
	divSearchBox.style.left = x + "px";
	divSearchBox.style.top = y + "px";
};

FeatureSearch.drawResultBox = function (e) {
	var divSearchBox= document.createElement("div");
	var divHeading = document.createElement("div");
	var divResultsPane = document.createElement("div");
	var aCloseLink = document.createElement("a");
	
	aCloseLink.title = "close";
	aCloseLink.href = "#";
	aCloseLink.className = "featureCloseLink";
	aCloseLink.onclick = this.close;
	aCloseLink.appendChild(document.createTextNode("X"));
	divHeading.className = "featureHeading";
	divHeading.appendChild(document.createTextNode("Featured Property"));
	divHeading.appendChild(aCloseLink);
	
	var divLoading = document.createElement("div");
	divLoading.appendChild(document.createTextNode("Loading Search Feed"));
	divResultsPane.className = "featureSearchResults";
	divResultsPane.appendChild(divLoading);
	
	divSearchBox.className = "featureContainer";
	divSearchBox.appendChild(divHeading);
	divSearchBox.appendChild(divResultsPane);
	document.body.appendChild(divSearchBox);
	
	this.position(e, divSearchBox);
	this.populateResults(divResultsPane);
	return divSearchBox;
	//more code to come
};

FeatureSearch.populateResults = function (divResultsPane) {
	var oFragment = document.createDocumentFragment();
	divResultsPane.removeChild(divResultsPane.firstChild);
	/*var table = createTable([
    ["1", "2", "3", "4", "5"],
    ["one", "two", "three", "four", "five"],
    ["un", "deux", "trois", "quatre", "cinq"],
    ["eins", "zwei", "drei", "vier", "fünf"]]);*/

	
	/*var htm = '<table  border="0" frame="border" width="500" cellpadding="5" cellspacing="0" align="center"><thead><th colspan="3" bgcolor="silver">For Sale</th></thead><tr bgcolor="white"><td align="center"><img src="faisal_1.jpg" border="1" alt="Front View"/> </td><td align="center"><img src="faisal.jpg" border="1" alt="Gate: from the street"/></td></tr><tr><td colspan="3"><hr /></td></tr><tr align="left" valign="top" bgcolor="silver"><td><b>Address</b></td><td colspan="2"><b>Desription</b></td></tr><tr align="bottom" valign="center" bgcolor="white"><td>North Malali low cost, Kaduna, Kaduna State.</td><td colspan="2"><font size="2">-4 bedroom bungalow,3 rooms each with toilets and parlor-1 BQ with toilet-parking space-fully interlocked and landscaped-gate man house - Spaceous Courtyard</font></td></tr><tr><td colspan="3"><hr /></td></tr>	<tr align="left" valign="top" bgcolor="silver">	<td><b>Type</b></td><td colspan="2"><b>Price</b></td></tr><tr align="bottom" valign="bottom" bgcolor="white"><td>Bungalow</td><td colspan="2"><strike><? print number_format(25000000) ?>25,000,000  </strike> Now:<? print number_format(21000000)?>21,000, 000 NGN</td></tr><tr><td colspan="3"><hr /></td></tr><tr align="left" bgcolor="silver"> <td colspan="3" align="center"><b>Contact Information</b></td></tr><tr><td colspan="3"><hr /></td></tr><tr> <td colspan="3" align="right"><table border="0" width="400" frame="box" rules="" cellspacing="1" cellpadding="8" bgcolor="silver"><tr bgcolor="white"><td ><b>Name:</b></td><td>Ishiaku A. Gwamna</td></tr><tr bgcolor="silver"><td ><b>Phone:</b></td><td>080 3322 9800</td></tr><tr bgcolor="white"><td ><b>Email:</b></td><td>agwamna@hotmail.com</td></tr><tr align="center"><td colspan="2"><font size="2"><a href="inquiries">Send Online Request</a></font></td></tr></table></td></tr><tr><td colspan="3"><hr /></td></tr><tr align="left" valign="middle">	<td rowspan="2" colspan="2"><a href="index.php">Back to homepage</a></td></tr></table>'; */
	var tabele = get_table();
	oFragment.appendChild(table);

	divResultsPane.appendChild(oFragment);
	//more code to come
};

FeatureSearch.close = function () {
	var divSearchBox = this.parentNode.parentNode;
	document.body.removeChild(divSearchBox);
	return false;
};

FeatureSearch.search = function (e) {
	var divSearchBox = this.drawResultBox(e);
	
};

function createTable(data) {
  var table = document.createElement("table");
  var thead = document.createElement("thead");
  var tr = document.createElement("tr");
  for (var i = 0; i < data[0].length; i++) {
    var th = document.createElement("th");
    var newText =
      document.createTextNode(data[0][i]);
    th.appendChild(newText);
    tr.appendChild(th);
  }
  thead.appendChild(tr);
  table.appendChild(thead);
  var tbody = document.createElement("tbody");
  for (var i = 1; i < data.length; i++) {
    var tr = document.createElement("tr");
    for (var j=0; j < data[i].length; j++) {
      var td = document.createElement("td");
      var newText =
        document.createTextNode(data[i][j]);
      td.appendChild(newText);
      tr.appendChild(td);
    }
    tbody.appendChild(tr);
  }
  table.appendChild(tbody);
  return table;
}

function get_table() {
	var ohr = createXmlHttpRequestObject();
	
	if (ohr.readyState == 4 || ohr.readyState == 0)
	{	
		// call the server page to execute the server-side operation
		ohr.open("GET", "feature-sample.htm", true);
		ohr.setRequestHeader("Content-Type", "text/html");
		ohr.onreadystatechange = function () {
			var response = ohr.responseText;
			
		}
		xmlHttpGetMessages.send();
	}
	return response;
}