
// die Karte
var mymap;
// Marker für Sportplatz, Start/Ziel, Wende
var sportplatz;
var startZiel;
var wende;
// Streckenabschnitte 
var strecke5km;
var strecke13km_1;
var strecke13km_2;
var strecke13km_3;
var stadionrunde;
var strecke1_2km;
var strecke2km;
// bool
var saveMapPostionOnMoveEnd;
var showCalculatedLength=false;


    function load() {
      if (GBrowserIsCompatible()) {
        mymap = new GMap2(document.getElementById("map"));
		mymap.setCenter(new GLatLng(51.37960588867736,9.971230030059814), 14);
        
        //Map Controls hinzufügen
		mymap.addMapType(G_PHYSICAL_MAP);
        mymap.setMapType(G_HYBRID_MAP);
        mymap.addControl(new GMapTypeControl());
        mymap.addControl(new GScaleControl());
        mymap.addControl(new GLargeMapControl());
  
        //Start/Ziel Icon
		var startIcon = new GIcon();
        startIcon.image = "http://www.drei-laender-lauf.com/karten/startZiel.png";
        startIcon.iconSize = new GSize(112, 40);
        startIcon.iconAnchor = new GPoint(2, 37);

		//Wende Icon
        var wendeIcon = new GIcon();
        wendeIcon.image = "http://www.drei-laender-lauf.com/karten/wende.png";
        wendeIcon.iconSize = new GSize(112, 40);
        wendeIcon.iconAnchor = new GPoint(2, 37);

		//Sportplatz Icon
        var sportplatzIcon = new GIcon();
        sportplatzIcon.image = "http://www.drei-laender-lauf.com/karten/sportplatz.png";
        sportplatzIcon.iconSize = new GSize(112, 40);
        sportplatzIcon.iconAnchor = new GPoint(2, 37);

        //Marker für Sportplatz, Start/Ziel und Wende
		sportplatz = new GMarker(new GLatLng(51.37960588867736,9.971230030059814),sportplatzIcon, true);
        startZiel = new GMarker(new GLatLng(51.37982,9.970870000000001),startIcon, true);
        wende = new GMarker(new GLatLng(51.391544166010306,9.949981570243835),wendeIcon, true);
        
		//Streckenabschnitte definieren
		strecke5km = new GPolyline.fromEncoded({
			color: "#FF0000",
			weight: 6,
			points: "{brxH}lz{@dAlBl@Nd@g@RaAOcAv@p@{@hEyHlJ{BbEsGvMsCzEsFrGeBfEEbDUd@mB_@{@Vq@jC{Aj@yC|GmBrF}DvP}BrF{FzJuBnC",
			levels: "BBBBBBBBBBBBBBBBBBBBBBBBBB",
			zoomFactor: 32,
			numLevels: 4
		});

		strecke13km_1 = new GPolyline.fromEncoded({
			color: "#FF0000",
			weight: 6,
			points: "{brxH}lz{@dAlBl@Nd@g@RaAOcAv@p@{@hEyHlJ{BbEsGvMsCzEsFrGeBfEEbDUd@mB_@{@Vq@jC{Aj@yC|GmBrF}DvP}BrF{FzJ~@`@p@z@",
			levels: "BBBBBBBBBBBBBBBBBBBBBBBBBBB",
			zoomFactor: 32,
			numLevels: 4
		});
		
		strecke13km_2 = new GPolyline.fromEncoded({
			color: "#FF0000",
			weight: 6,
			points: "{dtxH}kv{@z@lA[`BZpE_@x@H~@lBhChCdG_K|[Fp@sGbSUrA",
			levels: "BBBBBBBBBBBB",
			zoomFactor: 32,
			numLevels: 4
		});

		strecke13km_3 = new GPolyline.fromEncoded({
			color: "#FF0000",
			weight: 6,
			points: "_qtxHizs{@VpAElAp@fNFtHG|Dv@bSv@`Rd@fBkBzPAfCtAbPNdCz@rD|ArFxB|KlCgDxF{KzGsEzH{C|BBvBfAxA|@d`@cWjDiBuAmH{EgJz@uCsBqEeCmDpBiHT{BkBqEvB}EbBqKZwFeCcPoNm^kQ|IyAS{@hB_f@fVoEZ",
			levels: "BBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB",
			zoomFactor: 32,
			numLevels: 4
		});

		stadionrunde = new GPolyline.fromEncoded({
			color: "#FF0000",
			weight: 6,
			points: "{brxHylz{@dAhBl@Nd@g@RaAOcAiCuEm@Gg@^O~@H~@hArB",
			levels: "BBBBBBBBBBBB",
			zoomFactor: 32,
			numLevels: 4
		});
		
		strecke1_2km = new GPolyline.fromEncoded({
			color: "#FF0000",
			weight: 6,
			points: "{brxH{lz{@z@`Br@Vf@]TeAEu@d@Zc@dCy@jBwG~HwBpDAcGa@wGFiBfCqHxC~FhCdE",
			levels: "BBBBBBBBBBBBBBBBB",
			zoomFactor: 32,
			numLevels: 4
		});

		strecke2km = new GPolyline.fromEncoded({
			color: "#FF0000",
			weight: 6,
			points: "{brxH{lz{@z@`Br@Vf@]TeAEu@d@Zc@dCy@jBwG~HuBbEwCtGfIdG~AkCzA|@q@lDF^xCvBf@HXa@f@wEVcIYeCsAgJa@_IEa@",
			levels: "BBBBBBBBBBBBBBBBBBBBBBBBBB",
			zoomFactor: 32,
			numLevels: 4
		});

		function StreckenAuswahlControl(){}
		StreckenAuswahlControl.prototype = new GControl();
		StreckenAuswahlControl.prototype.initialize = function(map) {
			var rahmen = document.createElement("div");
			
			var control_1_2km = document.createElement("div");
			control_1_2km.appendChild(document.createTextNode("1,2km"));
			this.setButtonStyle_(control_1_2km);
			rahmen.appendChild(control_1_2km);
			GEvent.addDomListener(control_1_2km, "click", function() {
				einzeichnen_1_2km();
			});

			var control_2km = document.createElement("div");
			control_2km.appendChild(document.createTextNode("2km"));
			this.setButtonStyle_(control_2km);
			rahmen.appendChild(control_2km);
			GEvent.addDomListener(control_2km, "click", function() {
				einzeichnen_2km();
			});

			var control_5km = document.createElement("div");
			control_5km.appendChild(document.createTextNode("5km"));
			this.setButtonStyle_(control_5km);
			rahmen.appendChild(control_5km);
			GEvent.addDomListener(control_5km, "click", function() {
				einzeichnen_5km();
			});
			
			
			var control_13km = document.createElement("div");
			control_13km.appendChild(document.createTextNode("13km"));
			this.setButtonStyle_(control_13km);
			rahmen.appendChild(control_13km);
			GEvent.addDomListener(control_13km, "click", function() {
				einzeichnen_13km();
			});
			
			var control_sp = document.createElement("div");
			control_sp.appendChild(document.createTextNode("Sportplatz"));
			this.setButtonStyle_(control_sp);
			rahmen.appendChild(control_sp); 
			GEvent.addDomListener(control_sp, "click", function() {
				einzeichnen_Sportplatz();
			}); 
			
			map.getContainer().appendChild(rahmen);
			return rahmen;
		}
		StreckenAuswahlControl.prototype.getDefaultPosition = function() {
			return new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(7,20));
		}
		StreckenAuswahlControl.prototype.setButtonStyle_ = function(button) {
			button.className="button";
			button.style.marginLeft = "5px";
		}
		mymap.addControl(new StreckenAuswahlControl());

		
		einzeichnen_Sportplatz();
		GEvent.addListener(mymap,"moveend",function () {
			//document.getElementById("desc").firstChild.data+="+";
			if (! saveMapPostionOnMoveEnd) return;
			setTimeout("mymap.savePosition()",1000);
			saveMapPostionOnMoveEnd = false;
		});
      }
    }
	
	
	
	function karte_leeren_() {
		mymap.clearOverlays();
		saveMapPostionOnMoveEnd = true;
		window.scrollTo(0,0);
	}
	
	function einzeichnen_1_2km() {
      if (GBrowserIsCompatible()) {
		karte_leeren_();
		mymap.setZoom(16);
		mymap.panTo(new GLatLng(51.379964149277036,9.969964027404785));
		mymap.addOverlay(startZiel);
		mymap.addOverlay(strecke1_2km);
		
		var meters = 0.0;
        for (var i=1; i < strecke1_2km.getVertexCount(); i++) {
			meters+= strecke1_2km.getVertex(i).distanceFrom(strecke1_2km.getVertex(i-1));
			if (i==8) meters *=2;
		}
		
		document.getElementById("desc").firstChild.data="Verlauf der 1,2km Strecke";
		if (showCalculatedLength) document.getElementById("desc").firstChild.data+=" ("+(meters/1000).toFixed(1)+" km)";
	  }
	}

	function einzeichnen_2km() {
      if (GBrowserIsCompatible()) {
		karte_leeren_();
		mymap.setZoom(16);
		mymap.panTo(new GLatLng(51.37992397065779,9.96786117553711));
		mymap.addOverlay(startZiel);
		mymap.addOverlay(strecke2km);
		
		var meters = 0.0;
        for (var i=1; i < strecke2km.getVertexCount(); i++) {
			meters+= strecke2km.getVertex(i).distanceFrom(strecke2km.getVertex(i-1));
			if (i==7) meters *=2;
		}
		
		document.getElementById("desc").firstChild.data="Verlauf der 2km Strecke";
		if (showCalculatedLength) document.getElementById("desc").firstChild.data+=" ("+(meters/1000).toFixed(1)+" km)";
	  }
	}

	function einzeichnen_5km() {
      if (GBrowserIsCompatible()) {
		karte_leeren_();
		mymap.setZoom(14);
		mymap.panTo(new GLatLng(51.38495941613736,9.960479736328125));
		mymap.addOverlay(startZiel);
        mymap.addOverlay(stadionrunde);
		mymap.addOverlay(strecke5km);
		mymap.addOverlay(wende);
		
		var meters = 0.0;
        for (var i=1; i < strecke5km.getVertexCount(); i++) meters+= strecke5km.getVertex(i).distanceFrom(strecke5km.getVertex(i-1));
        meters*=2;
		for (var i=1; i < stadionrunde.getVertexCount(); i++) meters+= stadionrunde.getVertex(i).distanceFrom(stadionrunde.getVertex(i-1));
		
		document.getElementById("desc").firstChild.data="Verlauf der 5km Strecke";
		if (showCalculatedLength) document.getElementById("desc").firstChild.data+=" ("+(meters/1000).toFixed(1)+" km)";
	  }
	}

	function einzeichnen_13km() {
      if (GBrowserIsCompatible()) {
		karte_leeren_();
		mymap.setZoom(14);
		mymap.panTo(new GLatLng(51.38438096727871,9.945287704467773));
		mymap.addOverlay(startZiel);
		mymap.addOverlay(strecke13km_1);
		mymap.addOverlay(strecke13km_2);
		mymap.addOverlay(strecke13km_3);

		var meters = 0.0;
        for (var i=1; i < strecke13km_1.getVertexCount(); i++) meters+= strecke13km_1.getVertex(i).distanceFrom(strecke13km_1.getVertex(i-1));
		for (var i=1; i < strecke13km_2.getVertexCount(); i++) meters+= strecke13km_2.getVertex(i).distanceFrom(strecke13km_2.getVertex(i-1));
        meters*=2;
		for (var i=1; i < strecke13km_3.getVertexCount(); i++) meters+= strecke13km_3.getVertex(i).distanceFrom(strecke13km_3.getVertex(i-1));

		document.getElementById("desc").firstChild.data="Verlauf der 13km Strecke";
		if (showCalculatedLength) document.getElementById("desc").firstChild.data+=" ("+(meters/1000).toFixed(1)+" km)";
	  }
	}

	function einzeichnen_Sportplatz() {
      if (GBrowserIsCompatible()) {
		karte_leeren_();
		mymap.setZoom(15);
		mymap.panTo(new GLatLng(51.37960588867736,9.971230030059814));
		mymap.addOverlay(sportplatz);

		document.getElementById("desc").firstChild.data="Lage des Sportplatzes";
	  }
	}

