var map = null;
var geocoder = null;
var icon = null;
var markers = new Array();
var noOfAddedMarkers = 0;
var activeMarker = -1;
var xmlWindow = null;

function $(selector) { return document.getElementById(selector); }

function load()
{
	if (window.Node && Node.prototype && !Node.prototype.contains)
	{
		Node.prototype.contains = function (arg)
		{
			return !!(this.compareDocumentPosition(arg) & 16);
		}
	}

	addEvent(document.getElementById('openInMenuDiv'), "mouseover", function (e) { if (IsMouseEnter(this, e)) { showMenu('openIn', null); } }, false);
	addEvent(document.getElementById('openInMenuDiv'), "mouseout", function (e) { if (IsMouseLeave(this, e)) { hideMenu('openIn'); } }, false);

	if (GBrowserIsCompatible())
	{
		map = new GMap2($("mapDiv"));
		geocoder = new GClientGeocoder();

		map.setCenter(new GLatLng(51.16569, 10.45153), 5);

		map.enableScrollWheelZoom();
		map.enableDoubleClickZoom();
		map.enableContinuousZoom();

		map.getDragObject().setDraggableCursor("crosshair");
		map.getDragObject().setDraggingCursor("crosshair");

		map.addControl(new GLargeMapControl());
		map.setMapType(G_NORMAL_MAP);
		map.addControl(new GMapTypeControl());

		var minMapScale = 2;
		var maxMapScale = 17;
		var mapTypes = map.getMapTypes();
		// overwrite the getMinimumResolution() and getMaximumResolution() methods for each map type
		for (var i = 0; i < mapTypes.length; i++)
		{
			mapTypes[i].getMinimumResolution = function() { return minMapScale; }
			mapTypes[i].getMaximumResolution = function() { return maxMapScale; }
		}

		icon = new GIcon();
		icon.image = "http://labs.google.com/ridefinder/images/mm_20_red.png";
		icon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
		icon.iconSize = new GSize(12, 20);
		icon.shadowSize = new GSize(22, 20);
		icon.iconAnchor = new GPoint(6, 20);
		icon.infoWindowAnchor = new GPoint(5, 1);

		// Wird auf 0 zurückgesetzt, falls "Markierung hinzufügen" geklickt wurde bevor Google Maps geladen ist
		noOfAddedMarkers = 0;

		GEvent.addListener(map, "mousemove",
			function (latlng)
			{
				$("cursorPosDiv").innerHTML = "Position: " + formatLatLng(latlng);
			}
		);

		GEvent.addListener(map, "click",
			function (latlng)
			{
				if ($('mapDiv').className == "mapEnlargedClass")
				{
					var lnglat = map.getCenter();
					$('mapDiv').className = "mapClass";
					map.checkResize();
					map.setCenter(lnglat);
				}
			}
		);

		$("addressInput").onkeydown = function(e)
		{
			var keyCode;

			if (window.event)
			{
				keyCode = window.event.keyCode;
			}
			else
			{
				keyCode = e.keyCode;
			}

			if (keyCode == 13)
			{
				findAddress($('addressInput').value);
			}
		}

		$("mapDiv").oncontextmenu = showContextMenu;
		$("markerTable").oncontextmenu = showContextMenu;
	}
}



function showContextMenu(e)
{
	e = e || window.event;
	var target = e.target || e.srcElement;
	var eX = e.clientX || e.x;
	var eY = e.clientY || e.y;

	e.cancelBubble = true;
	e.returnValue = false;
	if (e.preventDefault) e.preventDefault();
	if (e.stopPropagation) e.stopPropagation();

	if ($("markerTable").contains(target))
	{
		activateMarker(/[A-Za-z]*(\d*)$/.exec(target.parentNode.id)[1], true);

		$("contextMenuDiv").style.left = (eX - 8) + "px";
		$("contextMenuDiv").style.top = (eY - 8) + "px";
		showMenu("context");
	}

	return false;
}

