﻿//<![CDATA[
// Foutmeldingen van GDirection netjes afvangen
    
      function handleErrors(){
	   if (gdir.getStatus().code == G_GEO_UNKNOWN_ADDRESS)
	     alert("Uw ingevoerde adres kan niet worden verwerkt, probeert u het alstublieft nog eens. U kunt simpelweg uw straat en woonplaats invoeren, bijvoorbeeld: Hoofdstraat, Utrecht. U kunt ook een route plannen naar een filiaal door enkel uw plaatsnaam in te voeren.");
	   else if (gdir.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: " + gdir.getStatus().code);
	   
	   else if (gdir.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: " + gdir.getStatus().code);

	   else if (gdir.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: " + gdir.getStatus().code);

	   else if (gdir.getStatus().code == G_GEO_BAD_REQUEST)
	     alert("A directions request could not be successfully parsed.\n Error code: " + gdir.getStatus().code);
	    
	   else alert("An unknown error occurred.");
	   
	}
    
    // onderdelen benoemen
    var map;
    var geocoder;  
    var directionsPanel;
    var directions;
    var PlaceInserted;
    var place;
    var AddressMarker
    
    // ** Tekstuele zoom knoppen **
    // Zoom in button toevoegen
    function TextualZoomInControl() {
    }
    TextualZoomInControl.prototype = new GControl();
    TextualZoomInControl.prototype.initialize = function(map) {  
    var container = document.createElement("div");  
    var zoomInDiv = document.createElement("div");  
    this.setButtonStyle_(zoomInDiv);  
    container.appendChild(zoomInDiv);  
    zoomInDiv.appendChild(document.createTextNode("Zoom in"));  
    GEvent.addDomListener(zoomInDiv, "click", function() {    
    map.zoomIn();  });  
    map.getContainer().appendChild(container);  
    return container;}
    
    TextualZoomInControl.prototype.getDefaultPosition = function() {  
    return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(10, 10));}
    
    TextualZoomInControl.prototype.setButtonStyle_ = function(button) {
      button.className = "gmaps_zoombutton";
    }
    
    // Zoom out button toevoegen
    function TextualZoomOutControl() {
    }
    TextualZoomOutControl.prototype = new GControl();
    TextualZoomOutControl.prototype.initialize = function(map) {  
    var container = document.createElement("div");  
    var zoomOutDiv = document.createElement("div");  
    this.setButtonStyle_(zoomOutDiv);  
    container.appendChild(zoomOutDiv);  
    zoomOutDiv.appendChild(document.createTextNode("Zoom out"));  
    GEvent.addDomListener(zoomOutDiv, "click", function() {    
    map.zoomOut();
    });  
    map.getContainer().appendChild(container);  
    return container;}
    
    TextualZoomOutControl.prototype.getDefaultPosition = function() {  
    return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(80, 10));}
    
    TextualZoomOutControl.prototype.setButtonStyle_ = function(button) {
    button.className = "gmaps_zoombutton";
    }
    // Einde zoombuttons   

    // ** Textuele kaartkeuze knoppen **
    // Type kaart
    function TextualMapTypeKaartControl() {
    }
    TextualMapTypeKaartControl.prototype = new GControl();
    TextualMapTypeKaartControl.prototype.initialize = function(map) {  

    var TypeContainer = document.createElement("div");  
    var MapTypeKaartDiv = document.createElement("div");  
    this.setButtonStyle_(MapTypeKaartDiv);  
    TypeContainer.appendChild(MapTypeKaartDiv);  
    MapTypeKaartDiv.appendChild(document.createTextNode("Kaart"));  
    GEvent.addDomListener(MapTypeKaartDiv, "click", function() {    
    map.setMapType(G_NORMAL_MAP);  });  

    map.getContainer().appendChild(TypeContainer);  
    return TypeContainer;} 
    
    TextualMapTypeKaartControl.prototype.getDefaultPosition = function() {  
    return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(128, 10));}
    
    TextualMapTypeKaartControl.prototype.setButtonStyle_ = function(button) {
    button.className = "gmaps_maptypebutton_small";
    }
    
    // Type satelliet
    function TextualMapTypeSatellietControl() {
    }
    TextualMapTypeSatellietControl.prototype = new GControl();
    TextualMapTypeSatellietControl.prototype.initialize = function(map) {  
   
    var TypeContainer = document.createElement("div");  
    var MapTypeSatellietDiv = document.createElement("div");  
    this.setButtonStyle_(MapTypeSatellietDiv);  
    TypeContainer.appendChild(MapTypeSatellietDiv);  
    MapTypeSatellietDiv.appendChild(document.createTextNode("Satelliet"));  
    GEvent.addDomListener(MapTypeSatellietDiv, "click", function() {    
    map.setMapType(G_SATELLITE_MAP); });  
    
    map.getContainer().appendChild(TypeContainer);  
    return TypeContainer;}
    
    TextualMapTypeSatellietControl.prototype.getDefaultPosition = function() {  
    return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(58, 10));}
        
    TextualMapTypeSatellietControl.prototype.setButtonStyle_ = function(button) {
    button.className = "gmaps_maptypebutton_large";
    }
    
    // Type kaart/satelliet
    function TextualMapTypeBothControl() {
    }
    TextualMapTypeBothControl.prototype = new GControl();
    TextualMapTypeBothControl.prototype.initialize = function(map) {  
   
    var TypeContainer = document.createElement("div");  
    var MapTypeSatellietDiv = document.createElement("div");  
    this.setButtonStyle_(MapTypeSatellietDiv);  
    TypeContainer.appendChild(MapTypeSatellietDiv);  
    MapTypeSatellietDiv.appendChild(document.createTextNode("Beide"));  
    GEvent.addDomListener(MapTypeSatellietDiv, "click", function() {    
    map.setMapType(G_HYBRID_MAP); });  
    
    map.getContainer().appendChild(TypeContainer);  
    return TypeContainer;}
    
    TextualMapTypeBothControl.prototype.getDefaultPosition = function() {  
    return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(5, 10));}
    
    TextualMapTypeBothControl.prototype.setButtonStyle_ = function(button) {
    button.className = "gmaps_maptypebutton_small";
    }
    // Einde kaartkeuze knoppen
    
    // Functie voor weergave markers in FireFox 
    function getMarkerNode(xmlMarker,strSearchTag)
    {
        var sResult;
        sResult = 'nog niks';
        
        if (navigator.appName!="Netscape")  // Geen FireFox
        {
            sResult = xmlMarker.getElementsByTagName(strSearchTag)(0).text;        
        }        
        else
        {
            var strTagName;
            var iCount;
            strTagName = '';
            iCount = 0;
            while ((strTagName != strSearchTag) & (iCount < xmlMarker.childNodes.length))
            {                
                iCount++;
                strTagName = xmlMarker.childNodes[iCount].nodeName;
            }
            if (strTagName == strSearchTag)
            {
               try
               {
                    sResult = xmlMarker.childNodes[iCount].childNodes[0].textContent;
               }
               catch (err)
               {
                    sResult = "";
               }
            }
        }
        return sResult;        
    }
    
    
