/// <reference path="~/js/jquery-1.4.4.min.js" />

// START DOCUMENT READY
$(document).ready(function()
{

	if ($("#mapexamenplaatsen").is(":visible"))
	{
		initMap();
	}

	$("#toggle_mapexamenplaatsen").click(function()
	{
		toggleMapContainer();
		initMap();
	});


	$("#search_address_submit").click(function()
	{
		var strAddress = $("#search_address").val();
		if (strAddress != "")
			findAddress(strAddress);
	});

	// show details preloaded?
	if ($(".r_detail_preloaded").is(":visible"))
	{
		var strID = $(".r_detail_preloaded").attr("id");
		var container = $("html");
		var scrollTo = $("#" + strID);
		var intScrollToPos = scrollTo.offset().top - 100;

		$("html,body").animate({ scrollTop: intScrollToPos - container.offset().top + container.scrollTop() });
		// "html,body" (instead of just "html") is needed to make this work in Webkit based browsers
	}

	// show details on click?
	if ($("#list_rijscholen").is(":visible"))
	{
		$("a.r_list").click(function()
		{
			if ($("#r_detail_" + this.id).is(":visible"))
			{
				$("#r_detail_" + this.id).slideUp("fast");
			}
			else
			{
				// maybe hide an already preloaded div with the same details (from url-request)?
				$("#r_detail_preloaded_" + this.id).hide();

				$("#r_detail_" + this.id).fadeIn("slow");
				getDetails(this.id);
			}
			return false;
		});
	}

});
// END DOCUMENT READY

function getDetails(intRijschoolID)
{
	var intPageID = parseInt($("#pageid").html());
	var strExCat = $("#excat").html();
	var intAutomaat = parseInt($("#automaat").html());

	$.ajax(
		{
			method: "post",
			url: "data.asp",
			data: "option=rijschool&pageid=" + intPageID + "&fromsearch=0&examencategorie=" + strExCat + "&rijschoolid=" + intRijschoolID + "&automaat=" + intAutomaat + "&r=" + getRandom(),
			success: function(html)
			{
				$("#r_detail_" + intRijschoolID).html(html);
			}
		});
}

function initMap()
{
	// initialize the map
	$('#mapexamenplaatsen').jmap('init', {
		'mapType': 'map',
		'mapCenter': [52.1300, 5.400],
		'mapZoom': 7,
		'mapEnableScrollZoom': true,
		'mapShowjMapsIcon': false,
		'mapEnableType': true,
		'mapEnableScaleControl': false,
		'mapControl': 'none',
		'mapEnableSmoothZoom': false
	},
	function(objMap, element, options)
	{
		// bind the mapdata to the map div
		$("#mapexamenplaatsen").data("objmap", objMap);

		// find examencategorie, prepared for us in a special div	
		var strExamenCategorie = $("#examencategorie").html();

		// show the appropriate examenplaatsen
		loadExamenplaatsMarkers(strExamenCategorie)
	});
}

function findAddress(strAddress)
{
	var objMap = $("#mapexamenplaatsen").data("objmap");
	if (objMap)
	{
		// get the geocoder
		geocoder = new GClientGeocoder();
		if (geocoder)
		{
			var strSearch;

			if (strAddress != "")
				strSearch = strAddress + ", nl";
			else
				strSearch = $("#search_address").val() + ", fr";

			geocoder.getLatLng(
				strSearch,
				function(point)
				{
					if (point)
					{
						objMap.setCenter(point, 10);
					}
				}
			);
		}
	}
}

function toggleMapContainer()
{
	if ($("#container_mapexamenplaatsen").is(":visible"))
	{
		$("#container_mapexamenplaatsen").slideUp("normal");
	}
	else
	{
		$("#container_mapexamenplaatsen").slideDown("normal");
	}
}

