// declare a global  XMLHTTP Request object
var XmlHttpObj;

/**
 *declare who calls StateChangeHandler function -> PopulateCategoryList function
 *container of change_control var from search_gui_ajax.php( loading_fx function )
 * Main = 1
 * Country = 2
 * Region = 3
 * City = 4
*/
var change_control_catch;

//declare the id storage
//var selectedMainID; //Main
var selectedCountryID; //Country

// create an instance of XMLHTTPRequest Object, varies with browser type, try for IE first then Mozilla
function CreateXmlHttpObj()
{
	// try creating for IE (note: we don't know the user's browser type here, just attempting IE first.)
	try
	{
		XmlHttpObj = new ActiveXObject("Msxml2.XMLHTTP");
	}
	catch(e)
	{
		try
		{
			XmlHttpObj = new ActiveXObject("Microsoft.XMLHTTP");
		} 
		catch(oc)
		{
			XmlHttpObj = null;
		}
	}
	// if unable to create using IE specific code then try creating for Mozilla (FireFox) 
	if(!XmlHttpObj && typeof XMLHttpRequest != "undefined") 
	{
		XmlHttpObj = new XMLHttpRequest();
	}
}

// called from onChange or onClick event of the continent dropdown list
function CategoryOnChange(change_control) 
{
	change_control_catch = change_control; //from search_gui_ajax.php( loading_fx function )
	//gie ('change_control_catch='+change_control_catch);
    
	var mainList = document.getElementById("menuMain");//menuMain = name of select in search_gui_ajax.php
    var selectedMainID; //Main
    // get selected main from dropdown list
    selectedMainID = mainList.options[mainList.selectedIndex].value;
    //gie ('selectedMainID='+selectedMainID);
    // url of page that will send xml data back to client browser
    var requestUrl;
    // use the following line if using asp
    //requestUrl = "xml_data_provider.asp" + "?filter=" + encodeURIComponent(selectedContinent);
    // use the following line if using php
    requestUrl = "http://www.housinginteractive.com/oop/oop_search/search_gui_provider_main.php" + "?changeMainVal=" + encodeURIComponent(selectedMainID); //changeMainVal to be passed in provider(php) files
	
	CreateXmlHttpObj();
	
	// verify XmlHttpObj variable was successfully initialized
	if(XmlHttpObj)
	{
        // assign the StateChangeHandler function ( defined below in this file)
        // to be called when the state of the XmlHttpObj changes
        // receiving data back from the server is one such change
		XmlHttpObj.onreadystatechange = StateChangeHandler;
		
		// define the iteraction with the server -- true for as asynchronous.
		XmlHttpObj.open("GET", requestUrl,  true);
		
		// send request to server, null arg  when using "GET"
		XmlHttpObj.send(null);		
	}
}


// called from onChange or onClick event of the continent dropdown list
function CountryOnChange(change_control) 
{
	change_control_catch = change_control; //from search_gui_ajax.php( loading_fx function )
	//gie ('change_control_catch='+change_control_catch);//Trace
	
	var mainList = document.getElementById("menuMain");//menuMain = name of select in search_gui_ajax.php
	// get selected main from dropdown list
	var selectedMainID; //Main
    selectedMainID = mainList.options[mainList.selectedIndex].value;
	//gie ('selectedMainID='+selectedMainID);//Trace
	
    var countryList = document.getElementById("menuCountry");//menuCountry id = name of select in search_gui_ajax.php
    // get selected country from dropdown list
    selectedCountryID = countryList.options[countryList.selectedIndex].value;
    //gie ('selectedCountryID='+selectedCountryID);//Trace
	
    // url of page that will send xml data back to client browser
    var requestUrl;
    // use the following line if using asp
    //requestUrl = "xml_data_provider.asp" + "?filter=" + encodeURIComponent(selectedContinent);
    // use the following line if using php
    requestUrl = "http://www.housinginteractive.com/oop/oop_search/search_gui_provider_country.php" + "?changeCountryVal=" + encodeURIComponent(selectedCountryID); //changeMainVal to be passed in provider(php) files
    
	CreateXmlHttpObj();
	
	// verify XmlHttpObj variable was successfully initialized
	if(XmlHttpObj)
	{
        // assign the StateChangeHandler function ( defined below in this file)
        // to be called when the state of the XmlHttpObj changes
        // receiving data back from the server is one such change
		XmlHttpObj.onreadystatechange = StateChangeHandler;
		
		// define the iteraction with the server -- true for as asynchronous.
		XmlHttpObj.open("GET", requestUrl,  true);
		
		// send request to server, null arg  when using "GET"
		XmlHttpObj.send(null);		
	}
}

