function customPanel(map,mapname,gdir,div) {
        var html = "";

        function waypoint(point, type, address) {
		  var wegPunkt = "Ihr Startort: ";
		  if (type == "stop") {
		    html += '</table>';
		    wegPunkt = "Ihr Zielort: ";		    
		  }
          var target = '"' + mapname+".showMapBlowup(new GLatLng("+point.toUrlValue(6)+"))"  +'"';
		  html += '<div class="startziel">';
		  html += '	<h3 onclick='+target+' style="cursor: pointer;">'+wegPunkt+address+' &raquo;<span style="text-decoration: underline;">Karte hier zentrieren</span></h3>';
        }
        function routeDistance(dist,time) {
		  var entfernung = dist;
		  var mass = " m";
		  if (entfernung >= 1000) { var entfernung = Math.round(entfernung/10)/100; mass = " km";  }
		  html += '	<span>' + entfernung + mass + time + '</span>';
		  html += '</div>';
		  html += '<table class="anfahrtsRoute">';
        }

        function detail(point, num, description, dist) {
          var target = '"' + mapname+".showMapBlowup(new GLatLng("+point.toUrlValue(6)+"))"  +'"';
          
		  var entfernung = dist;
		  var mass = " m";
		  if (entfernung >= 1000) { var entfernung = Math.round(entfernung/10)/100; mass = " km";  }
		  html += '<tr onclick="'+target+'">';
	      html += '	<td class="anfahrtsRouteNummer">';
		  html += '			<a href="javascript:void(0)"> '+num+'. </a>';
		  html += '		</td>';
		  html += '		<td class="anfahrtsRouteBeschreibung">';
		  html +=        description;
		  html += '		</td>';
		  html += '		<td class="anfahrtsEntfernung">'
		  html +=        entfernung+mass;
		  html += '</td>';
		  html += '</tr>';
          
        }
        function copyright(text) {
          html += '<span>' + text + "</span>";
		  html += '</div>';
        }

        for (var i=0; i<gdir.getNumRoutes(); i++) {
          if (i==0) {
            var type="play";
          } else {
            var type="pause";
          }
          var route = gdir.getRoute(i);
          var geocode = route.getStartGeocode();
          var point = route.getStep(0).getLatLng();
          waypoint(point, type, geocode.address);
		  routeDistance(route.getDistance().meters," (ca. "+route.getDuration().html+")");
          for (var j=0; j<route.getNumSteps(); j++) {
            var step = route.getStep(j);
            detail(step.getLatLng(), j+1, step.getDescriptionHtml(), step.getDistance().meters);
          }
        }

        var geocode = route.getEndGeocode();
        var point = route.getEndLatLng();
        waypoint(point, "stop", geocode.address);

        copyright(gdir.getCopyrightsHtml());
		div.innerHTML = html;
      }

