var citiesRequest;
var req;
var selectedIndex = 0;
var cities;
var positionX;
var positionY;
var cityNames = new Array();

var ENTER_KEY = 13;
var UP_KEY = 38;
var DOWN_KEY = 40;
var TAB_KEY =  9;

if (window.XMLHttpRequest) 
{
	citiesRequest = new XMLHttpRequest();
}
else if (window.ActiveXObject) 
{
	citiesRequest = new ActiveXObject("Microsoft.XMLHTTP");
}

function getCityNames(e,posX,posY,numChar)
{
	positionX = posX;
	positionY = posY;
    if (navigator.appName.indexOf("Explorer")==-1){
		positionX = positionX+5;
		positionY = positionY;
	}
	if (!e)
	{
		var e = window.event;
	}
	if (e.keyCode==13 || e.keyCode==9 || e.keyCode==18 ||e.keyCode==UP_KEY || e.keyCode==DOWN_KEY )
	{
		return;
	}
	if (e.keyCode == 27)
	{
		document.getElementById("tableDiv").style.display = "none";
		return;
	}
	if(document.getElementById("otherCityCode").checked==true)
	{
		var citySubstring = trim(document.getElementById("otherCity").value);
		if (citySubstring.length<numChar)
		{
			document.getElementById("tableDiv").style.display = "none"
			selectedIndex = 0;
			return;
		}
		document.getElementById("tableDiv").style.position = "absolute";
//		document.getElementById("tableDiv").style.height = "13px"
	//	document.getElementById("tableDiv").style.left= positionY
		if (navigator.appName.indexOf("Explorer")!=-1)
		{
	//		document.getElementById("tableDiv").style.top = positionX - 10;//+ height;
	//		document.getElementById("tableDiv").style.left = positionY;
		}
		else
		{
		//	document.getElementById("tableDiv").style.top = positionX-20 ;//+ height;
		//	document.getElementById("tableDiv").style.left = positionY-1;
		}
		document.getElementById('tableDiv').style.display = "block";
		document.getElementById('tableDiv').innerHTML = "<table align=center><tr><td><img src='images/short_Progress.gif'></td></tr></table>";
		document.getElementById('otherCity').style.cursor = "wait"
	//	alert("citySubstring:: "+  citySubstring);
//		(new RegExp("q=[^&$]*"),"q="+qe)
	//	alert("citySubstring:: "+encodeURIComponent(citySubstring));
//		citySubstring = citySubstring.replace(new RegExp("q=[^&$]*"))
	//    citySubstring = citySubstring.replace("&" , "%26");
	//	alert("citySubstring :: "+ citySubstring )
		citiesRequest.open("Get" , "TestAjaxServlet.do?method=getMatchingCities&CitySubstring=" + encodeURIComponent(citySubstring));
		citiesRequest.send(null);
		citiesRequest.onreadystatechange = showRetrievedCities;
		if (citiesRequest.readyState==4)
		{
			showRetrievedCities()
		}
	}
}
var cityNamesArray = new Array("Goa" , "Manali" , "New Delhi And NCR" , "Shimla" , "Jaipur" , "Mumbai" , "Agra" , "Port Blair" , "Nainital" , "Srinagar" , "Mussoorie" , "Puri" , "Udaipur" , "Bangalore" , "Chennai" , "Darjeeling" , "Munnar" , "Ooty" , "Cochin" , "Corbett" , "Kumarakom" , "Lakshadweep" , "Garhmukteshwar" , "Kodaikanal" , "Kovalam" , "Vishakhapatnam" , "Coorg" , "Haridwar" , "Kolkata" , "Jodhpur" , "Dalhousie" , "Chandigarh" , "Ajmer" , "Leh" , "Khajuraho" , "Pune" , "Mysore" , "Hyderabad" , "Katra" , "Coonoor" , "Rishikesh" , "Jaisalmer" , "Dharamshala" , "Shirdi" , "Gwalior" , "Ranthambhore" , "Kasauli" , "Bhimtal" , "Ahmedabad" , "Gangtok" , "Poovar" , "Lucknow" , "Tirupati" , "Thekkady" , "Nahan" , "Mandawa" , "Pondicherry" , "Mahabalipuram" , "Parwanoo" , "Paradeep" , "Amritsar" , "Madurai" , "Bhopal" , "Kanataal" , "Ranikhet" , "Kalimpong" , "Kausani" , "Kanyakumari" , "Allepey" , "Mount Abu" , "Hassan" , "Matheran" , "Kosi" , "Chikmangalur" , "Bharatpur" , "Bhubaneshwar" , "Alwar" , "Chail" , "Aurangabad" , "Nalagarh" , "Thiruvananthapuram" , "Sariska" , "Yercaud" , "Varanasi" , "Kabini" , "Guwahati" , "Kuchesar" , "Rameshwaram" , "Lonavala And Khandala" , "Binsar" , "Panchgani" , "Nasik" , "Mangalore" , "Ranakpur" , "Kanpur" , "Kolhapur" , "Lunagad" , "Alibagh" , "Nagpur" , "Coimbatore" , "Indore" , "Allahabad" , "Mathura" , "Pushkar" , "Vadodara" , "Dehradun" , "Auli" , "Surat" , "Anand" , "Raipur" , "Gandhidham" , "Jamnagar" , "Bhilai" , "Patnitop" , "Kanha" , "Gandhinagar" , "Shekhawati" , "Sawai Madhopur" , "Gulmarg" , "Jammu" , "Pahalgam" , "Mahabaleshwar" , "Chambal" , "Panna" , "Jabalpur" , "Vijaywada" , "Ludhiana" , "Durgapur" , "Badrinath" , "Jamshedpur" , "Calicut" , "Vapi" , "Orchha" , "Khimsar" , "Kota" , "Bandhavgarh" , "Dandeli" , "Chittorgarh" , "Ujjain" , "Palampur" , "Jorhat" , "Shillong" , "Ropar" , "Phalodi" , "Pali" , "Pragpur" , "Wayanad" , "Behror" , "Khajjiar" , "Tanjore" , "Jalandhar" , "Bikaner" , "Rajkot" , "Diu" , "Rumtek" , "Chamba" , "Karwar" , "Udipi" , "Kottayam" , "Pelling" , "Kollam" , "Varkala" , "Almora" , "Ramgarh Uttaranchal" , "Moradabad" , "Kumbalgarh" , "TestingCity" , "NewHotel" , "Pauri" , "Guruvayoor" , "Gurgaon" , "Noida" , "Bombay" , "Andaman" , "Madras" , "Kochi" , "Calcutta" , "Secunderabad" , "Trivandrum" , "Baroda" );
var cityCodesArray = new Array( "GOI" , "KUU" , "DEL" , "SLV" , "JAI" , "BOM" , "AGR" , "IXZ" , "XNT" , "SXR" , "XMS" , "XPR" , "UDR" , "BLR" , "MAA" , "IXB" , "XMN" , "XOO" , "COK" , "XCO" , "XKU" , "AGX" , "XGM" , "XKO" , "XOV" , "VTZ" , "XCR" , "XHA" , "CCU" , "JDH" , "XDA" , "IXC" , "XAJ" , "IXL" , "HJR" , "PNQ" , "XMY" , "HYD" , "XKA" , "XCN" , "XRI" , "JSA" , "XDH" , "XSH" , "GWL" , "XRA" , "XKS" , "XBH" , "AMD" , "XGA" , "XPO" , "LKO" , "TIR" , "XTH" , "XNH" , "XMA" , "XPC" , "XMB" , "XPA" , "XEE" , "ATQ" , "IXM" , "BHO" , "XAL" , "XNK" , "XKL" , "XAU" , "XKY" , "XLL" , "XMU" , "XSS" , "XAT" , "XSI" , "XCH" , "XHR" , "BBI" , "XLW" , "XHI" , "IXU" , "XLG" , "TRV" , "XSA" , "XYE" , "VNS" , "XBI" , "GAU" , "XKC" , "XAE" , "XLK" , "XIA" , "XPN" , "XNS" , "IXE" , "XAK" , "KNU" , "KLH" , "XLU" , "XGH" , "NAG" , "CJB" , "IDR" , "IXD" , "XAR" , "XPU" , "BDQ" , "XDE" , "XLI" , "XSU" , "XAN" , "XAP" , "XGN" , "XJA" , "XBL" , "XPT" , "XAH" , "XGR" , "XKH" , "XSM" , "XGU" , "IXJ" , "XPH" , "XMH" , "XCA" , "XNN" , "XAB" , "XVI" , "XLD" , "XDU" , "XBA" , "XJM" , "XCL" , "XVA" , "XOR" , "XKI" , "XOK" , "XBN" , "XDN" , "XCI" , "XUJ" , "XPL" , "JRH" , "SHL" , "XRO" , "XPD" , "XLA" , "XPG" , "XWA" , "XBE" , "XKJ" , "XTA" , "XJL" , "XBK" , "XRJ" , "DIU" , "XRU" , "XNC" , "XKW" , "XUD" , "XTT" , "XPE" , "XLM" , "XVR" , "XLR" , "XUT" , "XMO" , "XKM" , "TCV" , "NEW" , "XPI" , "XGV" , "DEL" , "DEL" , "BOM" , "IXZ" , "MAA" , "COK" , "CCU" , "HYD" , "TRV" , "BDQ" );

