/*******************************************************************************
 * Javascript für twGmap05Sidebar - Version04
 * Mit Google Maps Landkarten auf der Website einbinden
 * So kommen Sie an die Koordinaten eines Ortes: d
 * - directories.ch aufrufen
 * - Adresse eingeben
 * - mit gefundener Adresse auf mapper.ch eigene Karte erstellen
 * - Koordinaten aus URL herauskopieren
 * Tipps: 	http://www.strassenprogrammierer.de/geotagging-google-maps_tipp_483.html
 *			http://blogs.salesforce.com/blogs/2005/02/integrating_goo.html
 *			http://www.google.com/uds/solutions/wizards/mapsearch.html
 * Kostenloser Schlüssel: http://www.google.de/apis/maps/
 ******************************************************************************/

var gmapId = "twGmap";  // id des GoogleMap-div's im html-code
var lat    = "47.200";  // Breitengrad (Latitude) z.B: 51.041
var lon    = "7.500";  // Längengrad (Longitude) z.B: 13.748
var zoom   = 8;        // 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;                // id des zuletzt angeklickten Markers/Verweises


/**
 * 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 Internetseite gefunden werden!");
			return false;
		} else {
			if (lat=="" || isNaN(lat)) {
				lat = 46.541;
				alert("Fehler: Der Breitengrad(lat) wurde im Skript nicht korrekt eingetragen!\nEin Defaultwert wird deshalb benutzt!");
			}
			if (lon=="" || isNaN(lon)) {
				lon = "8.248";
				alert("Fehler: Der Längengrad(lon) wurde im Skript nicht korrekt eingetragen!\nEin Defaultwert wird deshalb benutzt!");
			}
			if (typeof zoom == "undefined") {
				zoom = 10;
				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 Internetseite gefunden werden!");
			return false;			
		} else {			
			document.getElementById(sidebarId).innerHTML = sidebarHtml;
		}
	}
}


/**
 * Erstellt die GoogleMap in dem <div>-Bereich mit der &uuml;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&uuml;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());
	// ((Breitengrad, Längengrad), Zoomstufe, G_NORMAL_MAP/G_SATELLITE_MAP/G_HYBRID_MAP)
	map.setCenter(new GLatLng(lat, lon), zoom, G_NORMAL_MAP);
	
	// Marker setzen mit eigener Marker-Funktion
	map = setTwMarkers(map);
	
	// Sidebar-Zeile wieder demarkieren, wenn ein Infofenster geschlossen wird
	GEvent.addListener(map,"infowindowclose", function() {
		document.getElementById(sidebarLastLinkid).style.background="#5C5C5C";
	});
}


/**
 * Erstellt alle Marker f&uuml;r die &uuml;bergebene Google Map.
 * (Ruft intern f&uuml;r jeden Marker eine eigene Funktion auf)
 * @param {Object} map
 */
function setTwMarkers(map) {
	var marker01 = machTwMarker01();
	var marker02 = machTwMarker02();
	var marker03 = machTwMarker03();
	var marker04 = machTwMarker04();
	var marker05 = machTwMarker05();
	var marker06 = machTwMarker06();
	var marker07 = machTwMarker07();
	var marker08 = machTwMarker08();
	map.addOverlay(marker01);
	map.addOverlay(marker02);
	map.addOverlay(marker03);
	map.addOverlay(marker04);
	map.addOverlay(marker05);
	map.addOverlay(marker06);
	map.addOverlay(marker07);
	map.addOverlay(marker08);

	return map;
}





