/*******************************************************************************
 * Javascript für twGmap05Sidebar - Version02
 ******************************************************************************/

var gmapId = "twGmap";  // id des GoogleMap-div's im html-code
var lat    = "48.365829880540495";  // Breitengrad (Latitude) z.B: 51.041
var lon    = "8.633193969726562";  // Längengrad (Longitude) z.B: 13.748
var zoom   = 12;        // Zoom-Wert von 1 bis ca 17 (nicht in "")(1=ganzeWelt)
var sidebarId      = "twGmapSidebar"  // id des Sitemap-div's im html-code
var sidebarHtml    = "";              // HTML-Code für die gesamte Sidebar
var sidebarMarkers = [];              // Array für die Marker
var sidebarCount   = 0;               // Zähler für die Marker (= Zeile in der Sidebar)
var sidebarZeichen = String.fromCharCode("A".charCodeAt(0) - 1);  // Buchstabe für das Marker-Icon
var sidebarLastLinkid;


/**
 * Prüft auf kompatiblen Browser und vorhandene Variablen und ruft die
 * Funktion auf, die die GoogleMap erstellt.
 */
function twGmapLoad() {
	if (GBrowserIsCompatible()) {
		// die Google Map (twGmap)
		if (!document.getElementById(gmapId)) {
			alert("Fehler: die Google Map mit der id "+ gmapId+ " konnte nicht auf dieser Webseite gefunden werden!");
			return false;
		} else {
			if (lat=="" || isNaN(lat)) {
				lat = 51.041;
				alert("Fehler: Der Breitengrad(lat) wurde im Skript nicht korrekt eingetragen!\nEin Defaultwert wird deshalb benutzt!");
			}
			if (lon=="" || isNaN(lon)) {
				lon = "13.748";
				alert("Fehler: Der Längengrad(lon) wurde im Skript nicht korrekt eingetragen!\nEin Defaultwert wird deshalb benutzt!");
			}
			if (typeof zoom == "undefined") {
				zoom = 3;
				alert("Fehler: Die Zoomstufe wurde im Skript nicht korrekt eingetragen!\nEin Defaultwert wird deshalb benutzt!");
			}
			machTwGmap(gmapId, lat, lon, zoom);			
		}
		// die Sidebar (twGmapSidebar)
		if (!document.getElementById(sidebarId)) {
			alert("Fehler: die Sidebar mit der id "+ sidebarId+ " konnte nicht auf dieser Webseite gefunden werden!");
			return false;			
		} else {			
			document.getElementById(sidebarId).innerHTML = sidebarHtml;
		}
	}
}


/**
 * Erstellt die GoogleMap in dem <div>-Bereich mit der übergebenen id
 * @param {Object} id   -im div-Bereich mit dieser id wird die Map dargestellt
 * @param {Object} lat  -Breitengrad 
 * @param {Object} lon  -Längengrad
 * @param {Object} zoom -Zoomstufe 1 bis 17 (ganze Welt bis kleiner Ausschnitt)
 */
function machTwGmap(id, lat, lon, zoom) {
	// die Map (für das div mit der id="...")
	var map = new GMap2(document.getElementById(id));
	// mit Zoom (auch noch: GSmallMapControl, GLargeMapControl, GSmallZoomControl, GScaleControl)
	map.addControl(new GLargeMapControl());
	// mit Typ-Auswahl (auch noch: GMapTypeControl, GHierarchicalMapTypeControl, GOverviewMapControl)
	map.addControl(new GMapTypeControl());
	map.addMapType(G_PHYSICAL_MAP);
	// ((Breitengrad, Längengrad), Zoomstufe, G_NORMAL_MAP/G_SATELLITE_MAP/G_HYBRID_MAP)
	map.setCenter(new GLatLng(lat, lon), zoom, G_PHYSICAL_MAP);
	
	map.addControl(new GOverviewMapControl());
  
  map.enableScrollWheelZoom();
  //map.enableContinuousZoom();
  map.enableDoubleClickZoom();
  
  /*
  map.hideControls();
  GEvent.addListener(map, "mouseover", function(){
    map.showControls();
  });
  GEvent.addListener(map, "mouseout", function(){
    map.hideControls(); 
    map.closeInfoWindow();
  });
  */
  
  GEvent.addListener(map,"infowindowclose", function() {
    document.getElementById(sidebarLastLinkid).style.color="";
    document.getElementById("twGmapSidebar").style.visibility = "visible";
    document.getElementById("twGmapSidebarBack").style.visibility = "visible";
  });

	// Marker setzen mit eigener Marker-Funktion
	map = setTwMarkers(map);
}


/**
 * Erstellt alle Marker für die übergebene Google Map.
 * (Ruft intern für jeden Marker eine eigene Funktion auf)
 * @param {Object} map
 */