// populate Hotel city On Body Load 

function populateCities()
{	
	// alert(" populate Hotel City From Context ---");
	//citiesRequest.open("Get" , "TestAjaxServlet.do?method=getMatchingCities&CitySubstring=",true);	
	citiesRequest.open("Get" , "TestAjaxServlet.do?method=getMatchingCities&CitySubstring=&Date="+new Date(),true);	
	for (var count=0;count<document.getElementById("cityName").length; count++ ){	
		document.getElementById("cityName").options[count+1] = null;					
	}
	citiesRequest.onreadystatechange = function (){				
		if (citiesRequest.readyState==4){
			if (citiesRequest.status==200){				
				var citiesList = citiesRequest.responseXML.getElementsByTagName("City")	
		
					// For Adding City in Option Pane

				//document.getElementById("cityName").options[1] = new Option("---------------------","dotedLine",false,false);
				document.getElementById("cityName").options[1] = new Option("Goa","GOI",false,false);
				document.getElementById("cityName").options[2] = new Option("Mumbai","BOM",false,false);
				document.getElementById("cityName").options[3] = new Option("Kodaikanal","XKO",false,false);
				document.getElementById("cityName").options[4] = new Option("New Delhi & NCR","DEL",false,false);
				document.getElementById("cityName").options[5] = new Option("Manali","KUU",false,false);
				document.getElementById("cityName").options[6] = new Option("Ooty","XOO",false,false);
				document.getElementById("cityName").options[7] = new Option("Bangalore","BLR",false,false);
				document.getElementById("cityName").options[8] = new Option("Shimla","SLV",false,false);
				document.getElementById("cityName").options[9] = new Option("---------------------","dotedLine",false,false);
				for (var count=0;count<citiesList.length; count++ )
				{	
					var cityNameElement = citiesList.item(count).getElementsByTagName("City-Name")[0];
					
					var cityCodeElement = citiesList.item(count).getElementsByTagName("City-Code")[0];
					document.getElementById("cityName").options[count+10] = new Option(cityNameElement.firstChild.nodeValue,cityCodeElement.firstChild.nodeValue,false,false);					
				}
			}//if (citiesRequest.status==200){
            else{	
				//For exceptional cases,populating the Hardcoded Cities
				for (var cityIndex=0; cityIndex < cityNamesArray.length;cityIndex++){					
					document.getElementById("cityName").options[cityIndex+1] = new Option(cityNamesArray[cityIndex],cityCodesArray[cityIndex],false,false);
				}
			}
		}//if (citiesRequest.readyState==4){				
	}//citiesRequest.onreadystatechange = function (){	
   citiesRequest.send("");

   /* This will be useful when the ready state of the request object becomes 4 in the begining itself
   if (citiesRequest.readyState==4)
   {
		
			if (citiesRequest.status==200){				
				var citiesList = citiesRequest.responseXML.getElementsByTagName("City")				
				for (var count=0;count<citiesList.length; count++ )
				{	
					var cityNameElement = citiesList.item(count).getElementsByTagName("City-Name")[0];			
					var cityCodeElement = citiesList.item(count).getElementsByTagName("City-Code")[0];
					document.getElementById("cityName").options[count+1] = new Option(cityNameElement.firstChild.nodeValue,cityCodeElement.firstChild.nodeValue,false,false);					
				}
			}//if (citiesRequest.status==200){
            else{	
				//For exceptional cases,populating the Hardcoded Cities
				for (var cityIndex=0; cityIndex < cityNamesArray.length;cityIndex++){					
					document.getElementById("cityName").options[cityIndex+1] = new Option(cityNamesArray[cityIndex],cityCodesArray[cityIndex],false,false);
				}
			}
   }
   */
}