function hideContextMenu(e)
{
	 hideMenu("context");
}

function findAddress(address)
{
	if (address.length == 0)
	{
		$("addressDiv").innerHTML = "Bitte Adresse eingeben!";
		$("addressDiv").style.color = "#c00000";
		$("addressDiv").style.fontWeight = "bold";
		return;
	}

	$("addressDiv").innerHTML = "Daten werden abgerufen...";
	$("addressDiv").style.color = "#a0a0a0";
	$("addressDiv").style.fontWeight = "normal";

	geocoder.getLatLng(address,
		function(point)
		{
			if (!point)
			{
				$("addressDiv").innerHTML = "Adresse nicht gefunden.";
				$("addressDiv").style.color = "#c00000";
				$("addressDiv").style.fontWeight = "bold";
			}
			else
			{
				$("addressDiv").innerHTML = "Position: " + formatLatLng(point);

				if (map.getZoom() < 16)
				{
					map.setCenter(point, 17);
				}
				else
				{
					map.panTo(point);
				}

				noOfAddedMarkers++;
				// var title = 'Positionsmarkierung ' + noOfAddedMarkers.toString();

				addMarker(point, address);
			}
		}
	);
}

function addMarker(latlng, title)
{
	markers.push(new GMarker(latlng, {icon:icon, draggable:true, title:title}));
	var marker = markers.length - 1;
	map.addOverlay(markers[marker]);

	GEvent.addListener(markers[marker], "drag", function() { showMarkerPos(marker); });
	GEvent.addListener(markers[marker], "click", function() { showMarkerPos(marker); });
	
	var row = document.createElement("tr");
	row.id = "markerTableTr" + marker.toString()
	row.className = "markerTableTr";
	row.onclick = (function (marker) { return function () { activateMarker(marker, true); }; })(marker);
	// row.title = markers[marker].getTitle();

	var cell1 = document.createElement("td");
	cell1.className = "markerTableTd1";
	cell1.innerHTML = markers[marker].getTitle();

	var cell2 = document.createElement("td");
	cell2.className = "markerTableTd2";
	cell2.innerHTML = formatLatLng(markers[marker].getPoint());

	var cell3 = document.createElement("td");
	cell3.className = "markerTableTd3";
	cell3.style.backgroundImage = "url(" + markers[marker].getIcon().image + ")";
	cell3.onclick = function() { showMenu('markerIcon', this); };
	cell3.onmouseout = function() { hideMenu('markerIcon'); };

	var cell4 = document.createElement("td");
	cell4.className = "markerTableTd4";
	cell4.innerHTML = "...";
	cell4.onclick = function() { showMenu('openIn', this); };
	cell4.onmouseout = function() { hideMenu('openIn'); };

	row.appendChild(cell1);
	row.appendChild(cell2);
	row.appendChild(cell3);
	row.appendChild(cell4);
	$("markerTableBody").appendChild(row);

	activateMarker(marker, false);
}

function showMarkerPos(marker)
{
	$("markerTableTr" + marker.toString()).cells[1].innerHTML = formatLatLng(markers[marker].getPoint());

	if (marker != activeMarker)
	{
		activateMarker(marker, false)
	}
}

function formatLatLng(latlng)
{
	var latArr = (Math.round(latlng.lat() * 100000) / 100000).toString().split(".");
	var latStr = latArr[0] + '.' + ((latArr.length == 2 ? latArr[1] : '0') + '0000').substring(0, 5);

	var lngArr = (Math.round(latlng.lng() * 100000) / 100000).toString().split(".");
	var lngStr = lngArr[0] + '.' + ((lngArr.length == 2 ? lngArr[1] : '0') + '0000').substring(0, 5);
	
	return (latStr + ", " + lngStr);
}