// A - B&uuml;tzberg/BE
function machTwMarker01() {
	var point = new GPoint(7.7548, 47.2172);
	var icon = machTwIconBuchstabeFortlaufend();
	var marker = new GMarker(point, {icon:icon});
	var html   = "<a target='_blank' class='sidebarLink' href='http://www.combyart.ch/mein_service/prospekte/media/swf/kreisel_buetzberg.swf' params='lightwindow_width=1050,lightwindow_height=600' title='«Begegnung», B&uuml;tzberg/BE' accesskey='a'>Verkehrskreisel:<br />«Begegnung», B&uuml;tzberg/BE</a>";
	var linkid = "link"+sidebarCount;		
	GEvent.addListener(marker, "click", function() { 
		marker.openInfoWindowHtml(html);
		document.getElementById(linkid).style.background="#2681B2"; ///blau"; 
		document.getElementById(linkid).style.color="#FFFFFF"; 		///weiss"; 
		sidebarLastLinkid=linkid;
	});  		
	machZeileInTwGmapSidebar("B&uuml;tzberg/BE", marker, linkid);  
	return marker;
}

// B - Eclépens/VD
function machTwMarker02() {
//	var point = new GPoint(6.546, 46.654);
	var point = new GPoint(6.546, 46.652);
	var icon = machTwIconBuchstabeFortlaufend();
	var marker = new GMarker(point, {icon:icon});
	var html   = "<a target='_blank' class='sidebarLink' href='http://www.combyart.ch/mein_service/prospekte/media/swf/projektkarte_smozz_e_papga.swf'>Postmailgebäude:<br />«Smozz e Papga»,<br />Eclépens/VD</a>";
	var linkid = "link"+sidebarCount;  
	GEvent.addListener(marker, "click", function() { 
		marker.openInfoWindowHtml(html);
		document.getElementById(linkid).style.background="#2681B2"; ///blau"; 
		document.getElementById(linkid).style.color="#FFFFFF"; 		///weiss"; 
		sidebarLastLinkid=linkid;   
	}); 
	machZeileInTwGmapSidebar("Eclépens/VD", marker, linkid);  
	return marker;
}


// C - Härkingen/SO
function machTwMarker03() {
//	var point = new GPoint(6.546, 46.654);
	var point = new GPoint(7.814875, 47.317961);
	var icon = machTwIconBuchstabeFortlaufend();
	var marker = new GMarker(point, {icon:icon});
	var html   = "<a target='_blank' class='sidebarLink' href='http://www.combyart.ch/mein_service/prospekte/media/swf/portfolio_haerkingen.swf'>Postmailgebäude:<br />«Härkingen liegt am Meer»,<br />Härkingen/SO</a>";
	var linkid = "link"+sidebarCount;  
	GEvent.addListener(marker, "click", function() { 
		marker.openInfoWindowHtml(html);
		document.getElementById(linkid).style.background="#2681B2"; ///blau"; 
		document.getElementById(linkid).style.color="#FFFFFF"; 		///weiss"; 
		sidebarLastLinkid=linkid;   
	});  
	machZeileInTwGmapSidebar("Härkingen/SO", marker, linkid);  
	return marker;
}

function machTwMarker04() {
	var point = new GPoint(8.380324, 47.1045);
	var icon = machTwIconBuchstabeFortlaufend();
	var marker = new GMarker(point, {icon:icon});
	var html   = "<a target='_blank' class='sidebarLink' href='http://www.combyart.ch/mein_service/prospekte/media/swf/projektkarte_tensionenergy.swf'>Verkehrskreisel:<br />«tension - energy»,<br />Root/LU</a>";
	var linkid = "link"+sidebarCount;		
	GEvent.addListener(marker, "click", function() { 
		marker.openInfoWindowHtml(html);
		document.getElementById(linkid).style.background="#2681B2"; ///blau"; 
		document.getElementById(linkid).style.color="#FFFFFF"; 		///weiss"; 
		sidebarLastLinkid=linkid; 
	});  		
	machZeileInTwGmapSidebar("Root/LU", marker, linkid); 
	return marker;
}