$(document).ready(function(){

if (GBrowserIsCompatible()) { 
      googlemap = new GMap(document.getElementById("gmap"));
	
		var praxis_pos = new GLatLng(49.636731,6.402283);
		googlemap.setCenter(praxis_pos, 12);
		googlemap.addControl(new GLargeMapControl());
		googlemap.addControl(new GMapTypeControl());
		googlemap.enableScrollWheelZoom();
		
      var bounds = new GLatLngBounds();
      
      // ====== Create a Client Geocoder ======
      var geo = new GClientGeocoder(new GGeocodeCache()); 

      // ====== Array for decoding the failure codes ======
      var reasons=[];
      reasons[G_GEO_SUCCESS]            = "erfolgreich";
      reasons[G_GEO_MISSING_ADDRESS]    = "Adresse fehlt: Entweder fehlt die Adresse oder hat keinen zugeordneten Wert";
      reasons[G_GEO_UNKNOWN_ADDRESS]    = "Unbekannte Addresse: Für die eingestellte Adresse konnte keine entsprechende geografische Lage gefunden werden";
      reasons[G_GEO_UNAVAILABLE_ADDRESS]= "Nicht verfügbare Adresse: Die geografische Lage für die angegebene Adresse kann aufgrund rechtlicher Probleme nicht dargestellt werden.";
      reasons[G_GEO_BAD_KEY]            = "Ungültiger Schlüssel: Der Google Maps API Schlüssel ist entweder ungültig, oder passt nicht mit der Website - Domain zusammen";
      reasons[G_GEO_TOO_MANY_QUERIES]   = "Zu viele Anfragen: Die tägliche Quote der Google Maps Anfragen wurden für diese Seite Überschritten";
      reasons[G_GEO_SERVER_ERROR]       = "Server Fehler: Die geografische Anfrage konnte leider nicht verarbeitet werden";
      reasons[G_GEO_BAD_REQUEST]        = "Die Routenfunktion konnte leider nicht erfogreich durchgeführt werden.";
      reasons[G_GEO_MISSING_QUERY]      = "Es wurde keine Anfrage in das Eingabefeld eingegeben.";
      reasons[G_GEO_UNKNOWN_DIRECTIONS] = "Die Routezwischen den 2 angegebenen Punkten konnte leider nicht erfogreich durchgeführt werden.";



	// ====== Geocoding ======
	showAddress = function () {

		if(zst > 0){
			var suche = document.getElementById("startpunkt").value;
			adressen[1] = suche;
			geo.getLatLng(suche, function (point){		
				if (point) {
					doEnd(point);
				}
				
				else {
					var result=geo.getCache().get(suche);
					if (result) {
						var reason="Code "+result.Status.code;
						if (reasons[result.Status.code]) {
							reason = reasons[result.Status.code]
						}
					} else {
						var reason = "";
					} 
					alert('Could not find "'+suche+ '" ' + reason);
				}
			});
		}
		}

      var baseIcon = new GIcon(G_DEFAULT_ICON);
      baseIcon.iconSize=new GSize(24,38);

      var icon1 = G_START_ICON;
      var icon2 = G_END_ICON;


      function createMarker(point,i,icon, popinfo) {
	  if(zst == 0){
		 var marker = new GMarker(point, icon);
	  }else{
        var marker = new GMarker(point, {draggable:true,icon:icon});
	  }
        gmarkers[i]=marker;
        GEvent.addListener(marker, "dragend", function() {
          pfad[i] = marker.getPoint();
          adressen[i] = "";
		  doEnd(pfad[i]);
        });
        googlemap.addOverlay(marker);
		if(popinfo){
			marker.openInfoWindowHtml(popinfo);
		}
		
		
		
      }
      
      
      // ===== Array to contain the points of the pfad =====
      var pfad = [];
      var gmarkers = [];
      var adressen = [];

      // ===== zst Driven Processing =====
      var zst = 0;

      /*GEvent.addListener(googlemap, "click", function(overlay,point) {
        if (point) {
          if (zst == 1) { doEnd(point) }
        }
      });
*/

      function showMarker(point, popinfo, zIcon) {
        createMarker(point,0,zIcon, popinfo);
        pfad[0] = point;
        zst = 1;
        
        
        
        
        
      }
      
      
      function doEnd(point) {
		if(zst==1){
        	createMarker(point,1,icon2);
			
		}else{
			gmarkers[1].setPoint(point)
		}
        pfad[1] = point;
        zst = 2;
        bounds.extend(pfad[0]);
        bounds.extend(pfad[1]);
        googlemap.setZoom(googlemap.getBoundsZoomLevel(bounds));
        googlemap.setCenter(bounds.getCenter());
		directions()
      }
      
         gdir =new GDirections(googlemap);
      GEvent.addListener(gdir,"error", function() {
        var code = gdir.getStatus().code;
        var reason="Code "+code;
        if (reasons[code]) {
          reason = "Code "+code +" : "+reasons[code]
        } 
        alert("Failed to obtain directions, "+reason);
      });

      var poly;
      GEvent.addListener(gdir, "load", function() {
        if (poly) googlemap.removeOverlay(poly);
        poly = gdir.getPolyline();
        googlemap.addOverlay(poly);
      });
        

      function directions() {
        if (adressen[0]) {var a = adressen[0] + "@" + pfad[0].toUrlValue(6)}
          else {var a = pfad[0].toUrlValue(6)} 
        if (adressen[1]) {var b = adressen[1] + "@" + pfad[1].toUrlValue(6)}
          else {var b = pfad[1].toUrlValue(6)} 
        var a = "from: "+b + " to: " + a;
        gdir.load(a, {getSteps:true});
      }
	  

	  var skycomIcon = new GIcon();
	  skycomIcon.image = "fileadmin/images/layout/GMarkerSkycom.gif";
	  skycomIcon.iconSize = new GSize(35, 46);
	  skycomIcon.iconAnchor = new GPoint(15,46);
      skycomIcon.infoWindowAnchor = new GPoint(19, 0);
	  
	  var markerContent = '<div id="markerContent"><p><strong>SkyCom Telematics Systems</strong><br />45 A, RUE DES ROMAINS, L-5433 NIEDERDONVEN</p></div>';
	  
	  markerContent += '<div id="route">';
      markerContent += '  <span>Startort eingeben:</span><br/>';
	  markerContent += '  <input id="startpunkt" type="text" name="startpunkt"/>';
	  markerContent += '  <div class="anfahrtsbutton">';
	  markerContent += '    <span id="anfahrt">Anfahrtsweg planen</span>';
	  markerContent += '  </div>';
      markerContent += '</div>';
   
	  
	  
	  
	  showMarker(praxis_pos, markerContent, skycomIcon)
	  
	  $('#anfahrt').live("click", function(event) {
		  if ($("#startpunkt").val() == '')
		  {
		  	alert("Bitte zuerst einen Startort eingeben!");	
		  } else{
		    showAddress();
		  }
		})
		
	  $('#startpunkt').live("keyup", function(event) {
		
		 if(event.keyCode==13){
                // Enter pressed... do anything here...
        			  if ($("#startpunkt").val() == '')
			  {
			  	alert("Bitte zuerst einen Startort eingeben!");	
			  } else{
			    showAddress();
			  }
			  
		  }
		})
		
		
	   
    }
    
    // display a warning if the browser was not compatible
    else {
      alert("Mit Ihrem aktuellen Browser funktioniert Googlemaps leider nicht.");
    };
    
    
    GEvent.addListener(gdir,"load", function() {
	$('#anfahrtsweg').html("");
	
	setTimeout('customPanel(googlemap,"googlemap",gdir,document.getElementById("anfahrtsweg"))', 1);
	//setTimeout('customPanel(map,"map",dirn,document.getElementById("contentR_route1"))', 1);
	});    
});