function rebuildList()
{
	if (markers.length > 0)
	{
		if (activeMarker >= markers.length)
		{
			activeMarker = markers.length - 1;
		}
	}
	else
	{
		activeMarker = -1;
	}

	var row;

	for (var i = 0; i < markers.length; i++)
	{
		var row = $("markerTableTr" + i.toString());
		// row.title = markers[i].getTitle();
		row.cells[0].innerHTML = markers[i].getTitle();
		row.cells[1].innerHTML = formatLatLng(markers[i].getPoint())
		row.cells[2].style.backgroundImage = "url(" + markers[i].getIcon().image + ")";
		row.cells[2].onclick = function() { showMenu('markerIcon', this); }
		row.cells[2].onmouseout = function() { hideMenu('markerIcon'); }
		row.cells[3].innerHTML = "...";
		row.cells[3].onclick = function() { showMenu('openIn', this); }
		row.cells[3].onmouseout = function() { hideMenu('openIn'); }
		if (i == activeMarker)
		{
			row.className = "markerTableActiveTr";
		}
		else
		{
			row.className = "markerTableClickableTr";
		}
	}

	var i = markers.length;
	while (row = $("markerTableTr" + i.toString()))
	{
		$("markerTableBody").removeChild(row);
		i++;
	}
}

function activateMarker(marker, center)
{
	if (map === null) { return; }

	if (marker >= markers.length) { return; }

	var row;

	if (activeMarker != -1)
	{
		row = $("markerTableTr" + activeMarker.toString());
		row.className = "markerTableClickableTr";
	}

	activeMarker = marker;

	row = $("markerTableTr" + marker.toString());
	row.className = "markerTableActiveTr";
	
	if (center == true)
	{
		map.panTo(markers[marker].getPoint());
	}
}

function newCenterMarker()
{
	if (map === null) { return; }

	noOfAddedMarkers++;
	var title = 'Positionsmarkierung ' + noOfAddedMarkers.toString()

	addMarker(map.getCenter(), title);
}

function removeActiveMarker()
{
	if (map === null) { return; }

	if (activeMarker == -1) { return; }

	map.removeOverlay(markers[activeMarker]);
	markers.splice(activeMarker, 1);

	rebuildList();
}

function renameActiveMarker()
{
	if (map === null) { return; }

	if (activeMarker == -1) { return; }

	var newTitle = prompt("Geben Sie bitte einen neuen Namen für die Markierung ein:", markers[activeMarker].getTitle());
	if (newTitle != null && newTitle.length != 0)
	{
		// Title change "hack", because setTitle does not exist yet (http://code.google.com/p/gmaps-api-issues/issues/detail?id=112)
		var latlng = markers[activeMarker].getPoint();

		map.removeOverlay(markers[activeMarker]);
		markers[activeMarker] = new GMarker(latlng, {icon:icon, draggable:true, title:newTitle});
		var marker = activeMarker;
		map.addOverlay(markers[marker]); 

		GEvent.addListener(markers[marker], "drag", function() { showMarkerPos(marker); });
		GEvent.addListener(markers[marker], "click", function() { showMarkerPos(marker); });

		// $("markerTableTr" + activeMarker.toString()).title = newTitle;
		$("markerTableTr" + activeMarker.toString()).cells[0].innerHTML = newTitle;
	}
}

function removeAllMarkers()
{
	if (activeMarker == -1) { return; }

	if (confirm("Sollen wirklich alle Markierungen entfernt werden?") == false) { return; }

	for (var i = 0; i < markers.length; i++)
	{
		map.removeOverlay(markers[i]);
	}
	
	markers.splice(0, markers.length);
	
	rebuildList();

	noOfAddedMarkers = 0;
}

function enlargeMap()
{
	if (map === null) { return; }

	var lnglat = map.getCenter();
	$('mapDiv').className = ($('mapDiv').className == "mapClass" ? "mapEnlargedClass" : "mapClass")
	map.checkResize();
	map.setCenter(lnglat);
}

