// Erzeugen der Variablen gicons und icontype fur verschiedene/farbige Markers
var gmarkers = [];
var htmls = [];
var gicons = [];
var mapmode = true;
var map;

// Umlautproblematik
var suchen = new Array('ü', 'Ü', 'ä', 'Ä', 'ö', 'Ö', 'ß');			
var ersatz = new Array('ü', 'Ü', 'ä', 'Ä', 'ö', 'Ö', 'ß');

// Standartwerte fuer farbige Ikons von Google Map
function createIcons() {
	var farbicon = new google.maps.Icon();
	farbicon.iconSize = new google.maps.Size(12, 22);
	farbicon.shadowSize = new google.maps.Size(22, 20);
	farbicon.iconAnchor = new google.maps.Point(6, 20);
	farbicon.infoWindowAnchor = new google.maps.Point(5, 1);
	
	gicons["green"]  = new google.maps.Icon(farbicon, "marker/mm_20_green.png", null, "marker/mm_20_shadow.png");
	gicons["red"]  = new google.maps.Icon(farbicon, "marker/mm_20_red.png", null, "marker/mm_20_shadow.png");
	gicons["yellow"]  = new google.maps.Icon(farbicon, "marker/mm_20_yellow.png", null, "marker/mm_20_shadow.png");
}

function toggle(div) {
	if(document.getElementById(div).style.display=='none') { 
		document.getElementById(div).style.display='block';
	}
	else {
		document.getElementById(div).style.display='none';
	}
}

function myclick(id) {
	// Wenn Google API geladen ist, den Marker öffnen
	if ((typeof(google) == 'object') && (mapmode == true)) {
		if (gmarkers[id]) { gmarkers[id].openInfoWindowHtml(htmls[id]); }
	}
	else { // Wenn Google API nicht geladen ist, zur Seite springen
		document.getElementById('bad_elster_form').value = document.getElementById('bad_elster').style.display;
		document.getElementById('bad_brambach_form').value = document.getElementById('bad_brambach').style.display;
	
		document.getElementById('myclick_form').value = id;
		document.forms.sidebar.submit();
	}
}

// Erzeugen der Karte und speichern des Pointers in map
function createMap() {
	map = new google.maps.Map2(document.getElementById("map"));
	map.addControl(new google.maps.LargeMapControl());
	map.addControl(new google.maps.MapTypeControl());
	map.setCenter(new google.maps.LatLng(50.2828746, 12.2389625), 16);
	//map.setMapType(G_HYBRID_MAP);
	return map;
}


// Funktion zum Ersetzen der Umlaute
function specialChars(string) {
	for (var t=0; t<ersatz.length; t++) {
		string = string.split(ersatz[t]).join(suchen[t]);
	}
	return string;
}

// Marker Inhalt erzeugen
function createMarkerHtml(infowindow, label, url, image, lat, lng) {
	infowindow = specialChars(infowindow);
	label = specialChars(label);

	var titel = '<H3><A HREF="' + url + '">' + label + '</A></H3>';
	if (image) {
		var bild = '<IMG SRC="' + image +'" width="80" height="80" style="float:left;padding-right:5px;">'; 
	} else { var bild = ''; }
	if (url) {
		var link = '<A style="cursor: pointer; background-image: url(/FIRMENSPECIALS/CHURSAECHSISCHE/GOOGLE/marker/pfeil.gif); background-position: left 0.35em; background-repeat: no-repeat; overflow: visible; padding-left: 8px;" HREF="' + url + '">Details</A>';
	}
	else { var link = ''; }
	
	var inhalt = bild + infowindow + '<P></P><A style="cursor: pointer; background-image: url(/FIRMENSPECIALS/CHURSAECHSISCHE/GOOGLE/marker/pfeil.gif); background-position: left 0.35em; background-repeat: no-repeat; overflow: visible; padding-left: 8px;" onClick="getDirections(' + lat + ',' + lng + ')">Anreise</A><BR>' + link;
	
	var html = '<div id="window"><div class="name"> ' + titel + '</div>' + inhalt + '</div>';
	
	return html;
}

// Erzeugen des Marker und der Funktion, die ein Infofenster beim Klicken auf den Marker oeffnet
function createMarker(id, point, html, icontype) {
	var marker = new google.maps.Marker(point, gicons[icontype]);
	google.maps.Event.addListener(marker,"click", function() {
		marker.openInfoWindowHtml(html);
	});

	gmarkers[id] = marker;
	htmls[id] = html;
	return marker;
}

// Funktion für das Anzeigen der Route
function getDirections(lat, lng) {
	// Startadresse einlesen
	start = prompt('Bitte geben Sie den Startpunkt ein:');
	if (!start || start == '') return;
	
	dir = new google.maps.Directions(map, document.getElementById('direction')); // neue Instanz des GDirection Objekts erzeugen
	map.clearOverlays(); // Marker löschen
	mapmode = false;
	dir.load('from: ' + start + ' to: ' + lat + ', ' + lng, { 'locale': 'de_DE' }); // Karte laden
}

// alle Funktionen aufrufen
function initialize() {
	
	// Die Ansichten der Sidebar setzen
	document.getElementById('bad_elster').style.display = document.getElementById('bad_elster_shown').value;
	document.getElementById('bad_brambach').style.display = document.getElementById('bad_brambach_shown').value;

	if (google.maps.BrowserIsCompatible()) { 
		createIcons(); // Icons erzeugen
		map = createMap(); // Karte erzeugen
		
		google.maps.DownloadUrl("objekte.xml", function(data) {
			var xml = google.maps.Xml.parse(data);
			var markers = xml.documentElement.getElementsByTagName("marker");
			
			for (var i = 0; i < markers.length; i++) {
			
				// XML Knoten lesen
				var lat 	= parseFloat(markers[i].getAttribute("lat"));
				var lng 	= parseFloat(markers[i].getAttribute("lng"));
				var point 	= new google.maps.LatLng(lat, lng);
				
				var id		= parseInt(markers[i].getAttribute("id"));
				var icontype 	= markers[i].getAttribute("icontype");
				var infowindow 	= google.maps.Xml.value(markers[i].getElementsByTagName("infowindow")[0]);
				var label 	= google.maps.Xml.value(markers[i].getElementsByTagName("label")[0]);
				var url 	= google.maps.Xml.value(markers[i].getElementsByTagName("link")[0]);
				var image 	= google.maps.Xml.value(markers[i].getElementsByTagName("img")[0]);
				
				// Marker erzeugen und anzeigen
				var html = createMarkerHtml(infowindow, label, url, image, lat, lng);
				var marker = createMarker(id, point, html, icontype);
				map.addOverlay(marker);
			}
			// Den ersten Marker öffnen
			myclick(document.getElementById('myclick').value);
		});
	}
}