var map;
    var geocoder;
	var infoWindow;	
	var markers = [];
	
function load() {
    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(9.0116, 38.7593);
    var myOptions = {
      zoom: 7,
	  maxZoom: 16,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.HYBRID
    }
    map = new google.maps.Map(document.getElementById("map"), myOptions);
	infoWindow = new google.maps.InfoWindow();
	locationSelect = document.getElementById("infowindow");
      locationSelect.onchange = function() {
        var markerNum = locationSelect.options[locationSelect.selectedIndex].value;
        if (markerNum != "none"){
          google.maps.event.trigger(markers[markerNum], 'click');
        }
      };
	searchNames("alles");
}
  
function searchLocations() {
     var address = document.getElementById('addressInput').value;
	var geocoder = new google.maps.Geocoder();
  geocoder.geocode({address: address}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      searchLocationsNear(results[0].geometry.location);
    } else {
      alert(address + ' not found');
    }
  });
  
   }
   
function searchLocationsNear(center) {
  clearLocations();

//  var radius = document.getElementById('radius').value;
	if(center!=null) 
		{
		var searchUrl = 'beheer/createxml.php?cat=' + center ;
		}
	else
     	{var searchUrl = 'beheer/createxml.php' ;}
//  var searchUrl = 'database_bm/createxml.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius;
  downloadUrl(searchUrl, function(data) {
  var xml = parseXml(data);
  var markerNodes = xml.documentElement.getElementsByTagName("marker");
  var bounds = new google.maps.LatLngBounds();
  for (var i = 0; i < markerNodes.length; i++) {
         var org 			= markerNodes[i].getAttribute('organisatie');
         var proj_id 		= markerNodes[i].getAttribute('proj_id');
         var proj_naam 		= markerNodes[i].getAttribute('proj_naam');
         var plaats 		= markerNodes[i].getAttribute('plaats');
         var zone	 		= markerNodes[i].getAttribute('zone');
         var classificatie 	= markerNodes[i].getAttribute('classificatie');
         var classificatie2 = markerNodes[i].getAttribute('classificatie2');
         var classificatie3 = markerNodes[i].getAttribute('classificatie3');
         var doel	 		= markerNodes[i].getAttribute('doel');
         var website	 	= markerNodes[i].getAttribute('website');
         var afdruk	 		= markerNodes[i].getAttribute('afdruk');
   var latlng = new google.maps.LatLng(
        parseFloat(markerNodes[i].getAttribute("lat")),
        parseFloat(markerNodes[i].getAttribute("lng")));
         
    createOption(proj_naam,  i);
    createMarker(latlng, org, proj_naam, plaats, zone , classificatie, classificatie2, classificatie3, doel, website, proj_id, afdruk);
    bounds.extend(latlng);
  }
  map.fitBounds(bounds);
 });
}   

function searchNames(n)
{
	console.log("categorie " + n);
	clearLocations();
 	var searchUrl = 'beheer/createxml.php?cat=' + n;
	downloadUrl(searchUrl, function(data) {
	var xml = parseXml(data);
	var markerNodes = xml.documentElement.getElementsByTagName("marker");
	var bounds = new google.maps.LatLngBounds();
   for (var i = 0; i < markerNodes.length; i++) {
         var org 			= markerNodes[i].getAttribute('organisatie');
         var proj_id 		= markerNodes[i].getAttribute('proj_id');
         var proj_naam 		= markerNodes[i].getAttribute('proj_naam');
         var plaats 		= markerNodes[i].getAttribute('plaats');
         var zone	 		= markerNodes[i].getAttribute('zone');
         var classificatie 	= markerNodes[i].getAttribute('classificatie');
         var classificatie2 = markerNodes[i].getAttribute('classificatie2');
         var classificatie3 = markerNodes[i].getAttribute('classificatie3');
         var doel		 	= markerNodes[i].getAttribute('doel');
         var website	 	= markerNodes[i].getAttribute('website');
         var afdruk	 		= markerNodes[i].getAttribute('afdruk');
	 	var latlng = new google.maps.LatLng(
		parseFloat(markerNodes[i].getAttribute("lat")),
		parseFloat(markerNodes[i].getAttribute("lng")));
	
	createOption(plaats,  i);
    createMarker(latlng, org, proj_naam, plaats, zone , classificatie, classificatie2, classificatie3, doel, website, proj_id, afdruk);
	bounds.extend(latlng);
   }
  map.fitBounds(bounds);
 });
}

