// Readonly Properties...
var map;
var showImages = true;
var showAll = false;
var loopTo = 0;
var clearSession = false;
var datePickerObject;

RegionFilter = function() {
	var dbOwner = $("#dbowner-hidden").attr("value");
	if (dbOwner != '') {
		return dbOwner;
	}
	return GetFilter("#regions input[type=checkbox]");
}

CategoryFilter = function() {
	var filter = GetFilter("#categories input[type=checkbox]");
	if (filter != "") {
		return filter;
	}
	return $("#categories input[type=hidden]").attr("value");
}

PageName = function() {
	return $("#page-name-hidden").attr("value");
}

SeasonFilter = function() {
	return GetFilter("#seasons input[type=checkbox]");
}

FacilityFilter = function() {
	return GetFilter("#facilities input[type=checkbox]");
}

FromDate = function() {
	return $("#from-date input.date").val();
}

ToDate = function() {
	return $("#to-date input.date").val();
}

FreeText = function() {
	return $("#freetext-search input[type=text]").attr("value");
}

InitControls = function() {
	InitGoogleMap();
	InitMapAndFilterBox();
	InitFilterBox();
	AjaxifyCheckBoxes();
	AjaxifySearchButton();
	BindEvents();
	//Load products on map
	LoadProducts();
}

BindEvents = function() {
	SetPagingLinkEvent();
	SetShowImagesEvent();
	SetShowAllEvent();
}

ResetVariables = function() {
	loopTo = 0;
}

// Functions
AjaxifyCheckBoxes = function() {
	//Add ajax callback to checkboxes and hide them
	$("#filter-box input[type=checkbox]").each(function() {
		$this = $(this);
		if(this.checked){selectCheckBox(this);}
		$this.click(function() {
			ResetVariables();
			selectCheckBox(this);
			LoadProducts();
		});
		$this.addClass("hidden-by-js");
	});
}

selectCheckBox = function(chk){
	clearSession = true;
	$(chk).closest("li").toggleClass("selected");
	AddToSelectedCriterias(chk);
}

AjaxifySearchButton = function() {
	//Add ajax callback to the search button
	$("#freetext-search input[type=submit]").click(function(e) {
		e.preventDefault();
		LoadProducts();
	});
}

InitGoogleMap = function() {
	//Google map
	var mapBox = '<div id="map-box"></div>';

	$("#map-and-filter-box").append(mapBox);
	$("#map-box").show();
	map = new GMap2(document.getElementById('map-box'));
}

InitFilterBox = function() {
	$("#filter-box div h2").click(function() {
		$("#filter-box div.columns ul").slideUp(100, function() {
			$(this).parent().removeClass("open");
		});
		if ($(this).parent().hasClass("open")) {
			$(this).parent().find("ul").slideUp(200, function() {
				$(this).parent().removeClass("open");
			});
		}
		else {
			$(this).parent().addClass("open");
			$(this).parent().find("ul").slideDown(200);
		}

	});
}

InitMapAndFilterBox = function() {
	//Filter
	var toggleText = resources.show_hide_map;
	var toggleButtons = "<div id=\"toggle-display\"><a id=\"toggle-map\" href=\"javascript: void(0);\">" + toggleText + "</a>	</div>";
	$("#map-box").hide();
	$("#map-and-filter-box").append(toggleButtons);
	$("#toggle-display").click(function(e) {
		e.preventDefault();
		$(this).find("a").toggleClass("open");
		$("#map-box").slideToggle("slow", function(){	
			map.checkResize();
		});
	});
}

GetFilter = function(selector) {
	var filter = "";
	$(selector).each(function() {
		if (this.checked == true) {
			if (filter == "") {
				filter = $(this).attr("rel");
			} else {
				filter = filter + "," + $(this).attr("rel");
			}
		}
	});
	return filter;
}

AddToSelectedCriterias = function(obj) {
	var ul = $("#choosen-criterias .criterias");

	if (ul.length == 0) {
		$("#choosen-criterias").append("<ul class=\"criterias\"></ul>")
	}

	var criteriaTag = $("#choosen-criterias .criterias li a[rel=" + obj.id + "]");

	if (criteriaTag.length > 0) {
		criteriaTag.parent().remove();
	} else {
		$("#choosen-criterias .criterias").append("<li><a href=\"javascript: void(0);\" rel=\"" + obj.id + "\">" + $(obj).next().text() + "</a></li>");
	}

	// Bind event
	$("#choosen-criterias .criterias li a").each(function() {
		$(this).click(function() {
			var id = $(this).attr("rel");
			$("#" + id).each(function() {
				this.checked = false;
				$(this).parent().removeClass("selected");
			});
			LoadProducts();
			$(this).parent().remove();
		});
	});
}

SetPagingLinkEvent = function() {
	$(".paging a").each(function() {
		$(this).click(function(e) {
			e.preventDefault();
			loopTo = $(this).attr("rel");
			LoadProducts();
		});
	});
}