function changeMarkerIcon(newIcon)
{
	if (map === null) { return; }

	icon = new GIcon();
	icon.image = "http://labs.google.com/ridefinder/images/" + newIcon;
	icon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
	icon.iconSize = new GSize(12, 20);
	icon.shadowSize = new GSize(22, 20);
	icon.iconAnchor = new GPoint(6, 20);
	icon.infoWindowAnchor = new GPoint(5, 1);

	// Icon change "hack", because setIcon does not exist yet
	var latlng = markers[activeMarker].getPoint();
	var title = markers[activeMarker].getTitle();

	map.removeOverlay(markers[activeMarker]);
	markers[activeMarker] = new GMarker(latlng, {icon:icon, draggable:true, title:title});
	var marker = activeMarker;
	map.addOverlay(markers[marker]); 

	GEvent.addListener(markers[marker], "drag", function() { showMarkerPos(marker); });
	GEvent.addListener(markers[marker], "click", function() { showMarkerPos(marker); });

	$("markerTableTr" + activeMarker.toString()).cells[2].style.backgroundImage = "url(" + markers[activeMarker].getIcon().image + ")";

	icon = new GIcon();
	icon.image = "http://labs.google.com/ridefinder/images/mm_20_red.png";
	icon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
	icon.iconSize = new GSize(12, 20);
	icon.shadowSize = new GSize(22, 20);
	icon.iconAnchor = new GPoint(6, 20);
	icon.infoWindowAnchor = new GPoint(5, 1);
}

function openIn(page)
{
	var lnglat = markers[activeMarker].getPoint();
	var slng = lnglat.lng();
	var slat = lnglat.lat();
	var ulng = Math.abs(slng);
	var ulat = Math.abs(slat);
	var dlng = (slng < 0) ? 'W' : 'E';
	var dlat = (slat < 0) ? 'S' : 'N';

	switch(page)
	{
		case 'google_maps':			// GoogleMaps
			window.open('http://maps.google.com/maps?q=' + dlat + ulat + '+' + dlng + ulng + '&t=h&hl=de');
			break;
		case 'yahoo_maps':			// Yahoo Maps
			window.open('http://maps.yahoo.com/broadband/#mvt=m&lat=' + slat + '&lon=' + slng + '&mag=6');
			break;
		case 'bing_maps':	// Bing Maps
			window.open('http://www.bing.com/maps/default.aspx?v=2&style=r&lvl=16&sp=Point.' + slat + '_' + slng + '_landmark___');
			break;
		case 'openstreetmap':			// OpenStreetMap
			window.open('http://www.openstreetmap.org/index.html?mlat=' + slat + '&mlon=' + slng + '&zoom=15');
			break;
		case 'flash_earth':			// Flash Earth
			window.open('http://www.flashearth.com/?lat=' + slat + '&lon=' + slng + '&z=15&r=0&src=ggl');
			break;
		case 'multimap':				// Multimap
			window.open('http://www.multimap.com/p/browse.cgi?scale=10000&lon=' + slng + '&lat=' + slat + '');
			break;
		case 'msn_maps_and_directions':	// MSN Maps &amp; Directions
			window.open('http://maps.msn.com/map.aspx?&lats1=' + slat + '&lons1=' + slng + '&alts1=1&regn1=2');
			break;
		case 'acme_mapper':			// ACME Mapper
			window.open('http://mapper.acme.com/?ll=' + slat + ',' + slng + '&z=13&t=M');
			break;
		case 'geobios':				// GeaBios
			window.open('http://www.geabios.com/html/services/maps/PublicMap.htm?lat=' + slat + '&lon=' + slng + '&fov=0.01');
			break;
		case 'geody':				// Geody
			window.open('http://www.geody.com/geolook.php?world=terra&lat=' + slat + '&lon=' + slng + '');
			break;
		case 'wikipedia_world':			// Wikipedia World
			window.open('http://toolserver.org/~kolossos/wp-world/umkreis.php?la=de&lon=' + slng + '&lat=' + slat + '&rang=50&map=1');
			break;
		case 'panoramio':				// Panoramio
			window.open('http://www.panoramio.com/map/#lt=' + slat + '&ln=' + slng + '&z=6');
			break;
		case 'flickr':				// Flickr
			window.open('http://www.flickr.com/map/?&fLat=' + slat + '&fLon=' + slng + '&zl=5');
			break;
		case 'nasa_word_wind':			// NASA World Wind (Software)
			window.open('worldwind://goto/world=Earth&lat=' + slat + '&lon=' + slng + '&view=0.01');
			break;
	}
}