// Start laden Map
    function StartMap() {
    if (GBrowserIsCompatible()) {
        
        // ==== Make the map types semi transparent ===
        G_NORMAL_MAP.getTileLayers()[0].getOpacity = function () {return 0.9;};
        G_SATELLITE_MAP.getTileLayers()[0].getOpacity = function () {return 0.9;};
        G_HYBRID_MAP.getTileLayers()[0].getOpacity = function () {return 0.9;};
        G_HYBRID_MAP.getTileLayers()[1].getOpacity = function () {return 0.9;};

        map = new GMap2(document.getElementById("map"));
        map.setCenter(new GLatLng(52.183, 5.233), 7); // Beginpunt instellen
        map.addControl(new TextualZoomInControl());             // Zoom in button toevoegen
        map.addControl(new TextualZoomOutControl());             // Zoom out button toevoegen
        map.addControl(new GScaleControl());
        //map.addControl(new GLargeMapControl());
        //map.addControl(new GMapTypeControl());
        map.addControl(new TextualMapTypeSatellietControl());   // Keuze voor satelliet
        map.addControl(new TextualMapTypeKaartControl());       // Keuze voor kaart
        map.addControl(new TextualMapTypeBothControl());        // Keuze voor combinatie kaart/satteliet
        map.setMapType(G_NORMAL_MAP);                           // Kaart weergave G_NORMAL_MAP, G_SATELLITE_MAP, G_HYBRID_MAP
        geocoder = new GClientGeocoder();
                              
        // ==== THEN set the background colour of the map div ===
        document.getElementById("map").style.backgroundColor="#FFFFFF"; //Achtergrond kleur

        gdir = new GDirections(map, document.getElementById("directions"));
        GEvent.addListener(gdir, "error", handleErrors);
                       
        // Een eigen icoontje toevoegen 
        icon = new GIcon();
        //pad naar afbeelding volledig opgeven
        icon.image = "files/System/images/marker_overvecht.png"; // De URL van de afbeelding die je wilt
        //gebruiken
       
        icon.iconSize = new GSize(25, 35); // De grootte van het icoontje
        icon.iconAnchor = new GPoint(8, 50); // Anker van het icoontje, dus de plek op de afbeelding die precies op het coördinaat moet staan
        icon.infoWindowAnchor = new GPoint(5, 1); // De plek tov het icoontje waar infoballonnetjes moeten verschijnen
        
        // Transparante Icon voor zoekopdracht
        icon2 = new GIcon();
        icon2.image = "files/System/images/none.gif"; // De URL van de afbeelding die je wilt gebruiken
        icon2.iconSize = new GSize(1, 1); // De grootte van het icoontje
        icon2.iconAnchor = new GPoint(8, 30); // Anker van het icoontje, dus de plek op de afbeelding die precies op het coördinaat moet staan
        icon2.infoWindowAnchor = new GPoint(5, 1); // De plek tov het icoontje waar infoballonnetjes moeten verschijnen

        var koopzondag = ''
        if (window.location.href.indexOf('Koopzondag=') > 0) {
            var vars = [], hash;
            var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
            for (var i = 0; i < hashes.length; i++) {
                hash = hashes[i].split('=');
                vars.push(hash[0]);
                vars[hash[0]] = hash[1];
                koopzondag = hash[1];
            }
        }
        GDownloadUrl("Filialen_xml.ashx?koopzondag=" + koopzondag, function(data, responseCode) { 
            var xml = GXml.parse(data);
            var company
            var adres
            var huisnummer
            var postcode
            var plaats
            var telefoon
            var url
            var markers = xml.documentElement.getElementsByTagName("Filiaal"); 
                for (var i = 0; i < markers.length; i++) {  
                    var point = new GLatLng(parseFloat(getMarkerNode(markers[i],'x')), parseFloat(getMarkerNode(markers[i],'y')));
                    company = getMarkerNode(markers[i], 'dealer');
                    adres = getMarkerNode(markers[i], 'straat');
                    huisnummer = getMarkerNode(markers[i], 'huisnummer');
                    plaats = getMarkerNode(markers[i], 'plaats');
                    url = 'Filialen.aspx?Filiaal=' + getMarkerNode(markers[i], 'id');     
                    map.addOverlay(createMarker(point, i + 1, company, adres, huisnummer, plaats, url));
                }
        });


		// Info popup aan marker koppelen
        function createMarker(point, number, company, adres, huisnummer, plaats, url) {
            var markerOpts = {};
            markerOpts.title = company + ', ' + adres + ' ' + huisnummer + ', ' + plaats;
            markerOpts.icon = icon;

            var marker = new GMarker(point, markerOpts);
            GEvent.addListener(marker, "click", function() {
            window.location.href = url;
            }
            );
		    return marker;
        }

       
        function setDirections(fromAddress, toAddress, locale) {            
            gdir.load("from: " + fromAddress + " to: " + toAddress,
            { "locale": locale });
        }
            
        function onGDirectionsLoad(){ 
        }

    } // Einde Browsercompatible
} // Einde load

