var req;
var arSelectCityShow = new Array();
var arSelectCityIDs = new Array();

function StatesLoaded(){
	if (req.readyState==4) {
		if (req.status == 200) {
			var result = req.responseText;
			
			var params = result.split('|');
			var head = params[0].split(';');
			var body = params[1].split(';');
			
			var State = document.getElementById('State-' + head[0]);
			if (State) {
				Clear(State);
				StateIdx = 0;
				for(var i = 0; i < body.length; ++i) {
					State.options[i] = new Option(body[i], body[i]);
					if (head[1] == body[i]) StateIdx = i;
				}
				State.selectedIndex = StateIdx;
				
				if (StateIdx != 0) {
					LoadCities(head[0], head[1], head[2]);
				}
			}
		}
	}
}

function CitiesLoaded(){
	if (req.readyState==4) {
		if (req.status == 200) {
			var result = req.responseText;

			var params = result.split('|');
			var head = params[0].split(';');
			var body = params[1].split(';');
			
			var City = document.getElementById('City-' + head[0]);
			var listCity = document.getElementById('SelectCity-' + head[0]);
			if (City && listCity) {
				City.disabled = false;

				if (head[1].length != 0) {
					City.value = head[1];
				} 

				if (body.length == 0 || body.length == 1 && (body[0].length == 0 || body[0].length && head[1] == body[0])) {
					HideListCity(head[0]);
				} else {
					ShowListCity(listCity, head[0]);
					
					listCity.style.height = body.length < 7 ? body.length * 17 : 110;
					
					buf = '<ul>';
					for(var i = 0; i < body.length; ++i) {
						buf += '<li><a href="javascript:SetCityValue(' + head[0] + ',\'' + body[i] + '\');">' + body[i] + '</a></li>';
					}
					buf += '</ul>';

					listCity.innerHTML = buf;
				}
			}
		}
	}
}

function Clear(obj){
	while (obj.length > 0)
		obj.options[0] = null;
}

function CityNameChaged(city, idx) {
	var listCity = document.getElementById('SelectCity-' + idx);
	var State = document.getElementById('State-' + idx);

	if (!State || !listCity) return;
	
	if (city.value.length < 2) {
		if (city.value.length == 0) {
			HideListCity(idx);
		} else {
			listCity.style.height = 35;
			ShowListCity(listCity, idx);
		}
		return;
	} else {
		SelectCityInit(listCity, city);
		listCity.style.height = 35;
		ShowListCity(listCity, idx);
	}
	
	LoadCities(idx, State.value, city.value);
}

function StateChanged(idx, selidx) {
	var City = document.getElementById('City-' + idx);
	var listCity = document.getElementById('SelectCity-' + idx);
	
	if (!City || !listCity) return;

	if (selidx == 0) {
		City.value = 'Please selected State/Province';
		City.disabled = true;
	} else {
		City.value = '';
		City.disabled = false;
	}

	HideListCity(idx);
}

function SelectCityInit(listCity, idx) {
	var city = document.getElementById('City-' + idx);
	if (!city) return;
	var pos = getAbsolutePos(city);
	listCity.style.left = pos.x;
	listCity.style.top = pos.y + 20;
	listCity.style.width = city.style.width;
}

function SetCityValue(idx, City) {
	var obj = document.getElementById('City-' + idx);
	if (!obj) return;
	obj.value = City;
	HideListCity(idx);
}

function ShowListCity(listCity, idx) {
	SelectCityInit(listCity, idx);
	ClearCityTimer(idx);
	listCity.style.display = 'inline';
	listCity.innerHTML = 'Please input two first chars of City name';
	arSelectCityIDs[idx] = window.setTimeout('HideListCity(' + idx + ')', 10000);
	arSelectCityShow[idx] = true;
}

function HideListCity(idx) {
	ClearCityTimer(idx);
	if (!arSelectCityShow[idx]) return;
	var listCity = document.getElementById('SelectCity-' + idx);
	if (!listCity) return;
	listCity.style.display = 'none';
	arSelectCityShow[idx] = false;
	arSelectCityIDs[idx] = -1;
}

function ClearCityTimer(idx) {
	if (arSelectCityIDs[idx] != undefined && arSelectCityIDs[idx] != -1) clearTimeout(arSelectCityIDs[idx]);
}