function setTwMarkers(map) {
	var marker1 = machTwMarker('1','48.38633995765038','8.573541641235351','Aussichtsturm','<b>Aussichtsturm <br />in Dürrenmettstetten</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker2 = machTwMarker('2','48.374354182104724','8.544917106628418','Glatttalfreibad','<b>Glatttalfreibad</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker3 = machTwMarker('3','48.38528543665074','8.611350059509277','Drei-Täler-Radweg','<b>Drei-Täler-Radweg, <br />Radwege "Rund um Sulz"</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker4 = machTwMarker('4','48.38675320992094','8.62500786781311','KMZ Schloss Glatt','<b>Kultur- und Museumszentrum (KMZ) <br />Schloss Glatt</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker5 = machTwMarker('5','48.385214184443825','8.621242046356201','Nordic-Walking-Trails','<b>Nordic-Walking-Trails in Glatt</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker6 = machTwMarker('6','48.387038209531745','8.626048564910888','Schlossgarten in Glatt','<b>Mini-Golf und Spielbereich <br />im Schlossgarten in Glatt</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker7 = machTwMarker('7','48.39220355086194','8.668277263641357','Kanusport Neptun','<b>Kanusport Neptun</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker8 = machTwMarker('8','48.39355713981516','8.671517372131347','Burgruine Wehrstein','<b>Burgruine Wehrstein</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker9 = machTwMarker('9','48.36483195930538','8.6297607421875','Stockenberg','<b>Aussichtspunkt Stockenberg</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker10 = machTwMarker('10','48.3641761718475','8.641176223754882','"Gähnender Stein"','<b>Aussichtspunkt "Gähnender Stein"</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker11 = machTwMarker('11','48.3671414044279','8.641648292541504','Neckartalradweg','<b>Neckartalradweg</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker12 = machTwMarker('12','48.35476611776862','8.615974187850952','Burgruine Albeck','<b>Burgruine Albeck</b><div style="height:5px;width:10px;margin:0"></div><a href="front_content.php?idart=53&idcat=31"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker13 = machTwMarker('13','48.35622051241368','8.615255355834961','Waldlehrpfad Sulz','<b>Waldlehrpfad Sulz</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker14 = machTwMarker('14','48.35781744694708','8.622207641601562','Solefreizeitbad','<b>Solefreizeitbad "SUSOLEI" <br />und Minigolf</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker15 = machTwMarker('15','48.361866592266246','8.632464408874511','Historische Innenstadt','<b>Sulz, Historische Innenstadt <br />mit evangelischer Stadtkirche</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker16 = machTwMarker('16','48.36409063373049','8.6332368850708','Bauernfeind-Museum','<b>Bauernfeind-Museum</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker17 = machTwMarker('17','48.363363553936026','8.637034893035888','Ruder- & Tretbootverleih','<b>Ruder- und Tretboot-Verleih <br />am Stadtpark</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker18 = machTwMarker('18','48.35673381825838','8.633408546447754','Römerkeller Kastell','<b>Römerkeller Kastell</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker19 = machTwMarker('19','48.358473316271976','8.671045303344726','HSB-Radweg','<b>Heidelberg-Schwarzwald-<br />Bodensee-Radweg</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker20 = machTwMarker('20','48.34618149199625','8.684370517730713','Wehrkirche Bergfelden','<b>Wehrkirche Bergfelden</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker21 = machTwMarker('21','48.358002802177474','8.733057975769043','Ehem. Kloster Kirchberg','<b>Ehemaliges Kloster Kirchberg</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker22 = machTwMarker('22','48.34660933150661','8.723080158233642','Ehem. Kloster Bernstein','<b>Ehemaliges Kloster Bernstein</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker23 = machTwMarker('23','48.36970733174257','8.643150329589843','Hallenkartbahn','<b>Hallenkartbahn</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	var marker24 = machTwMarker('24','48.36888054705878','8.657784461975097','Neckarweg (Wanderweg)','<b>Neckarweg (Wanderweg)</b><div style="height:5px;width:10px;margin:0"></div><a href="http://www.markkom.de/entwicklung/sulz.de/tourismus/freizeittipps/index.html"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',map);
	map.addOverlay(marker1);
	map.addOverlay(marker2);
	map.addOverlay(marker3);
	map.addOverlay(marker4);
	map.addOverlay(marker5);
	map.addOverlay(marker6);
	map.addOverlay(marker7);
	map.addOverlay(marker8);
	map.addOverlay(marker9);
	map.addOverlay(marker10);
	map.addOverlay(marker11);
	map.addOverlay(marker12);
	map.addOverlay(marker13);
	map.addOverlay(marker14);
	map.addOverlay(marker15);
	map.addOverlay(marker16);
	map.addOverlay(marker17);
	map.addOverlay(marker18);
	map.addOverlay(marker19);
	map.addOverlay(marker20);
	map.addOverlay(marker21);
	map.addOverlay(marker22);
	map.addOverlay(marker23);
	map.addOverlay(marker24);
	
	return map;
}


function machTwMarker(lbl,lat,lon,ttl,txt,map) {
	var point = new GLatLng(lat, lon);
  var newIcon = MapIconMaker.createLabeledMarkerIcon({primaryColor: "#1A47A4", strokeColor: "#1A47A4", label: lbl, labelColor: "#FFFFFF"});
  var marker = new GMarker(point,{icon: newIcon});
  var html = txt;
  var linkid = "link" + sidebarCount;
  GEvent.addListener(marker, "click", function() {
    
    var maxContentDiv = document.createElement('div');
    maxContentDiv.innerHTML = 'Laden...';
    maxContentDiv.style.width = '300';
    
    marker.openInfoWindowHtml(html);
    /*
    marker.openInfoWindowHtml(html + '<br /><a href="javascript:var iw = map.getInfoWindow();GEvent.trigger(iw,\'maximizeclick\');"><img src="images/ico_info_kl.gif" border="" align="absmiddle" style="margin:0px 5px 0 0" />weitere Informationen</a>',
      {maxContent: maxContentDiv, 
       maxTitle: lbl + " " +ttl});
    */
    document.getElementById(linkid).style.color="#CC0001";
    sidebarLastLinkid=linkid;
    
    /*
    var iw = map.getInfoWindow();
    GEvent.addListener(iw, "maximizeclick", function() {
      document.getElementById("twGmapSidebar").style.visibility = "hidden";
      document.getElementById("twGmapSidebarBack").style.visibility = "hidden";
      GDownloadUrl("front_content.php?idart=53&idcat=31", function(data) {
        maxContentDiv.innerHTML = data;
      });
    });
    GEvent.addListener(iw, "restoreclick", function() {
      document.getElementById("twGmapSidebar").style.visibility = "visible";
      document.getElementById("twGmapSidebarBack").style.visibility = "visible";
    });
    */
  });
  
	// nur wenn ein Verweis auf diesen Marker in der Sidebar angezeigt werden soll
	machZeileInTwGmapSidebar(lbl + " " + ttl, marker, linkid, map);
	
	return marker;
}

/**
 * Schreibt den HTML-Code für eine Zeile(Verweis) in die globale Variable 'sidebarHtml'.
 * Dabei wird auch gleich der übergebene Marker in das Marker-Array eingefügt,
 * und der Zähler (zählt alle Marker) hochgezählt.
 * @param {Object} text   -der anzuzeigende Text für diese Zeile in der Sidebar
 * @param {Object} marker -der Marker, auf den der Verweis zeigt
 */
function machZeileInTwGmapSidebar(text, marker, linkid, map) {
  sidebarMarkers[sidebarCount] = marker;
  sidebarHtml += '<div>';
  //sidebarHtml += '<span class="sidebarZeichen">' + sidebarZeichen + '</span>';
  sidebarHtml += '<a id="' + linkid + '"'
  sidebarHtml += ' href="javascript:twGmapSidebarIsClicked(' + sidebarCount + ')"'
  sidebarHtml += ' onfocus="if(this.blur)this.blur()"'
  //sidebarHtml += ' onmouseover="heat(' + sidebarCount + ', ' + map + ')"'
  //sidebarHtml += ' onmouseout="cool(' + sidebarCount + ', ' + map + ')"'
  sidebarHtml += '>' + text + '</a>';
  sidebarHtml += '</div>';
  sidebarCount ++;
}

/**
 * Event-Handler für Klick auf Marker, öffnet das dazugehörige Info-Fenster.
 * @param {Object} i -ein bestimmter Marker aus dem Marker-Array
 */
function twGmapSidebarIsClicked(i) {
	GEvent.trigger(sidebarMarkers[i], "click");
}

/**
 * Liefert ein GIcon-Objekt, das einen Marker darstellt.
 * Hier stellt das Icon einen Buchstabe dar. 
 * Über die globale Variable 'sidebarZeichen' wird bei jedem Durchlauf der 
 * nächsthöhere Buchstabe des Alphabets angezeigt. 
 */
function machTwIconBuchstabeFortlaufend() {
	sidebarZeichen = String.fromCharCode(sidebarZeichen.charCodeAt(0) + 1);
	var icon = new GIcon(G_DEFAULT_ICON, "http://www.google.com/mapfiles/marker" + sidebarZeichen + ".png");
	icon.printImage = "http://maps.google.com/mapfiles/marker"+sidebarZeichen+"ie.gif"
	icon.mozPrintImage = "http://maps.google.com/mapfiles/marker"+sidebarZeichen+"ff.gif"
	
	return icon;
}

/**
 * MouseOver in der Liste
 */

function heat(num, map){
  var hotIcon = new GIcon(G_DEFAULT_ICON);
  var attract;
  attract = new GMarker(sidebarMarkers[num].getPoint(),hotIcon);
  map.addOverlay(attract);
  //sidebarMarkers[99] = attract;
  //GEvent.trigger(sidebarMarkers[99], "addOverlay");
  
  //GEvent.trigger(attract, "show");
  //GEvent.trigger(sidebarMarkers[num], "click");
  //map.addOverlay(attract);
  //map.closeInfoWindow();
}

function cool(num, map){
  var hotIcon = new GIcon(G_DEFAULT_ICON);
  var attract;
  //GEvent.trigger(attract, "hide");
  map.removeOverlay(attract);
}