function createXML()
{
	xmlWindow = window.open("", "", "resizable=yes,width=700,height=500,left=" + (screen.availWidth / 2 - 350) + ",top=" + (screen.availHeight / 2 - 250));
	xmlWindow.focus();

	xmlWindow.document.body.style.margin = '0px';

	var out = "";

	out += '<div style="font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#000000; background-color:#feffb9; padding:10px; border-bottom:1px solid #000000;" onclick="this.style.display = \'none\';">Klicken Sie auf den Text zwischen den Tags, um ihn zu bearbeiten. Mit der Enter-Taste wird die Bearbeitung abgeschlossen.</div>'
	out += '<div style="font-family:Lucida Console; font-size:10pt; margin:10px;">';
	out += '<div style="color:#800080; display:inline;">&lt;?xml</div> <div style="color:#ff0000; display:inline;">version=</div><div style="color:#3a6ea5; display:inline;">"1.0"</div> <div style="color:#ff0000; display:inline;">encoding=</div><div style="color:#3a6ea5; display:inline;">"ISO-8859-1"</div> <div style="color:#800080; display:inline;">?&gt;</div><br />';
	out += '<div style="color:#800080;">&lt;markers&gt;</div>';

	var latlng;
	var title;
	var icon;
	for (var i = 0; i < markers.length; i++)
	{
		var latlng = markers[i].getPoint();
		var name = markers[i].getTitle();
		var address = '...';
		var icon = markers[i].getIcon().image;

		name = '<div style="display:inline; cursor:pointer;" onclick="opener.editText(this);">' + name + '</div>';
		address = '<div style="display:inline; cursor:pointer;" onclick="opener.editText(this);">' + address + '</div>';
		icon = '<div style="display:inline; cursor:pointer;" onclick="opener.editText(this);">' + icon + '</div>';

			out += '<blockquote style="margin:0px 0px 0px 32px;">';
		out += '  <div style="color:#800080; display:inline;">&lt;marker</div> <div style="color:#ff0000; display:inline;">lat=</div><div style="color:#3a6ea5; display:inline;">"' + (Math.round(latlng.lat() * 1000000) / 1000000) + '"</div> <div style="color:#ff0000; display:inline;">lng=</div><div style="color:#3a6ea5; display:inline;">"' + (Math.round(latlng.lng() * 1000000) / 1000000) + '"</div><div style="color:#800080; display:inline;">&gt;</div><br />';
			out += '<blockquote style="margin:0px 0px 0px 32px;">';
		out += '    <div style="color:#800080; display:inline;">&lt;name&gt;</div>' + name + '<div style="color:#800080; display:inline;">&lt;/name&gt;</div><br />';
		out += '    <div style="color:#800080; display:inline;">&lt;address&gt;</div>' + address + '<div style="color:#800080; display:inline;">&lt;/address&gt;</div><br />';
		out += '    <div style="color:#800080; display:inline;">&lt;icon&gt;</div>' + icon + '<div style="color:#800080; display:inline;">&lt;/icon&gt;</div><br />';
			out += '</blockquote>';
		out += '  <div style="color:#800080;">&lt;/marker&gt;</div>';
			out += '</blockquote>';
	}

	out += '<div style="color:#800080;">&lt;/markers&gt;</div>';
	out += '</div>';

	xmlWindow.document.body.innerHTML = out;
}

