/* 
Author:  Patrick Walker, pwalker@quirkcars.com, pat@patrickbricewalker.com
Summary: This javascript file is used to call a server-side script which returns an array
         the goal here is to populate a select box of vehicle model id's and names for given vehicle make id
         the database table relationship is one make vehicle to many vehicle models
         the overall process will be,
         0) user is filling out a form
         1) begin program when user selects a make from dropdown (onchange event of select box
         2) set up request, set url with post data, send request to php script
         3) when php script return result is ready, the data will be handled by another javascript function
         4) data is handled.  the data is loaded into the dropdown select box.
         5) user has new options
         
*/

var xmlHttp;
var modelsDropdown = ''; /* define as dropdown being used at start or request */

/* note that this function can be used for any and all requests (only needed once on site) */
function createXMLHttpRequest() {

	/* check if an activeX will work */
  if (window.ActiveXObject) {

			/* activeX works.  use it */
      xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

		/* otherwise, try an xml request */
  } else if (window.XMLHttpRequest) {

			/* xml request wiil work. use it */	
      xmlHttp = new XMLHttpRequest();

  }

}

/* function to be called from web page */
function MODELS_generate(make_id, models_select) {

	/* begin request */
	createXMLHttpRequest();    
	
	/* define the dropdown now. needed when populating the dropdown */
	modelsDropdown = getElement(models_select);	

	/* don't let user operate dropdown while loading */
	modelsDropdown.disabled=true;		

	/* empty select box options leaving 1 option */
	while (1 < modelsDropdown.options.length) {

		/* set to null */
		modelsDropdown.options[(modelsDropdown.options.length - 1)] = null;

	}

	/* set the select single option to day 'Loading Models' */
	var jLoadingArray = "('Loading Models ','0')";	
	eval("modelsDropdown.options[0]=" + "new Option" + jLoadingArray);
	
	/* set url to pass post data to - in most cases, like this one, we want to keep the rights strict
	   to prevent other sites from using our data.  (data is general but let's not allow any piggy-backs) */
  var url = "/includes/ajax/ajax_get_make_models.inc.php?timeStamp=" + new Date().getTime();

	/* pass in make_id */
  var queryString = "make=" + make_id;	

	/* Post to this url */ 
  xmlHttp.open("POST", url, true);	
  
  /* function that is called during the exchange */
  xmlHttp.onreadystatechange = MODELS_handleSavedData;	
  
  /* need to set the header of data being sent */
  xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");   

	/* do it */
  xmlHttp.send(queryString);	
}


function MODELS_handleSavedData() {

	/* wait for return state of request (it's running)*/
	if(xmlHttp.readyState == 4)  {

		/* wait for finish status (it's done)*/
    if(xmlHttp.status == 200) {

    	/* alright. let's when what we have */
			var ModelsToAdd = eval(xmlHttp.responseText);

			/* get ride of upper slots that will not be used */
			while (ModelsToAdd.length < modelsDropdown.options.length) {

				/* set to null */
				modelsDropdown.options[(modelsDropdown.options.length - 1)] = null;

			}
			for (var i=0; i < ModelsToAdd.length; i++) {

				/* load the data.  need to use eval because it's an ModelsToArray is an array of arrays */
				eval("modelsDropdown.options[i]=" + "new Option" + ModelsToAdd[i]);

			}

			/* re-activate for user */
			modelsDropdown.disabled=false;
    }

  }

  /*  a back up function can't be used here because the js is constantly trying to get the result from the php script
			this explains the readystate and status xml variable.
			best approach is to alway return a result even if the result say there is nothing available
			otherwise the js will hang and most likely crash the user browser
	*/

}