// populate the map with campsite icons from XML
function loadExamenplaatsMarkers(strExamenCategorie)
{
	var objMap = $("#mapexamenplaatsen").data("objmap");
	if (objMap)
	{
		objMap.clearOverlays();
	
		$.ajax(
			{
				type: "get",
				url: "/ajaxdata.asp?option=examenplaatsen&examencategorie=" + strExamenCategorie + "&r=" + getRandom(),
				dataType: "xml",
				success: function(xml)
				{
					$(xml).find('examenplaats').each(function()
					{
						var intID = $(this).find('id').text();
						var intExamenplaatsNr = $(this).find('examenplaatsnr').text();
						var strLat = $(this).find('lat').text();
						var strLng = $(this).find('lng').text();

						// get custom icon
						var iconExamenplaats = getIcon("/images/examenplaats.png", 17, 17, 8, 8, "/images/examenplaatsshadow.png", 20, 20, 8, 8);

						var markerOptions = { icon: iconExamenplaats };
						var marker = new GMarker(new GLatLng(strLat, strLng), markerOptions);
						objMap.addOverlay(marker);

						// aardig om de naam in een popup onmouseover te laten zien?
						var blnMouseOver = false;
						// catch mouseover and out, but use a delay to prevent nervous behaviour when hovering the mouse over the map
						GEvent.addListener(marker, "mouseover", function()
						{
							blnMouseOver = true;
							window.setTimeout(function()
							{
								if (blnMouseOver)
								{
									showInfoWin(intExamenplaatsNr, objMap.fromLatLngToContainerPixel(marker.getLatLng()));
								}
							}, 400);
						});
						GEvent.addListener(marker, "mouseout", function()
						{
							blnMouseOver = false;
						});

						// catch click
						GEvent.addListener(marker, "click", function()
						{
							gotoExamenplaats(intExamenplaatsNr);
						});

					});
				},
				error:function (xhr, ajaxOptions, thrownError){
                    //alert(xhr.status);
                    //alert(thrownError);
                }
			});
	}
}

function gotoExamenplaats(intExamenplaatsNr)
{
	var intCurrentPageID = $("#currentpageid").html();
	var intAutomaat = $("#automaat").html();
	document.location.href = "index.asp?pageid=" + intCurrentPageID + "&examenplaats=" + intExamenplaatsNr + "&automaat=" + intAutomaat;
}


function showInfoWin(intExamenplaatsNr, xy)
{
	var intOffsetX;
	var intOffsetY;

	intOffsetX = 15;
	intOffsetY = 15;

	var X = (xy.x) + intOffsetX;
	var Y = (xy.y) - intOffsetY;

	$("#infowin").css({ left: X, top: Y });

	$.ajax(
		{
			method: "post",
			url: "data.asp",
			data: "option=examenplaats&examenplaatsnr=" + intExamenplaatsNr + "&r=" + getRandom(),
			success: function(html)
			{
				$("#infowincontent").html(html);
			}
		});

	$("#infowin").show();
}

// create custom item
function getIcon(strFile, intWidth, intHeight, intAnchorX, intAnchorY, strShadowFile, intShadowWidth, intShadowHeight, intShadowAnchorX, intShadowAnchorY)
{
	// create specific marker icon
	var baseIcon = new GIcon();

	baseIcon.image = strFile;
	baseIcon.iconSize = new GSize(intWidth, intHeight);
	baseIcon.iconAnchor = new GPoint(intAnchorX, intAnchorY);
	baseIcon.infoWindowAnchor = new GPoint(intAnchorX, intAnchorY);

	if (strShadowFile != "")
	{
		baseIcon.shadow = strShadowFile;
		baseIcon.shadowSize = new GSize(intShadowWidth, intShadowHeight);
		baseIcon.infoShadowAnchor = new GPoint(intShadowAnchorX, intShadowAnchorY);
	}

	var tmpIcon = new GIcon(baseIcon);

	return tmpIcon;
}

function getRandom()
{
	return Math.random() * 99999;
}



