// JavaScript Document

var maxSuggestion = 20;

window.onload = initAll;
var xhr = false;
var pilihDB = null;
var pilihDBtemp = 'temp';
var statesArray = new Array();


function initAll() {
	document.getElementById("searchField").onkeyup = searchSuggest;
	document.getElementById("searchField2").onkeyup = searchSuggest2;

	if (window.XMLHttpRequest) {
		xhr = new XMLHttpRequest();
	}
	else {
		if (window.ActiveXObject) {
			try {
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			}
			catch (e) { }
		}
	}

	if (xhr) {
		xhr.onreadystatechange = setStatesArray;
		xhr.open("GET", "http://angkutanumum.com/assets/xml/bandung.xml", true);
		xhr.send(null);
	}
	else {
		//alert("Sorry, but I couldn't create an XMLHttpRequest");
	}
}

function setStatesArray() {
	if (xhr.readyState == 4) {
		if (xhr.status == 200) {
			if (xhr.responseXML) {
				var allStates = xhr.responseXML.getElementsByTagName("item");
				for (var i=0; i<allStates.length; i++) {
					statesArray[i] = allStates[i].getElementsByTagName("label")[0].firstChild;
				}
			}
		}
		else {
			//alert("There was a problem with the request " + xhr.status);
		}
	}
}

function searchSuggest() {
	var str = document.getElementById("searchField").value;
	document.getElementById("searchField").className = "";
	
	var popups = document.getElementById("popups");
	popups.style.top = (document.getElementById("searchField").offsetTop+22) + "px";
	popups.style.left = (document.getElementById("searchField").offsetLeft) + "px";
	if (str != "") {
		document.getElementById("popups").innerHTML = "";
		var j = 0;
		for (var i=0; i<statesArray.length; i++) 
		{
			var thisState = statesArray[i].nodeValue;
			if ( (thisState.toLowerCase().indexOf(str.toLowerCase()) ) >= 0  && (j < maxSuggestion)) {
				j++;
				var tempDiv = document.createElement("div");
				tempDiv.innerHTML = thisState;
				tempDiv.onclick = makeChoice;
				tempDiv.className = "suggestions";
				document.getElementById("popups").appendChild(tempDiv);
				document.getElementById("popups").className = "showbox";
			}
		}
	}
	
	document.getElementById("maincontainer").onclick = hideBox;
}


function searchSuggest2() {
	var str = document.getElementById("searchField2").value;
	document.getElementById("searchField2").className = "";
	
	var popups = document.getElementById("popups2");
	popups.style.top = (document.getElementById("searchField2").offsetTop+22) + "px";
	popups.style.left = (document.getElementById("searchField2").offsetLeft) + "px";
	if (str != "") {
		document.getElementById("popups2").innerHTML = "";
		var j = 0;
		for (var i=0; i<statesArray.length; i++) {
			var thisState = statesArray[i].nodeValue;
			if ( (thisState.toLowerCase().indexOf(str.toLowerCase()) ) >= 0  && (j < maxSuggestion)) {
				j++;
				var tempDiv = document.createElement("div");
				tempDiv.innerHTML = thisState;
				tempDiv.onclick = makeChoice2;
				tempDiv.className = "suggestions";
				document.getElementById("popups2").appendChild(tempDiv);
				document.getElementById("popups2").className = "showbox";
			}
		}
	}
	
	document.getElementById("maincontainer").onclick = hideBox;
}

function hideBox() {
	document.getElementById("popups").className = "hiddenbox";
	document.getElementById("popups2").className = "hiddenbox";
}

function showBox() {
				document.getElementById("popups").className = "showbox";
}

function showBox2() {
				document.getElementById("popups2").className = "showbox";
}
function makeChoice(evt) {
	var thisDiv = (evt) ? evt.target : window.event.srcElement;
	document.getElementById("searchField").value = thisDiv.innerHTML;
	document.getElementById("popups").className = "hiddenbox";
}
function makeChoice2(evt) {
	var thisDiv = (evt) ? evt.target : window.event.srcElement;
	document.getElementById("searchField2").value = thisDiv.innerHTML;
	document.getElementById("popups2").className = "hiddenbox";
}
function clickclear(thisfield, defaulttext, selectedDB) {
	if (thisfield.value == defaulttext) {
		thisfield.value = "";
	}
	if (pilihDB == null)
	{
	change_box(selectedDB);
	pilihDB = selectedDB;
	} else
	if (pilihDB != pilihDBtemp)
	{
	change_box(pilihDB);
	pilihDBtemp = pilihDB;
	}
}
function clickrecall(thisfield, defaulttext) {
	if (thisfield.value == "") {
	thisfield.value = defaulttext;
	}
}
function change_box(devVal){
	if (xhr) {
		if (devVal == "surabaya") {
			xhr.onreadystatechange = setStatesArray;
			xhr.open("GET", "http://angkutanumum.com/assets/xml/surabaya.xml", true);
			xhr.send(null);
			pilihDB = 'surabaya';
			}
		else if(devVal == "no_trayek") {
			xhr.onreadystatechange = setStatesArray;
			xhr.open("GET", "http://angkutanumum.com/assets/xml/jakarta.xml", true);
			xhr.send(null);
			pilihDB = 'no_trayek';
		} else {
			xhr.onreadystatechange = setStatesArray;
			xhr.open("GET", "http://angkutanumum.com/assets/xml/bandung.xml", true);
			xhr.send(null);
			pilihDB = 'bandung';
			}
	}
}