//*****
//***** Use this function to AutoComplete the text being typed in the textbox input field "obj"
//***** with the values found in the array "ArrayObj"  
//***** (Make sure ArrayObject elements are in alphabetic order - ie ArrayObject.sort(); )
//*****
var HideBoxTimer = 0;
function AutoComplete(obj, evt, ArrayObj) {
 // if object parameter, event paramenter, or array have no value then return
 if ((!obj) || (!evt) || (ArrayObj.length == 0)) return;

 // Check to see if text  oject has been assigned an id 
 // if not send alert and quit function
 if (obj.id == "") {
  obj.value = "";
  setTimeout("alert('This function will not work unless the INPUT tag has an ID value assigned to it.');",1);
  return;
 }

 // If there is no name assined to the object then make it the same as the ID
 if (obj.name == "") obj.name = obj.id;
	
 // Check to see if text input object has a value in it. If not there's nothing to 
 // complete, so display all possible choices in select box then quit function
 if (obj.value.length == 0) {
  BuildSelectBox (obj, '', ArrayObj);
  return;
 }

 // Set the "elm" variable with the right value of the key in accordance with the browser
 var elm = (obj.setSelectionRange) ? evt.which : evt.keyCode;

 // Evaluate the key code - return if non-text key was pressed (arrows, delete, backspace, etc..)
 if ((elm < 32) || (elm >= 33 && elm <= 46) || (elm >= 112 && elm <= 123)) return;

 // Retrieve the initial position of the selection in the textbox input field
 // This is done by different ways in the case of MSIE or Mozilla
 if (obj.createTextRange) { // MSIE
  var rng = document.selection.createRange();
  if (rng.parentElement() == obj) {
   elm = rng.text;
   var ini = obj.value.lastIndexOf(elm);
  }
 } else if (obj.setSelectionRange) { // Mozilla
  var ini = obj.selectionStart;
 }

 // Search the array using a for loop, find matches for the text typed in the textbox input field
 var TypedTxt = obj.value;
 for (var i = 0; i < ArrayObj.length; i++) {
  elm = ArrayObj[i].toString();

  // If a match is found it is appended to the end of text in the textbox input field and stop looping.
  if (elm.toLowerCase().indexOf(TypedTxt.toLowerCase()) == 0) {
   obj.value += elm.substring(TypedTxt.length, elm.length);
   break;
  }
 }

 // Add a selection to the text value of the object (start at position "ini")
 // This is done by different ways in the case of MSIE or Mozilla
 if (obj.createTextRange) { // MSIE
  rng = obj.createTextRange();
  rng.moveStart("character", ini);
  rng.moveEnd("character", obj.value.length);
  rng.select();
 } else if (obj.setSelectionRange) { // Mozilla
  obj.setSelectionRange(ini, obj.value.length);
 }

 // Call the function which builds the select box showing all possible matches
 BuildSelectBox (obj, TypedTxt, ArrayObj);

}