// called from onChange or onClick event of the continent dropdown list
function RegionOnChange(change_control) 
{
	change_control_catch = change_control; //from search_gui_ajax.php( loading_fx function )
	//alert('change_control_catch='+change_control_catch);//gie
	
	var mainList = document.getElementById("menuMain");//menuMain = name of select in search_gui_ajax.php
	// get selected main from dropdown list
	var selectedMainID; //Main
    selectedMainID = mainList.options[mainList.selectedIndex].value;
	//alert('selectedMainID='+selectedMainID);//gie
	
    var regionList = document.getElementById("menuRegion");//menuCountry id = name of select in search_gui_ajax.php
    // get selected region from dropdown list
    selectedRegionID = regionList.options[regionList.selectedIndex].value;
    //alert('selectedRegionID='+selectedRegionID);//gie
	
    // url of page that will send xml data back to client browser
    var requestUrl;
    // use the following line if using asp
    //requestUrl = "xml_data_provider.asp" + "?filter=" + encodeURIComponent(selectedContinent);
    // use the following line if using php
    requestUrl = "http://www.housinginteractive.com/oop/oop_search/search_gui_provider_region.php" + "?changeRegionVal=" + encodeURIComponent(selectedRegionID); //changeRegionVal to be passed in provider(php) files
    
	CreateXmlHttpObj();
	
	// verify XmlHttpObj variable was successfully initialized
	if(XmlHttpObj)
	{
        // assign the StateChangeHandler function ( defined below in this file)
        // to be called when the state of the XmlHttpObj changes
        // receiving data back from the server is one such change
		XmlHttpObj.onreadystatechange = StateChangeHandler;
		
		// define the iteraction with the server -- true for as asynchronous.
		XmlHttpObj.open("GET", requestUrl,  true);
		//XmlHttpObj.setRequestHeader("text/html","charset=iso-8859-1");
		// send request to server, null arg  when using "GET"
		XmlHttpObj.send(null);		
	}
}

// called from onChange or onClick event of the continent dropdown list
function CityOnChange(change_control) 
{
	change_control_catch = change_control; //from search_gui_ajax.php( loading_fx function )
	//alert('change_control_catch='+change_control_catch);//gie
	
	var mainList = document.getElementById("menuMain");//menuMain = name of select in search_gui_ajax.php
	// get selected main from dropdown list
	var selectedMainID; //Main
    selectedMainID = mainList.options[mainList.selectedIndex].value;
	//alert('selectedMainID='+selectedMainID);//gie
	
    var cityList = document.getElementById("menuCity");//menuCountry id = name of select in search_gui_ajax.php
    // get selected region from dropdown list
    selectedCityID = cityList.options[cityList.selectedIndex].value;
    //alert('selectedRegionID='+selectedRegionID);//gie
	
    // url of page that will send xml data back to client browser
    var requestUrl;
    // use the following line if using asp
    //requestUrl = "xml_data_provider.asp" + "?filter=" + encodeURIComponent(selectedContinent);
    // use the following line if using php
    requestUrl = "http://www.housinginteractive.com/oop/oop_search/search_gui_provider_city.php" + "?changeMainVal=" + encodeURIComponent(selectedMainID) + "&changeCityVal=" + encodeURIComponent(selectedCityID); //changeRegionVal to be passed in provider(php) files
    
	CreateXmlHttpObj();
	
	// verify XmlHttpObj variable was successfully initialized
	if(XmlHttpObj)
	{
        // assign the StateChangeHandler function ( defined below in this file)
        // to be called when the state of the XmlHttpObj changes
        // receiving data back from the server is one such change
		XmlHttpObj.onreadystatechange = StateChangeHandler;
		
		// define the iteraction with the server -- true for as asynchronous.
		XmlHttpObj.open("GET", requestUrl,  true);
		
		// send request to server, null arg  when using "GET"
		XmlHttpObj.send(null);		
	}
}