function ShowRouteFiliaal(fromAddress, toAddress, locale) {
    map.clearOverlays();
    gdir.load("from: " + fromAddress + " to: " + toAddress,
            { "locale": locale });
    document.getElementById("DivRoute").style.display = "block";

}

function ShowRouteFiliaalSmall(tbFrom, toAddress) {
    var validationGroupName = "PostcodeSmall";

    if (typeof (Page_ClientValidate) == 'function') {
       
        var validationResult = Page_ClientValidate(validationGroupName);
       
        if (validationResult == true) {
            var locale = 'nl_NL'
            map.clearOverlays();
             gdir.load("from: " + document.getElementById(tbFrom).value + " to: " + toAddress,
            { "locale": locale });
            document.getElementById("DivRoute").style.display = "block";
        }
    }
  
}

function ClearAddressMarker() {
    gdir.clear();
    document.getElementById("DivRoute").style.display = "none"
    map.setCenter(new GLatLng(52.183, 5.233), 7);
    StartMap()
}

    
function addAddressToMap(response) {
      if (!response || response.Status.code != 200) {
        alert("Uw ingevoerde postcode kan niet worden herkend, probeert u het alstublieft nog eens.");
      } else {
        map.closeInfoWindow();
        place = response.Placemark[0];
        point = new GLatLng(place.Point.coordinates[1],
                            place.Point.coordinates[0]);
        AddressMarker = new GMarker(point, icon2);
        map.addOverlay(AddressMarker);
        map.setCenter(new GLatLng(place.Point.coordinates[1], place.Point.coordinates[0]), 10);
        PlaceInserted = place.Point.coordinates[1], place.Point.coordinates[0];
      }
}

