var map = null;
      var geocoder = null;
      var directions;

      var iconDefault = new GIcon();
      iconDefault.image = 'images/mailprofs-marker.png';
//      iconDefault.shadow = 'http://www.google.com/mapfiles/shadow50.png';
//      iconDefault.iconSize = new GSize(14, 22);
      iconDefault.iconSize = new GSize(25, 29);
//      iconDefault.shadowSize = new GSize(22, 20);
      iconDefault.iconAnchor = new GPoint(6, 20);
      iconDefault.infoWindowAnchor = new GPoint(5, 1);

      var customIcons = [];
      customIcons["Nederland"] = "images/mp-nl/";
      customIcons["Belgie"] = "images/mp-be/";

  	  var markerGroups = { "Nederland": [], "Belgie": []};

      /* Utrecht, Mailprofs HK: 52.025638, 4.274327 */
      var centerLocationLat = 52.091262;
      var centerLocationLng = 5.122748;
      var centerZoom = 7;

      function initialize() {
        map = new GMap2(document.getElementById("map_canvas"));

        var directionsPanel = document.getElementById("route");
        directions = new GDirections(map, directionsPanel);
        GEvent.addListener(directions, "load", onGDirectionsLoad);
        GEvent.addListener(directions, "error", handleErrors);

      map.removeMapType(G_SATELLITE_MAP);
      map.removeMapType(G_HYBRID_MAP);
//		  map.addMapType(G_PHYSICAL_MAP);
//  		map.addMapType(G_SATELLITE_3D_MAP);
        var mapControl = new GMapTypeControl();
        map.addControl(mapControl);
        map.addControl(new GLargeMapControl());

        map.setCenter(new GLatLng(centerLocationLat,centerLocationLng), centerZoom);

        var geocoder = new GClientGeocoder();

//        Use this one if your XML file contains attributes, otherwise use the nested one for the nested tags
//        GDownloadUrl("data/vestigingen.xml", function(data) {
//        GDownloadUrl("data/contact_nested.xml", function(data) {
        GDownloadUrl("/admin/contact/contact.xml", function(data) {
          var xml = GXml.parse(data);
          var branch = xml.documentElement.getElementsByTagName("contact-information-component");
          var total_items = branch.length;

          document.getElementById("list").innerHTML = "<h1><a href='#' onclick='javascript:displayInfo(0, " + total_items + ");returnToOriginal();' title='Toon overzichtskaart'>Vestigingsoverzicht</a></h1><br/>";

          for (var i = 0; i < branch.length; i++)
          {
            id = branch[i].getElementsByTagName("nummer")[0].firstChild.nodeValue;
            name = branch[i].getElementsByTagName("naam")[0].firstChild.nodeValue;
            street = branch[i].getElementsByTagName("adres")[0].firstChild.nodeValue;
            postcode = branch[i].getElementsByTagName("postcode")[0].firstChild.nodeValue;
            city = branch[i].getElementsByTagName("plaats")[0].firstChild.nodeValue;
            country = branch[i].getElementsByTagName("land")[0].firstChild.nodeValue;
            address = street + ", " + postcode + ", " + city + ", " + country;
            phone = branch[i].getElementsByTagName("telefoon")[0].firstChild.nodeValue;
            fax = branch[i].getElementsByTagName("fax")[0].firstChild.nodeValue;
//            email = "do@do.nl";
            lat = branch[i].getElementsByTagName("lat")[0].firstChild.nodeValue;
            lng = branch[i].getElementsByTagName("lng")[0].firstChild.nodeValue;
            email = branch[i].getElementsByTagName("emailadres")[0].firstChild.nodeValue;
            counter = i + 1;

/*
//          Use these if you have chosen to use attributes instead of nested tags
            id = branch[i].getAttribute("id");
            name = branch[i].getAttribute("name");
            street = branch[i].getAttribute("street");
            postcode = branch[i].getAttribute("postcode");
            city = branch[i].getAttribute("city");
            country = branch[i].getAttribute("country");
            address = street + ", " + postcode + ", " + city + ", " + country;
            phone = branch[i].getAttribute("phone");
            fax = branch[i].getAttribute("fax");
            lat = branch[i].getAttribute("lat");
            lng = branch[i].getAttribute("lng");
            counter = i + 1;
*/


            infoHtml = street + "<br/>" + postcode + "&nbsp;" + city + "<br/>telefoon " + phone + "<br/>fax " + fax + "<br/>email " + "<a href='mailto:" + email + "' title='Stuur een mailbericht aan deze vestiging'>" + email + "</a><br/><a href='#' onclick='displayRoute(" + lat + ", " + lng + ");' class='googleRoute' title='Plan route naar " + name + "'>Plan route</a> | <a href='#' onclick='javascript:displayInfo(0, " + total_items + ");returnToOriginal();' title='Toon overzichtskaart'>Overzicht</a> | <a href='#' onclick='window.print();' title='Print kaart'>Print</a>";


            var marker = createMarker(new GLatLng(lat, lng), id, country, name, address, infoHtml, counter);
            map.addOverlay(marker);
          }

          function createMarker(latlong, index, country, name, address, html, counter){
            var numberedIcon = new GIcon(iconDefault);
            numberedIcon.image = customIcons[country] + "marker" + index + ".png";
            markerOptions = { icon: numberedIcon };

            var marker = new GMarker(latlong, markerOptions);
            markerGroups[country].push(marker);

            iconHTML = "<img src='" + numberedIcon.image + "' alt='" + name + "' class='iconList'/>";
            linkHTML = "<a href='#' id='title" + counter + "' onclick='activateMarker(" + (markerGroups[country].length - 1) + ", \"" + country + "\");displayInfo(" + counter + "," + total_items + ");' class='googleList' title='" + name + "'><b>" + name + "</b></a><br/>";
            divHTML = "<div id='info" + counter + "' style='display:none' class='info'>" + html + "<br/><br/></div>";

            document.getElementById("list").innerHTML += iconHTML + linkHTML + divHTML;

            GEvent.addListener(marker, "click", function() {
              marker.openInfoWindowHtml("<h3>" + name + "</h3>" + html);
              map.setCenter(latlong, 15);
              document.getElementById("route_container").style.visibility = "hidden";
              document.forms[0].naar.value = address;
              directions.clear();
              displayInfo(counter, total_items);
              GEvent.clearListeners(marker, "mouseout");
            });
            GEvent.addListener(marker, "mouseover", function() {
              displayInfo(0, total_items);
              displayInfo(counter, total_items);
            });
            GEvent.addListener(marker, "mouseout", function() {
              displayInfo(0, total_items);
            });
            return marker;
          }
        });
      }


      function returnToOriginal() {
        directions.clear();
        map.disableInfoWindow();
        map.setCenter(new GLatLng(centerLocationLat,centerLocationLng), centerZoom);
        map.enableInfoWindow();
        document.getElementById("route_container").style.visibility = "hidden";
      }


      function activateMarker(index, country) {
        GEvent.trigger(markerGroups[country][index], "click");
      }


      function displayInfo(index, total_items) {
        for (i = 1; i <= total_items; i++) {
          element = "info" + i;
          element1 = "title" + i;
          var listInfo = document.getElementById(element);
          var listTitle = document.getElementById(element1);
          if (i == index) {
            if(listInfo.style.display == "none") {
              listInfo.style.display = "block";
              document.getElementById("detail_canvas").innerHTML = "<h3>" + listTitle.innerHTML + "</h3>" + listInfo.innerHTML;
            }
          }
          else {
            listInfo.style.display = "none";
          }
        }
      }


      function clearData() {
        directions.clear();
        document.getElementById("route").style.display = "none";
      }


      function displayRoute(lat, lng) {
        document.getElementById("route_container").style.visibility = "visible";
        clearData();
        document.forms[0].naar.disabled = true;
        document.forms[0].van.focus();
        document.forms[0].latlong.value = lat + ", " + lng;
      }


      function setDirections(from_string, to_string, to_latlng) {
        if (from_string.length > 0)
        {
          document.getElementById("route").style.display = "block";
          directions.load("from: " + from_string + " to: " + to_latlng);
          document.getElementById("van_tot").innerHTML = "<br/><br/><b>Routebeschrijving</b><br/><br/>Van : " + from_string + "<br/>Naar: " + to_string + "<br/><br/>";
        }
        else {
          alert("Geen geldig adres opgegeven.");
          document.forms[0].van.focus();
        }
      }


      function handleErrors(){
        if (directions.getStatus().code == G_GEO_UNKNOWN_ADDRESS) {
    		  setDirections(document.forms[0].van.value, document.forms[0].latlong.value);}
//          alert("Er is geen overeenkomstige geografische locatie gevonden voor het opgegeven adres. Mogelijke oorzaak is dat dit adres te nieuw is of dat het incorrect is.\nError code: " + directions.getStatus().code);
        /*else if (directions.getStatus().code == G_GEO_SERVER_ERROR)
          alert("A geocoding or directions request could not be successfully processed, yet the exact reason for the failure is not known.\n Error code: " + directions.getStatus().code);
        else if (directions.getStatus().code == G_GEO_MISSING_QUERY)
          alert("The HTTP q parameter was either missing or had no value. For geocoder requests, this means that an empty address was specified as input. For directions requests, this means that no query was specified in the input.\n Error code: " + directions.getStatus().code);
        //   else if (directions.getStatus().code == G_UNAVAILABLE_ADDRESS)  <--- Doc bug... this is either not defined, or Doc is wrong
        //     alert("The geocode for the given address or the route for the given directions query cannot be returned due to legal or contractual reasons.\n Error code: " + directions.getStatus().code);
        else if (directions.getStatus().code == G_GEO_BAD_KEY)
          alert("The given key is either invalid or does not match the domain for which it was given. \n Error code: " + directions.getStatus().code);
        else if (directions.getStatus().code == G_GEO_BAD_REQUEST)
          alert("A directions request could not be successfully parsed.\n Error code: " + directions.getStatus().code);*/
        else alert("Een onbekende fout is opgetreden.\nError code: " + directions.getStatus().code);
      }


      function onGDirectionsLoad(){ 
        // Use this function to access information about the latest load()
        // results.

        // e.g.
        // document.getElementById("getStatus").innerHTML = gdir.getStatus().code;
      // and yada yada yada...
      }