// this function called when state of  XmlHttpObj changes
// we're interested in the state that indicates data has been
// received from the server
function StateChangeHandler()
{
/*	if(XmlHttpObj.readyState == 0 || XmlHttpObj.readyState == 1 || XmlHttpObj.readyState == 2 || XmlHttpObj.readyState == 3)
	{
		switch(change_control_catch){
			case 2://country
			document.getElementById('menuRegion').innerHTML = "<option>Request sending...</option>";
			break;
			case 3://region
			document.getElementById('menuCity').innerHTML = "<option>Request sending...</option>";
			break;
			case 4://city
			document.getElementById('menuArea').innerHTML = "<option>Request sending...</option>";
			break;
	}

	 //document.getElementById('copy').innerHTML = "Request sending...";
	}
	if(XmlHttpObj.readyState == 1)
	{
	 document.getElementById('copy').innerHTML = "Loading Response...";
	}
	if(XmlHttpObj.readyState == 2)
	{
	 document.getElementById('copy').innerHTML = "Response Loaded...";
	}
	if(XmlHttpObj.readyState == 3)
	{
	 document.getElementById('copy').innerHTML = "Response Ready...";
	}
*/
	// state ==4 indicates receiving response data from server is completed
	if(XmlHttpObj.readyState == 4)
	{
		// To make sure valid response is received from the server, 200 means response received is OK
		if(XmlHttpObj.status == 200)
		{			
			PopulateCategoryList(XmlHttpObj.responseXML.documentElement);
		}
		else
		{
			alert("problem retrieving data from the server, status code: "  + XmlHttpObj.status);
		}
	}
}

// populate the contents of the country dropdown list
function PopulateCategoryList(categoryNode)
{

	//check who call the change
	//switch statement
	switch ( change_control_catch )
	{
		case 1: //Main change. Category must change
		var change_control_catch_val = 'menuCategory'; //name of select that the data to be pass.. Category
		break;

		case 2://Country change. Region must change
		var change_control_catch_val = 'menuRegion'; //name of select that the data to be pass.. Region
		break;

		case 3://Region change. City must change
		var change_control_catch_val = 'menuCity'; //name of select that the data to be pass.. Region
		break;

		case 4://City change. Area must change
		var change_control_catch_val = 'menuArea'; //name of select that the data to be pass.. Region
		break;
		
	}//end switch statement
	
    var categoryList = document.getElementById(change_control_catch_val);
	// clear the country list 
	for (var count = categoryList.options.length-1; count >-1; count--)
	{
		categoryList.options[count] = null;
	}

	var categoryNodes = categoryNode.getElementsByTagName('country');
	//categoryNodes[object HTMLCollection]
		//if(change_control_catch == 3 ){
		//	alert ('categoryNodes='+ categoryNodes);
		//}
	var idValue;
	var textValue; 
	var optionItem;
	// populate the dropdown list with data from the xml doc
	for (var count = 0; count < categoryNodes.length; count++)
	{
   		textValue = GetInnerText(categoryNodes[count]);
		idValue = categoryNodes[count].getAttribute("id");
		//if region change display the output
		//if(change_control_catch == 3 ){
		//	alert ('idValue='+ idValue +'  textValue='+textValue);
		//}
		//output = the special chars is broked
		
		//gie('idValue='+idValue);//Trace
		optionItem = new Option( textValue, idValue,  false, false);
		categoryList.options[categoryList.length] = optionItem;
		//XmlHttpObj.setRequestHeader("text/html","charset=iso-8859-1");
	}
}

// returns the node text value 
function GetInnerText (node)
{
	 return (node.textContent || node.innerText || node.text) ;
}