function showLocation() {
    var address = document.getElementById("tbZoeken").value;
    if (address == document.getElementById("tbZoeken").defaultValue) {
      alert("Voer eerst een plaatsnaam in.");
  } else {
      //Viewport instellen met inhoud van kaart, zodat bij voorkeur plaatsen daarbinnen worden gevonden

  GDownloadUrl("GetFiliaalInfo.ashx?adres=" + address, function(data, responseCode) {
      var sOutput = ''
      var xml = GXml.parse(data);
      var markers = xml.documentElement.getElementsByTagName("Filiaal");
      for (var i = 0; i < markers.length; i++) {
          company = getMarkerNode(markers[i], 'dealer');
          afstand = getMarkerNode(markers[i], 'afstand');
          adres = getMarkerNode(markers[i], 'straat');
          huisnummer = getMarkerNode(markers[i], 'huisnummer');
          plaats = getMarkerNode(markers[i], 'plaats');
          telefoonnummer = getMarkerNode(markers[i], 'telefoonnummer');
          bijzonderheden = getMarkerNode(markers[i], 'bijzonderheden');
          filiaaladres = adres + ' ' + huisnummer + ' ' + plaats
          locale = 'NL'
          if (i == 0) { //Eerste filiaal uitgebreid tonen
              geocoder.setViewport(map.getBounds());
              geocoder.getLocations(filiaaladres, addAddressToMap);
              sOutput = "<h3>Uw dichtstbijzijnde Overvecht filiaal:</h3><b>" + company + "</b><br />" + adres + " " + huisnummer + "<br />" + plaats + "<br /><br />Tel: " + telefoonnummer + "<br /><br /><b>Bijzonderheden:</b><br/>" + bijzonderheden;
          }
          else {
              if (i == 1) {
                  sOutput += "<hr /><h3>Overige filialen dichtbij</h3>"
              }
              sOutput += plaats + ", " + adres + " " + huisnummer + " Meer info<br />";
          }

          document.getElementById("FiliaalOutput").innerHTML = sOutput
      }

  });
    }
}
  
    //]]> 

//Invoervak woonplaats voorzien van hint. Hint verdwijnt automatisch bij focus.
//Ingevulde waarde behouden als focus weggaat, anders hint weer neerzetten.
function geefFocus(bron)
{
    var i = document.getElementById(bron);
    if (i.defaultValue == i.value)
    {
        i.className = "gmaps_textbox";
        i.defaultValue = i.value;
        i.value = "";
    }
}

//Invoervak tbVan voor route lijkt in IE7 geen defaultValue te hebben, daarom aparte functie waarbij defaultwaarde wordt meegegeven
function geefFocus2(bron, defaultWaarde)
{
    var i = document.getElementById(bron);
    if (defaultWaarde == i.value)
    {
        i.className = "gmaps_textbox";
        i.defaultValue = i.value;
        i.value = "";
    }
}

function verlaatFocus(bron)
{
    var i = document.getElementById(bron);
    if (i.value == "")
    {
        i.className = "gmaps_textboxhint";
        i.value = i.defaultValue;
    }
}



function checkform() {
    var postcode = document.getElementById("tbZoeken").value
    var postcode_filter = /^[0-9]{4}[a-z|A-Z]{2}$/

    if (postcode.length <= 0) {
        alert('Geef uw postcode op');
        document.getElementById("tbZoeken").focus();
        return false;
    } else {
        if (postcode.indexOf(' ') > 0) {
            postcode = postcode.split(' ').join('')
        }
    }

    if (!postcode_filter.test(postcode)) {
        alert('Geef een correcte postcode op (1122 AB)');
        document.getElementById("tbZoeken").focus();
        return false
    }


    showLocation();
}
	
