// init
var _assocAreas = {};

$(document).ready(function() {

	// first one stops events from the top div, second one is the worker
	$(".moreAreaTitle").live("click",function(){return false}).live("mousemove",function(){return false});
	$(".moreAreaItem").live("click",function(){rmArea(this.id)}).live("mousemove",function(){$(this).attr("title","Click to Remove Area")}).live("mouseout",function(){$(this).attr("title","")});

	// moreAreasHidden - should be formatted as json string
	// "id" :{"placeid":XYZ,"name":"XYZ (Ciyt, ST)"},"id" :{ ... } ...
	var data = $("#moreAreasHidden").val() || "";
	if (data != "") {
		try {
			eval("setAreas({"+ data +"})");
		}
		catch(e) {
		}
	}

	$("a#moreOptions", "div#searchHomesForm").click(openMoreOptions);
	$("a#moreAreasLink").click(showMoreAreas);

	// auto complete
	$("#searchAreaText").each(function(i, elem) {
		$(elem).autocomplete("/ajax/searcharea/list/",{minChars:2, delay:300, max:15, width:300, selectFirst:true, cacheLength:0}).result(
			function(event, data, formatted) {
				if (data) {
					addArea({"name": data[0], "placeid": data[1]});
					$("#searchAreaText").val("").blur(); // clear it
					$("#areasHidden").val(getAreas());
				}
		});
	});

	// bind these
	$("form#searchHomesForm").bind("beforeSubmit", function(){
		$("form#searchHomesForm").data("stopSubmit", showAreaDYM());
	});
});

/**
 * converts the more areas collection to values that can be used by the form
 * submission handling logic.  This includes getting a distinct list of zip codes
 * and morearea ids
 */
function getAreas() {
	var keys = new Array();
	for (var key in _assocAreas) {
		keys.push(key);
	}
	return keys.join(",");
}

/**
 * sets the more areas collection and constructs the html to
 * display the more areas list to user.
 */
function setAreas(areas) {
	// add new areas (if there)
	for (var key in areas) {
		addArea(areas[key]);
	}

	// update
	$("#areasHidden").val(getAreas());
}

function addArea(area) {

	// make sure the area has not been added
	for (var key in _assocAreas) {
		if (key == area.placeid) { return }
	}

	// update globals
	_assocAreas[area.placeid] = area;

	// add to DOM
	var content = '<div class="moreAreaItem" id="moreAreaItem_'+ area.placeid +'"><div class="moreAreaTitle">'+ area.name +'</div></div>';
	$("div#moreAreaList").append(content).removeClass("hidden");
	$("div#moreAreasLinkWrap").removeClass("hidden");
}

/**
 * remove an area from the array and remove the html for that area from the DOM
 */
function rmArea(areaId) {
	$("div#moreAreaList div#" + areaId).remove();

	areaId = areaId.toString().replace(/^moreAreaItem[_]/, "");
	delete _assocAreas[areaId];

	// do this instead of length of assoc array
	var areas = getAreas();

	// hide if no areas left
	if (areas.length == 0) {
		$("div#moreAreaList,div#moreAreasLinkWrap").addClass("hidden");
		$("#searchAreaText").val("").blur();
	}

	// update
	$("#areasHidden").val(areas);
}


/**
 * shows the more areas dialog
 *  look for a hidden element to find the url for opening the
 *  more areas dialog.  If it is found then use it otherwise
 *  default to the base url
 */
function showMoreAreas() {
	var admin = /\/admin\//.test(window.location.href), moreAreas = getAreas();
	var url = (admin ? "/admin" : "") + "/moreareasdialog/callback/setAreas/"
					+ (moreAreas ? "moreareas/"+ moreAreas +"/" : "") + "?TB_iframe=true&height=" + (admin ? 483 : 483) + "&width=" + (admin ? 605 : 440);

	tb_show("Add more areas:", url, false);
	$("#TB_window").addClass("moreAreaDialog");
	return false;
}

/**
 * opens the more options page
 */
function openMoreOptions() {
	var url = this.href, params = new Array(), areas = getAreas();

	if (areas != "") {
		params.push("areas");
		params.push(areas);
	}
	
	$(":input[type=select-one]", "#searchHomesForm").each(function(i, elem) {
		if ($(elem).val() != "") {
			params.push(escape($(elem).attr("name")));
			params.push(escape($(elem).val()));
		}
	});
	
	if (params.length > 0) {
		url += params.join("/") + "/";
	}

	window.location = url;
	return false;
}

/**
 * show did you mean
 */
function showAreaDYM() {

	var stopSubmit = false, admin = /\/admin\//.test(window.location.href);

	$("#searchAreaText").each(function(i, elem) {
		// show suggestion list when area entered and no selected area
		var area = escape($.trim($(elem).focus().val() || ""));
		if (area != "") {
			var url = (admin ? "/admin" : "")
			        + "/suggestedareasdialog/callback/setAreas/?searcharea="+ area +"&KeepThis=true&width=420&height="+ (admin ? 224 : 228)
			        + "&TB_iframe=true&modal=true";

			tb_show("Suggested Areas", url, null);
			$("#TB_window").addClass("suggestedAreaDialog");

			$(elem).val("").blur();
			stopSubmit = true;
		}
		$(elem).blur();
	});

	return stopSubmit;
}