function createMarker(latlng, org, proj_naam, plaats, zone , classificatie, classificatie2, classificatie3, doel, website, proj_id, afdruk) {
	var icon;
    if(classificatie.indexOf("honger")>0)
	{
		icon = "mdg1.png";
	}
    else if(classificatie.indexOf("Onderwijs")>-1)
	{
		icon = "mdg2.png";
	}
    else if(classificatie.indexOf("gelijkwaardig")>-1)
	{
		icon = "mdg3.png";
	}
    else if(classificatie.indexOf("Kinder gezondheid")>-1)
	{
		icon = "mdg4.png";
	}
    else if(classificatie.indexOf("moeders")>-1)
	{
		icon = "mdg5.png";
	}
    else if(classificatie.indexOf("AIDS")>-1)
	{
		icon = "mdg6.png";
	}
    else if(classificatie.indexOf("milieu")>-1)
	{
		icon = "mdg7.png";
	}
    else if(classificatie.indexOf("samenwerking")>-1)
	{
		icon = "mdg8.png";
	}
    else if(classificatie.indexOf("industrie")>-1)
	{
		icon = "mdg9.png";
	}
    else if(classificatie.indexOf("Cultuur")>-1)
	{
		icon = "mdg10.png";
	}
	else
	{
		icon = "icon_oranje.png";
	}
	var image = new google.maps.MarkerImage('img/' + icon,
      // This marker is 20 pixels wide by 32 pixels tall.
      new google.maps.Size(30, 44),
      // The origin for this image is 0,0.
      new google.maps.Point(0,0),
      // The anchor for this image is the base of the flagpole at 0,32.
      new google.maps.Point(15, 24)
	  );
		afdruk	=	"<a href='"+ afdruk +"' target='_blank'>project info</a>";	
	   var html = '<table><tr><th>Project eigenaar:</th><td>' + org + '</td><td>&nbsp;</td></tr>';
	   html		+= '<tr><th>Plaats:</th><td>' + plaats + ' ('+ zone + ')</td><td>&nbsp;</td></tr>';
	   html		+= '<tr><th>Doel:</th><td colspan="2">' + doel + '</td></tr>';
	   html		+= '<tr><th>Categorie(n):</th><td>' + classificatie + '<td>'+ classificatie2 + '</td></td></tr>';
//	   html		+= '<tr><th>Categorie 2:</th><td>' + classificatie2 + '</td></tr>';
	   html		+= '<tr><th>Afdruk:</th><td>' + afdruk + '</td><td>&nbsp;</td></tr>';
	   html		+=	'</table>';
  		var marker = new google.maps.Marker({
   			map: map,
			icon: image,
    		position: latlng
 		 });
  	google.maps.event.addListener(marker, 'click', function() {
    infoWindow.setContent(html);
    infoWindow.open(map, marker);
  	});
  	markers.push(marker);
}

function createOption(name,  num) {
  var option = document.createElement("option");
  option.value = num;
  option.innerHTML = name ;
  locationSelect.appendChild(option);
}

function clearLocations() {
  infoWindow.close();
  for (var i = 0; i < markers.length; i++) {
    markers[i].setMap(null);
  }
  markers.length = 0;

  locationSelect.innerHTML = "";
  var option = document.createElement("option");
  option.value = "none";
  option.innerHTML = "Selecteer op categorie:";
  locationSelect.appendChild(option);
  locationSelect.style.visibility = "visible";
}

   function downloadUrl(url, callback) {
      var request = window.ActiveXObject ?
          new ActiveXObject('Microsoft.XMLHTTP') :
          new XMLHttpRequest;

      request.onreadystatechange = function() {
        if (request.readyState == 4) {
          request.onreadystatechange = doNothing;
          callback(request.responseText, request.status);
        }
      };

      request.open('GET', url, true);
      request.send(null);
    }

    function parseXml(str) {
      if (window.ActiveXObject) {
        var doc = new ActiveXObject('Microsoft.XMLDOM');
        doc.loadXML(str);
        return doc;
      } else if (window.DOMParser) {
        return (new DOMParser).parseFromString(str, 'text/xml');
      }
    }

    function doNothing() {}