//*****
//***** Create DIV object through DOM in order to place a select box 
//***** directly underneath the input field (obj).  Populate the select
//*****	box with values from the array (ArrayObj) that match with the
//***** Typed text
//*****
function BuildSelectBox (obj, TypedTxt, ArrayObj) {

 // Figure out where the input field object is on the screen by adding 
	// up all the offsets for all the containing parent objects
 var box_top = 0;
 var box_left = 0;
 var box_width = obj.clientWidth + 4;
	
 var theObj = obj;
 while(theObj) {
  box_left += theObj.offsetLeft;
  box_top += theObj.offsetTop + 1;
  theObj = theObj.offsetParent;
 }

 // Add Height to Make Box show up underneath the input field
 box_top += obj.clientHeight;
	
 // Create DIV tag object through DOM if it does not already exist
 if (document.getElementById("Box") == null) {
  boxdiv = document.createElement('div');
  document.body.appendChild(boxdiv);
  boxdiv.setAttribute('id', 'Box');
  boxdiv.onfocus = function() { clearTimeout(HideBoxTimer); } // Cancel HideBoxTimer when Box is clicked on
 } else {
  boxdiv = document.getElementById("Box");
 clearTimeout(HideBoxTimer); // Clear any pre-existing HideBoxTimer's ever
 }
	
 boxdiv.style.display = 'block';
 boxdiv.style.position = 'absolute';
 boxdiv.style.top = box_top + 'px';
 boxdiv.style.left = box_left + 'px';
 boxdiv.style.border = "0px solid #7F9DB9";
 boxdiv.style.textAlign = 'left';
	
 // Javascript that causes the current select box value to
 // to be copied to the input text field when the user selects it
 var AssignValue = "document.getElementById(\"" + obj.id + "\").value=this.value; document.getElementById(\"" + obj.id + "\").select();";

 // Javascript that causes the box to be hidden
 var HideBox = "document.getElementById(\"Box\").style.display=\"none\";";

 // Now string them together to be used for onChange in the select statement
 var OnChangeFunction = AssignValue + HideBox;

 // Start building select statement to hold values
 var HTMLcode = "<select size='4' tabindex='-1' style='width:" + box_width + "px' onChange='" + OnChangeFunction + "'>";

 // Populate Select statement with values that match what the user has typed so far
 for (var i = 0; i < ArrayObj.length; i++) {
  elm = ArrayObj[i].toString();
  if (elm.toLowerCase().indexOf(TypedTxt.toLowerCase()) == 0) {
   HTMLcode += "<option value='" + elm + "'>" + elm + "</option>";
  }
 }
 HTMLcode += "</select>";
	
 // Assign select statment to DIV tag.
 boxdiv.innerHTML = HTMLcode;
}

//*****
//***** Use this function to Validate the Autocomplete field (the textbox input field "obj")
//***** against the elements found in the Array "ArrayObj"
//*****
function ValidateAutoComplete(obj,ArrayObj) {
 var WeCool = false;

 // if input field textbox has a value then make sure it is one from the ArrayObj	
 if (obj.value.length > 0) { 
	
  // If input field value is found in the array then set flag to true
  var txt = obj.value;
  for (var i = 0; i < ArrayObj.length; i++) {
   elm = ArrayObj[i].toString();
   if (elm.toLowerCase() == txt.toLowerCase()) {
    WeCool=true;
    break;
   }
  }

  // If input field value was never found then spit out an error message
  if (!WeCool) {
   alert ('Please enter a valid value or leave field empty');

   // Set focus to field: 
   // (Gets around the issue where Firefox won't let you set 
   //  focus to something in an event fired by that object)
   var cmd1 = 'document.getElementsByName("'+obj.id+'")[0].focus();';
   setTimeout(cmd1,0);
		
   // Set select on field (Works in Firefox and IE)
   // (Gets around the issue where Firefox won't let you set 
   //  focus to something in an event fired by that object)
   var cmd2 = 'document.getElementsByName("'+obj.id+'")[0].select();';
   setTimeout(cmd2,0);

   return false;
  }
 }
	
 // Wait 100 click ticks then hide Box 
 // This gives time for the timer to be canceled if you click in the select box
 // to select an item.  Otherwise the select box will be hidden.
 if (document.getElementById("Box")) {
  var cmd3 = 'document.getElementById("Box").style.display="none";';
  HideBoxTimer = setTimeout(cmd3,100);
 }

 return true;
}

//*****
//***** Use this function to get a reference to the Previous object (the one right before my_obj)
//***** previousSibling will interpet spaces or line-breaks in the source code as DOM nodes 
//***** This function will ignore it and but will only return the previous HTML element, 
//***** ignoring text nodes
//*****
function previousObject (my_obj) {
 var prev_obj = my_obj;
 do prev_obj = prev_obj.previousSibling;
 while (prev_obj && prev_obj.nodeType != 1);
 return prev_obj;
}

//*****
//***** Use this function to get a reference to the Next object (the one right after my_obj)
//***** nextSibling will interpet spaces or line-breaks in the source code as DOM nodes 
//***** This function will ignore it and but will only return the net HTML element, 
//***** ignoring text nodes
//*****
function nextObject (my_obj) {
 var next_obj = my_obj;
 do next_obj = next_obj.nextSibling;
 while (next_obj && next_obj.nodeType != 1);
 return next_obj;
}