function showRetrievedCities()
{
	
		if (citiesRequest.readyState==4)
		{
			document.getElementById('otherCity').style.cursor = "text"
			cities = new Array();
			cityNames = new Array();
			var responseDoc = citiesRequest.responseXML
	//		alert("citiesRequest response:: "+ citiesRequest.responseText);
			var citiesList = responseDoc.getElementsByTagName("City")
			var tableString = "<TABLE WIDTH='100%'>";
			for (var count=0;count<citiesList.length; count++ )
			{
				
				var city = citiesList.item(count);
				var cityNameElement = city.getElementsByTagName("City-Name")[0];
				var cityName = cityNameElement.firstChild.nodeValue;
				cityNames[cityNames.length] = cityName;
				var cityCodeElement = city.getElementsByTagName("City-Code")[0];
				var cityCode = cityCodeElement.firstChild.nodeValue;
				tableString += "<TR>";
				cities[cities.length] = cityCode;
				var otherCitySubstring = document.getElementById('otherCity').value;
				var boldString = "<B>" + otherCitySubstring + "</B>";
				var displayCityName = cityName.replace(otherCitySubstring , boldString); 
				tableString += "<TD WIDTH='100%'><a href='#s' name='Link' onclick='putValues(event,\""+ count+"\");' style='color:#005893'>" +displayCityName+"</a></TD>";
				tableString += "</TR>";
			}
			tableString += "</TABLE>";
			if (citiesList.length>0)
			{
					document.getElementById("tableDiv").innerHTML =  tableString;
					document.getElementById("tableDiv").style.position = "absolute";
					if(citiesList.length<3)
					{
						document.getElementById("tableDiv").style.height=citiesList.length*21;
					}
					else
					{
						document.getElementById("tableDiv").style.height=63;
					}
					if(selectedIndex<0)
					{
						selectedIndex = 0;
					}
					if(selectedIndex >= citiesList.length )
					{
						selectedIndex = 0;
					}					
					document.getElementsByName("Link")[selectedIndex].parentNode.parentNode.bgColor = "#82CAFF"
			}
			else
			{
				document.getElementById("tableDiv").style.display = "none"
				createArrows();
				alert("Invalid City name. Please try again.");
				document.getElementById('otherCity').value = "";
			}
		}
	}

	





     function  keyPressed(e)
	 {
			if (window.event)
			{
					var keyCode = window.event.keyCode;
			}
			else  
			{
					var keyCode = e.keyCode
			}
			if (keyCode==ENTER_KEY)
			{
				enterPressed(e);
			}

			if (keyCode==TAB_KEY)
			{
				if (selectedIndex!=-1 && cities!=null && cities.length>0)
				{
					document.getElementById('otherCityCode').checked = true;
					document.getElementById('otherCityCode').value= cities[selectedIndex];
					var name;
					if ( cityNames[selectedIndex].indexOf(")")!=-1)
					{
							var index1 = cityNames[selectedIndex].indexOf("(");
							var index2 = cityNames[selectedIndex].indexOf(")")
							name = cityNames[selectedIndex].substring(index1+1 , index2);
					}
					else
					{
							name = cityNames[selectedIndex];
					}
			//		alert("name:: "+ name);
					document.getElementById('otherCity').value= name;
					document.getElementById("tempCityName").value =  name;
					document.getElementById('tableDiv').style.display = "none";
					document.getElementById('tableDiv').style.display = "none";
				
					e.cancelBubble = true;
				}
			}
			createArrows();

	/*		if (keyCode==DOWN_KEY)
			{
				moveDown();
			}
			if (keyCode==UP_KEY)
			{
				moveUp();
			}*/
	 }
	

	function moveUp()
	{
			var totalMatches = getTotalMatches();
			//alert("totalMatches : "+totalMatches);
			//alert("totalMatches : "+document.getElementById("otherCity").value.length);
			if(totalMatches > 0 && document.getElementById("otherCity").value.length>=2)
			{
				totalMatches = document.getElementsByName("Link").length;
				document.getElementsByName("Link")[selectedIndex].parentNode.parentNode.bgColor = "#FFFFFF"
				if (selectedIndex==0)
				{
					selectedIndex = totalMatches - 1;
				}
				else
				{
					selectedIndex -= 1;
				}
				alert("setting the city name to:" + cityNames[selectedIndex]);
				document.getElementById("tempCityName").value = cityNames[selectedIndex];
				document.getElementById("otherCityCode").value = cities[selectedIndex];
				document.getElementsByName("Link")[selectedIndex].parentNode.parentNode.bgColor = "#82CAFF";
				try
				{
					document.getElementsByName("Link")[selectedIndex].focus();
					document.getElementById("otherCity").focus();
				}
				catch(e)
				{

				}
			}
			createArrows();
	}



	function moveDown()
	{
//			alert("in move down");
			var totalMatches = getTotalMatches();
		//	alert("totalMatches : "+totalMatches);
		//	alert("totalMatches : "+document.getElementById("otherCity").value.length);
		//	alert("selectedIndex : "+selectedIndex);
			if(selectedIndex >= document.getElementsByName("Link").length ){
					selectedIndex=0;
			}
			if (totalMatches > 0 && document.getElementById("otherCity").value.length>=2)
			{
				document.getElementsByName("Link")[selectedIndex].parentNode.parentNode.bgColor = "#FFFFFF"
				//alert(totalMatches-1);
				if (selectedIndex==totalMatches-1)
				{
					selectedIndex = 0;
				}
				else
				{
					selectedIndex += 1;
				}
				if(selectedIndex >= document.getElementsByName("Link").length ){
					selectedIndex=0;
				}
				document.getElementsByName("Link")[selectedIndex].parentNode.parentNode.bgColor = "#82CAFF"
				alert("setting the city name to:" + cityNames[selectedIndex]);
				document.getElementById("tempCityName").value = cityNames[selectedIndex];
				document.getElementById("otherCityCode").value = cities[selectedIndex];
				//alert(selectedIndex+"  "+document.getElementsByName("Link").length);
				try
				{
					document.getElementsByName("Link")[selectedIndex].focus();
					document.getElementById("otherCity").focus();				
				}
				catch (e)
				{
				}				
			}
			createArrows();
	}
		

	function getTotalMatches()
	{
			var totalMatches;
			if (document.getElementsByName("Link")==null || document.getElementsByName("Link").length==0)
			{
				totalMatches = 0;
			}
			else
			{
				totalMatches = document.getElementsByName("Link").length;
			}
			return totalMatches;
	}

	function setColors()
	{
		var totalMatches = getTotalMatches();
		for (var count=0;count<totalMatches ;count++ )
		{
			var row = 	document.getElementsByName("Link")[count].parentNode.parentNode;
			if (count==selectedIndex)
			{
				row.bgcolor = "#82CAFF";
			}
			else
			{
				row.bgcolor = "#FFFFFF";
			}
		}
	}



	function putValues(e , count)
	{
	alert("count:: "+ count);
//		alert(cityNames.length);
		if (count<0 || cityNames.length==0)
		{
			return;
		}
		var name;
		if ( cityNames[count].indexOf(")")!=-1)
		{
			var index1 = cityNames[count].indexOf("(");
			var index2 = cityNames[count].indexOf(")")
			name = cityNames[count].substring(index1+1 , index2);
		}
		else
		{
			name = cityNames[count];
		}
		document.getElementById('otherCity').value= name;
	//	document.getElementById('otherCity').value = cities[count];
		document.getElementById('tableDiv').style.display = "none";
		document.getElementById('tableDiv').style.display = "none";
		document.getElementById('otherCityCode').checked = true;
		document.getElementById('otherCityCode').value= cities[count];
		document.getElementById("tempCityName").value =  name;
	
		document.getElementById('otherCity').onpropertychange =  dummy;
		e.cancelBubble = true;
	}



	function dummy()
	{
			
	}
	
	
	
	function findPos(obj)
	{
		var curleft = curtop = 0;
		if (obj.offsetParent) 
		{
			curleft = obj.offsetLeft
			curtop = obj.offsetTop
			while (obj = obj.offsetParent) 
			{
				curleft += obj.offsetLeft
				curtop += obj.offsetTop
			}
		}
		return [curleft,curtop];
	}
	
	function positionDiv(e)
	{
		var height = document.getElementById("popCitiesTable")==null ? 0 : document.getElementById("popCitiesTable").offsetTop
					if (navigator.appName.indexOf("Explorer")!=-1)
					{
						document.getElementById("tableDiv").style.top = positionX - 10;//+ height;
						document.getElementById("tableDiv").style.left = positionY
					}
					else
					{
						document.getElementById("tableDiv").style.top = positionX-20 ;//+ height;
						document.getElementById("tableDiv").style.left = positionY
					}
	}




	function hideElement(elementId)
	{
		var element = document.getElementById(elementId);
		if (element!=null && element.style!=null && element.style.display!=null)
		{
			element.style.display = "none"
		}
	}



	function enterPressed(e)
	{
//		alert("here");
//		alert("event is :: "+ e)
			if (selectedIndex!=-1 && cities!=null && cities.length>0)
				{
					document.getElementById('otherCityCode').checked = true;
					document.getElementById('otherCityCode').value= cities[selectedIndex];
					var name;
					if ( cityNames[selectedIndex].indexOf(")")!=-1)
					{
							var index1 = cityNames[selectedIndex].indexOf("(");
							var index2 = cityNames[selectedIndex].indexOf(")")
							name = cityNames[selectedIndex].substring(index1+1 , index2);
					}
					else
					{
							name = cityNames[selectedIndex];
					}
			//		alert("name:: "+ name);
					document.getElementById('otherCity').value= name;
					document.getElementById("tempCityName").value =  name;
					document.getElementById('tableDiv').style.display = "none";
				
					e.cancelBubble = true;
				}
	}