var _highlightSuggestionIndexState = -2;

var _highlightDivState = null;
var _selectedIndexState = -1; 
var _divObjectState = null;
var SIZE_STATE=0;
function DisplayState() 
{
  if(_selectedIndexState > -1) 
  { 
  var selectedWord = document.getElementById("statesuggestions").childNodes[_selectedIndexState].nodeValue; 
  document.getElementById("stateofinterest").value = selectedWord; 
  }
  else 
  {    
    document.getElementById("stateofinterest").value = ""; 
  }  
  
  // Hide the DIV Element 
  document.getElementById("statesuggestions").style.visibility = "hidden"; 
  
  
}

function SearchState(element,event) 
{ 
    var charCode = event.keyCode;
    var inputField=element;
   	// Send to the Server Side Method to get the string 
    if( inputField.value.length > 0 && (charCode >=65 && charCode <=90 || charCode >= 97 && charCode <=122) ) {
    	var url="/servlet/validate?region=state&id=" + encodeURIComponent(inputField.value);
    	
 		if (typeof XMLHttpRequest != "undefined") {
       		req = new XMLHttpRequest();	//FOR MOZILLA FIREFOX
   		} else if (window.ActiveXObject) {
       		req = new ActiveXObject("Microsoft.XMLHTTP"); //FOR IE
   		}
   		req.open("GET", url, true);
   		req.onreadystatechange = callback_state;
   		req.send(null);
   		
    }
    // if the backspace key (8) is pressed and 48 is for the delete button
    else if(charCode == 8 || charCode == 48) 
    {
        // Reset the count
        _highlightSuggestionIndexState = -2; 
        if ( inputField.value.length == 0) {
        //	document.getElementById("suggestions").style.visibility = "hidden"; 
        	document.getElementById("statesuggestions").innerHTML = ""; 
			document.getElementById("statesuggestions").style.height = "0px"; 
			document.getElementById("statesuggestions").style.width = "0px"; 
			
		}        	
        if( inputField.value.length > 0  ) {
    		var url = "/servlet/validate?region=state&id=" + encodeURIComponent(inputField.value);
   	   		if (typeof XMLHttpRequest != "undefined") {
       			req = new XMLHttpRequest();
   			} else if (window.ActiveXObject) {
       			req = new ActiveXObject("Microsoft.XMLHTTP");
   			}
   			req.open("GET", url, true);
	   		req.onreadystatechange = callback_state;
   			req.send(null);  
    	}
    }
    
    // when the down arrow key is pressed 
    else if(charCode == 40) 
    {   
    	
    	
    	if(_highlightSuggestionIndexState==-2  ){
    		_highlightSuggestionIndexState+=2;
    		selectState(document.getElementById("state"+_highlightSuggestionIndexState));          
   
    	}else if(_highlightSuggestionIndexState>=0 && _highlightSuggestionIndexState <= SIZE_STATE){
        	deselectState(document.getElementById("state"+_highlightSuggestionIndexState));
        	_highlightSuggestionIndexState+=2;
        	selectState(document.getElementById("state"+_highlightSuggestionIndexState));
        }
    }
    // When the up arrow key is pressed
    else if(charCode == 38) 
    {
    	//alert( "INDEX: "+_highlightSuggestionIndexState+" SIZE_STATE: "+SIZE_STATE);
        if(_highlightSuggestionIndexState >= SIZE_STATE){
        //	alert("city"+SIZE_STATE);
        	deselectState(document.getElementById("state"+SIZE_STATE));
        	_highlightSuggestionIndexState=SIZE_STATE-2;
       		selectState(document.getElementById("state"+_highlightSuggestionIndexState));
        }else if( _highlightSuggestionIndexState > 0){
        	deselectState(document.getElementById("state"+_highlightSuggestionIndexState));
        	_highlightSuggestionIndexState-=2;
        	selectState(document.getElementById("state"+_highlightSuggestionIndexState));
        }
        else if( _highlightSuggestionIndexState==0){
        	deselectState(document.getElementById("state"+_highlightSuggestionIndexState));
        	_highlightSuggestionIndexState=0;       	
			selectState(document.getElementById("state"+_highlightSuggestionIndexState));
		}
    }
    //WHEN ENTER IS PRESSED 
    else if (charCode==13){
    	defaultFillState();
    }    
}

function callback_state(response) 
{
    if (req.readyState == 4) {
    	 
        if (req.status == 200) {
            // update the HTML DOM based on whether or not message is valid
           
            parseMessageState();
        }
        else if (req.status == 404 ){
        //	alert("URL DOES NOT EXISTS");
        	
        }else{
        //	alert("STATUS IS : "+req.status);
        }
    }

 
}
function parseMessageState(){
	var response=req.responseText;
	setMessageState(response);
}
function setMessageState(message){
	var mdiv = document.getElementById("statesuggestions");
	if ( message == ""){
		mdiv.innerHTML = "<div style=\"color:red\">Invalid State Name</ div>";
	}else{
		mdiv.style.visibility="visible";
		document.getElementById("statesuggestions").style.height = "100%"; 
		document.getElementById("statesuggestions").style.width = "100%"; 
		mdiv.innerHTML=message;
	}
	SIZE_STATE=2*document.getElementById("statelist").getElementsByTagName("li").length-2;
}

// BEHAVIOUR FUNCTIONS FUNCTIONS 


function selectState( element){
	element.style.backgroundColor="white";
	tempfillState(document.getElementById('stateofinterest'),element);
}

function deselectState(element){
	element.style.backgroundColor="#d1e2f4";
}

function fillState( inputElement, element){
	var filldata=element.firstChild.data;
	inputElement.value=filldata;
	document.getElementById('statesuggestions').innerHTML="";
	document.getElementById("statesuggestions").style.height = "0px"; 
	document.getElementById("statesuggestions").style.width = "0px"; 
	document.getElementById("statesuggestions").visibility="hidden";
}
function tempfillState ( inputElement, element){
	var filldata=element.firstChild.data;
	inputElement.value=filldata;
}
function defaultFillState(){
	
	if (_highlightSuggestionIndexState >= 0)
		document.getElementById("stateofinterest").value=document.getElementById("state"+_highlightSuggestionIndexState).firstChild.data;
	else if (document.getElementById("stateofinterest").value != "")
		document.getElementById("stateofinterest").value="";
	document.getElementById("statesuggestions").innerHTML = ""; 	
	document.getElementById("statesuggestions").style.visibility = "hidden"; 
	document.getElementById("statesuggestions").style.height = "0px"; 
	document.getElementById("statesuggestions").style.width = "0px"; 
}