function editText(control)
{
	if (xmlWindow.document.getElementById("textInput"))
	{
		var newControl = xmlWindow.document.getElementById('textInput').parentNode;
		newControl.onclick = new Function("editText(this);");
		if (typeof newControl.textContent != "undefined")
		{ // FireFox
			newControl.textContent = xmlWindow.document.getElementById('textInput').value;
		}
		else
		{ // IE
			newControl.innerText = xmlWindow.document.getElementById('textInput').value;
		}
	}

	control.onclick = null;
	if (typeof control.textContent != "undefined")
		control.innerHTML = '<input type="text" id="textInput" style="width:350px; border:1px solid #006699;" value="' + control.textContent + '">';
	else
		control.innerHTML = '<input type="text" id="textInput" style="width:350px; border:1px solid #006699;" value="' + control.innerText + '">';

	xmlWindow.document.getElementById("textInput").onkeydown = function(e)
	{
		var keyCode;

		if (!e) { e = xmlWindow.event; }
		if (e.which)
		{
			keyCode = e.which;
		}
		else if (e.keyCode)
		{
			keyCode = e.keyCode;
		}

		if (keyCode == 13)
		{
			var newControl = xmlWindow.document.getElementById('textInput').parentNode;
			newControl.onclick = new Function("editText(this);");
			if (typeof newControl.textContent != "undefined")
			{ // FireFox
				newControl.textContent = xmlWindow.document.getElementById('textInput').value;
			}
			else
			{ // IE
				newControl.innerText = xmlWindow.document.getElementById('textInput').value;
			}
		}
	}

	xmlWindow.document.getElementById("textInput").focus();
}

function showRoute()
{
	var lnglat;
	var slng, slat;
	var ulng, ulat;
	var dlng, dlat;
	var out = '';

	for (var i = 0; i < markers.length; i++)
	{
		lnglat = markers[i].getPoint();
		slng = lnglat.lng();
		slat = lnglat.lat();
		ulng = Math.abs(slng);
		ulat = Math.abs(slat);
		dlng = (slng < 0) ? 'W' : 'E';
		dlat = (slat < 0) ? 'S' : 'N';

		switch(i)
		{
			case 0:
				out = '&saddr=' + dlat + ulat + '+' + dlng + ulng + '%20(' + escape(markers[i].getTitle()).replace("to:", "to :") + ')';
				break;
			case 1:
				out += '&daddr=' + dlat + ulat + '+' + dlng + ulng + '%20(' + escape(markers[i].getTitle()).replace("to:", "to :") + ')';
				break;
			default:
				out += '+to:' + dlat + ulat + '+' + dlng + ulng + '%20(' + escape(markers[i].getTitle()).replace("to:", "to :") + ')';
		}

	}

	window.open('http://maps.google.com/maps?f=d' + out + '&ie=UTF8&t=h&hl=de');
}

function addEvent(obj, type, fn)
{
	if (obj.attachEvent)
	{
		obj[type + fn] = function() { fn.call(obj, window.event); }
		obj.attachEvent('on' + type, obj[type + fn]);
	}
	else
	{
		obj.addEventListener(type, fn, false);
	}
}

function IsMouseEnter(elem, e)
{
	e = e || window.event;
	var target = e.target || e.srcElement;
	var fromElement = e.relatedTarget || e.fromElement || false;

	try
	{
		if (fromElement == false) { return true; }
		if (elem.contains(fromElement) || fromElement == elem)
		{
			return false;
		}
		else
		{
			return true;
		}
	}
	catch (e)
	{
		return true;
	}
}

function IsMouseLeave(elem, e)
{
	e = e || window.event;
	var target = e.target || e.srcElement;
	var toElement = e.relatedTarget || e.toElement || false;

	try
	{
		if (toElement == false) { return true; }
		if (elem.contains(toElement) || toElement == elem)
		{
			return false;
		}
		else
		{
			return true;
		}
	}
	catch (e)
	{
		return true;
	}
}