SetShowImagesEvent = function() {
	$(".images a").each(function() {
		$(this).click(function(e) {
			e.preventDefault();
			showImages = $(this).attr("rel");
			$(this).attr("rel", !showImages);
			LoadProducts();
		});
	});
}

SetShowAllEvent = function() {
	$(".showall a").each(function() {
		$(this).click(function(e) {
			e.preventDefault();
			showAll = $(this).attr("rel");
			$(this).attr("rel", !showAll);
			LoadProducts();
		});
	});
}

// Load products based on selected criterias
LoadProducts = function() {
	$("#product-search-result").prepend("<div id=\"loading\"><img src=\"/images/loading.gif\" alt=\"\" /></div>");

	var sData = GetProductFilter();

	if (loopTo != '') {
		sData = sData + "&LoopTo=" + loopTo;
	}
	var url = productSearchUrl;
	url += "?images=" + showImages;
	url += "&showall=" + showAll;
	url += "&lang=" + languageId;

	$.ajax({
		type: "POST",
		url: url,
		data: sData,
		dataType: "html",
		success: function(html) {
			$("#product-search-result").html(html);
			//Append event to paging link
			BindEvents();
		},
		error: function(msg) {
			$("#product-search-result").html(msg);
		}
	});

	LoadProductsOnMap(sData);
}

GetProductFilter = function() {
	var sData =
					"ClearSession=" + clearSession +
					"&RegionFilter=" + RegionFilter() +
					"&CategoryFilter=" + CategoryFilter() +
					"&SeasonFilter=" + SeasonFilter() +
					"&FacilityFilter=" + FacilityFilter() +
					"&PageName=" + PageName();


	if (FreeText() != "") {
		sData = sData + "&FreeText=" + FreeText();
	}

	return sData;
}

// Load products based on selected criterias
LoadProductsOnMap = function(sData) {
	var url = markersJSONUrl;
	url += "?showall=" + showAll;
	url += "&lang=" + languageId;

	$.ajax({
		type: "POST",
		url: url,
		data: sData,
		dataType: "json",
		success: function(json) {
			CreateMarkersOverlay(json);
		},
		error: function(XMLHttpRequest, textStatus) {
			SetDefaultMap();
		}
	});
}

// Create markers overlay
CreateMarkersOverlay = function(json, useDefault) {
	// Create a base icon for all of our markers that specifies the
	// shadow, icon dimensions, etc.
	var icon = new GIcon();
	icon.image = '/images/icons/map_icon_bg.png';
	icon.iconSize = new GSize(32, 24);
	icon.iconAnchor = new GPoint(16, 24);
	icon.infoWindowAnchor = new GPoint(25, 7);
	map.clearOverlays();
	var latlngbounds = new GLatLngBounds();

	if (json != "") {
		$.each(json.markers, function(i, item) {
			opts = {
				"icon": icon,
				"clickable": true,
				"labelText": "<span></span>",
				"title": item.name,
				"labelOffset": new GSize(-16, -22),
				"labelClass": "marker-label"
			};
			var marker = new LabeledMarker(item.point, opts);

			if (!useDefault) {
				opts = {
					"icon": icon,
					"clickable": true,
					"labelText": "<span>" + item.position + "</span>",
					"title": item.name,
					"labelOffset": new GSize(-16, -22),
					"labelClass": "marker-label"
				};
				marker = new LabeledMarker(item.point, opts);
			}

			GEvent.addListener(marker, "click", function() {
				var windowHtml = "<div class=\"info-window-html\"><h2>" + item.name + "</h2>";

				if (item.image != "" || item.description != "") {
					windowHtml += "<p>";
					if (item.image != "") {
						windowHtml += "<img src=\"" + item.image + "\" alt=\"" + item.imageText + "\" />"
					}
					if (item.description != "") {
						windowHtml += item.description
					}
					windowHtml += "</p>";
				}

				windowHtml += "</div>";
				marker.openInfoWindowHtml(windowHtml);
			});

			map.addOverlay(marker);
			latlngbounds.extend(item.point);
		});
		CenterAndZoom(map, latlngbounds);
		var customUI = map.getDefaultUI();
		customUI.controls.scalecontrol = false;
		customUI.zoom.scrollwheel = false;
		map.addControl(new GOverviewMapControl());
		map.setUI(customUI);
	}
}

SetDefaultMap = function() {
	var latlngbounds = new GLatLngBounds();

	$.getJSON(regionMarkersUrl, function(json) {
		CreateMarkersOverlay(json, true);
	});
}

CenterAndZoom = function(map, bounds) {
	var zoomLevel = 11;
	if (map.getBoundsZoomLevel(bounds) < zoomLevel) { zoomLevel = map.getBoundsZoomLevel(bounds) }
	map.setCenter(bounds.getCenter(), zoomLevel);
}