function machTwMarker05() {
//	var point = new GPoint(7.631131, 46.781807);
	var point = new GPoint(7.61670, 46.77385);
	var icon = machTwIconBuchstabeFortlaufend();
	var marker = new GMarker(point, {icon:icon});
	var html   = "<a target='_blank' class='sidebarLink' href='http://www.combyart.ch/mein_service/prospekte/media/swf/kreisel_steffisburg.swf'>Verkehrskreisel:<br />«Die Br&uuml;cke»,<br />Steffisburg/BE</a>";
	var linkid = "link"+sidebarCount;		
	GEvent.addListener(marker, "click", function() { 
		marker.openInfoWindowHtml(html);
		document.getElementById(linkid).style.background="#2681B2"; ///blau"; 
		document.getElementById(linkid).style.color="#FFFFFF"; 		///weiss"; 
		sidebarLastLinkid=linkid;
	});  		
	machZeileInTwGmapSidebar("Steffisburg/BE", marker, linkid);  
	return marker;
}

function machTwMarker06() {
//	var point = new GPoint(8.58923, 47.417508);
	var point = new GPoint(8.58923, 47.417508);
	var icon = machTwIconBuchstabeFortlaufend();
	var marker = new GMarker(point, {icon:icon});
	var html   = "<a target='_blank' class='sidebarLink' href='http://www.combyart.ch/mein_service/prospekte/media/swf/schulhaus_wallisellen.swf'>Primarschule:<br />«Schul-Bank»,<br />Wallisellen/ZH</a>";
	var linkid = "link"+sidebarCount;  
	GEvent.addListener(marker, "click", function() { 
		marker.openInfoWindowHtml(html);
		document.getElementById(linkid).style.background="#2681B2"; ///blau"; 
		document.getElementById(linkid).style.color="#FFFFFF"; 		///weiss"; 
		sidebarLastLinkid=linkid;   
	});  
	machZeileInTwGmapSidebar("Wallisellen/ZH", marker, linkid);  
	return marker;
}

function machTwMarker07() {
//	var point = new GPoint(7.643652, 47.247327);
//	var point = new GPoint(7.7548, 47.2172);
	var point = new GPoint(7.6558, 47.239);
	var icon = machTwIconBuchstabeFortlaufend();
	var marker = new GMarker(point, {icon:icon});
	var html   = "<a target='_blank' class='sidebarLink' href='http://www.combyart.ch/mein_service/prospekte/media/swf/kreisel_wiedlisbach.swf'>Verkehrskreisel:<br />«Flux-Fluss»,<br />Wiedlisbach/BE</a>";
	var linkid = "link"+sidebarCount;		
	GEvent.addListener(marker, "click", function() { 
		marker.openInfoWindowHtml(html);
		document.getElementById(linkid).style.background="#2681B2"; ///blau"; 
		document.getElementById(linkid).style.color="#FFFFFF"; 		///weiss"; 
		sidebarLastLinkid=linkid; 
	});  		
	machZeileInTwGmapSidebar("Wiedlisbach/BE", marker, linkid); 
	return marker;
}

function machTwMarker08() {
	var point = new GPoint(7.534707, 47.439121);
	var icon = machTwIconBuchstabeFortlaufend();
	var marker = new GMarker(point, {icon:icon});
	var html   = "<a target='_blank' class='sidebarLink' href='http://combyart.ch/portfolio/projektleitung/kunst_fuer_industrie_und_oeffentliche_bauten/05_shoppingcenter.htm'>Coop Heim- und Hobbymarkt:<br />«Fr&uuml;hlingserwachen»,<br />Zwingen/BL</a>";
	var linkid = "link"+sidebarCount;		
	GEvent.addListener(marker, "click", function() { 
		marker.openInfoWindowHtml(html);
		document.getElementById(linkid).style.background="#2681B2"; ///blau"; 
		document.getElementById(linkid).style.color="#FFFFFF"; 		///weiss"; 
		sidebarLastLinkid=linkid;
	});  		
	machZeileInTwGmapSidebar("Zwingen/BL", marker, linkid);  
	return marker;
}


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

/**
 * Event-Handler f&uuml;r Klick auf Marker, &ouml;ffnet das dazugeh&ouml;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. 
 * &uuml;ber die globale Variable 'sidebarZeichen' wird bei jedem Durchlauf der 
 * nächsth&ouml;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;
}