// met dank aan: http://www.econym.demon.co.uk/googlemaps/
var geocoder;
var map;
var j = 0;
var gmarkers = [];
var htmls = [];
var side_bar_html = "";

// deze functie bouwt een 2 dimensionele tabel op met coordinaten
function coords(coord1, coord2, icon, side, link, titel, naam, adres) {
	this.coord1 = coord1;
	this.coord2 = coord2;
	this.icon   = icon;
	this.side   = side; // moet dit in het overzicht onderaan getoond worden
	this.link   = link; // moet hier een link voor gemaakt worden
	this.titel  = titel;
	this.naam   = naam;
	this.adres  = adres;
}
var listLL = new Array();
	listLL[0] = new coords(4.107160, 51.217591, "bol", "y", "y", "Race naar de klok", "Gerry &amp; Katrien Van Osselaer-Van de Vijver", "Tybaartstraat 53<br />Sint-Gillis-Waas");
	listLL[1] = new coords(4.102149, 51.220015, "bol", "y", "y", "Dames en Heren, appels en peren!", "Berten &amp; Isabel Meersschaert-Coppieters", "Holdamstraat 1<br />Sint-Gillis-Waas");
	listLL[2] = new coords(4.103543, 51.233681, "bol", "y", "y", "Loopt er een beer op de boerderij?", "Erwin &amp; Ann Daelman-Tindemans", "Plasstraat 2<br />Sint-Gillis-Waas");
	listLL[3] = new coords(4.104414, 51.236943, "bol", "y", "y", "Hoe wonen varkens?", "Gilbert &amp; Cecile Buys-De Cock", "Eeckbergstraat 24<br />Sint-Gillis-Waas");
	listLL[4] = new coords(4.106791, 51.237207, "bol", "y", "y", "De kip of het ei?", "Ren&eacute; &amp; Denise Meersschaert-Beck", "Eeckbergstraat 36<br />Sint-Gillis-Waas");
	listLL[5] = new coords(4.104230, 51.253642, "bol", "y", "y", "Een geitenstal zonder wolf?", "Familie Hermans", "Sluisstraat 4<br />Sint-Gillis-Waas");
	listLL[6] = new coords(4.125580, 51.246282, "bol", "y", "y", "Van koe tot koelkast?", "Marc &amp; Christine De Boey-Heerwegh", "Groenendijk 11<br />Sint-Gillis-Waas");
	listLL[7] = new coords(4.129571, 51.227286, "bol", "y", "y", "Alle dagen zomer?", "Jozef &amp; Simonne Teugels-Beck", "Broekstraat 20<br />Sint-Gillis-Waas");
	listLL[8] = new coords(4.121890, 51.201667, "bol", "y", "y", "Is mest van levensbelang?", "Patrick &amp; Christel Smet-Beck", "Bunderstraat 17<br />Sint-Gillis-Waas");
	listLL[9] = new coords(4.124143, 51.208872, "bol", "y", "y", "De frietjesmachine?", "Alberic &amp; Christel Tack-Buytaert","Doornstraat 66<br />Sint-Gillis-Waas");
	listLL[10] = new coords(4.146115, 51.208913, "bol", "y", "y", "Wat staat er op het menu?", "Marc &amp; Tim Kluskens", "Laarstraat 9<br />Sint-Gillis-Waas");
	listLL[11] = new coords(4.142360687, 51.223402431, "bol", "y", "y", "Gaan koeien lopen uit een open stal?", "Marc &amp; Annick De Loor-Van Puyvelde", "Okkevoordestraat 47<br />Sint-Gillis-Waas");
	listLL[12] = new coords(4.1132211, 51.218873, "vlag", "y", "n", "Start en Stop", "Gemeenschapscentrum De Route", "Stationstraat 201 bus 1<br />Sint-Gillis-Waas<br />Tel.: 03 229 02 01 of 03 229 02 02");
	listLL[13] = new coords(4.142575263977051, 51.20746145958764, "gevaar", "n", "n", "Gevaarlijk punt!", "opgelet!", "U kruist hier een mogelijk drukke weg");
	listLL[14] = new coords(4.101419448852539, 51.23335937738309 , "gevaar", "n", "n", "Gevaarlijk punt!", "opgelet!", "U kruist hier een drukke weg");

	// This function picks up the side_bar click and opens the corresponding info window
	function myclick(i) {
	  gmarkers[i].openInfoWindowHtml(htmls[i]);
	  document.getElementById("detail_fiche").innerHTML = listLL[i].titel + "<br />" + listLL[i].naam + "<br />" + listLL[i].adres;
	}
	  // A function to create the marker and set up the event window
	function createMarker(point,html,tlr, icon) {
		var marker = new GMarker(point, icon);
		GEvent.addListener(marker, "click", function() {
			marker.openInfoWindowHtml(html);
		});
		// save the info we need to use later for the side_bar
		gmarkers[tlr] = marker;
		htmls[tlr] = html;
		// add a line to the side_bar html
		side_bar_html += '<a href="javascript:myclick(' + tlr + ')">' + listLL[tlr].naam + '</a><br>';
		// put the assembled side_bar_html contents into the side_bar div
		if (listLL[tlr].side == "y" ) { document.getElementById("side_bar").innerHTML = side_bar_html; }
		return marker;
	}

	function starter() {
	// functie die wordt opgestart bij laden
	    if (GBrowserIsCompatible()) {
			var baseIcon = new GIcon();
				baseIcon.iconSize=new GSize(32,32);
				baseIcon.shadowSize=new GSize(56,32);
				baseIcon.iconAnchor=new GPoint(16,32);
				baseIcon.infoWindowAnchor=new GPoint(16,0);

			var bol = new GIcon(baseIcon, "http://maps.google.com/mapfiles/kml/pal4/icon19.png", null, "http://maps.google.com/mapfiles/kml/pal4/icon19s.png");
			var vlag = new GIcon(baseIcon, "http://maps.google.com/mapfiles/kml/pal2/icon5.png", null, "http://maps.google.com/mapfiles/kml/pal4/icon19s.png");
			var eten = new GIcon(baseIcon, "http://maps.google.com/mapfiles/kml/pal2/icon32.png", null, "http://maps.google.com/mapfiles/kml/pal4/icon19s.png");
			var gevaar = new GIcon(baseIcon, "http://maps.google.com/mapfiles/kml/pal3/icon33.png", null, "http://maps.google.com/mapfiles/kml/pal4/icon19s.png");

			// Display the map, with some controls and set the initial location 
			var map = new GMap2(document.getElementById("map"));
				map.addControl(new GLargeMapControl());
				map.addControl(new GMapTypeControl());
	      		map.setCenter(new GLatLng(51.226567,4.125766),13);
	      		GEvent.addListener(map, "moveend", function() {  
				//alert(map.getCenter()); 
				//dit actief maken om coordinaten te zien document.getElementById("coords").innerHTML = map.getCenter();
				document.getElementById("coords").innerHTML = bedrijf;
				}
			);
	
	      // bouw deelnemergegevens op...
	      for (var i in listLL) {
	        //alert("load " + i);  
	        //--geocoder = new GClientGeocoder();
			//geocoder.getLocations(route[i], addToMap);
			//--geocoder.getLocations(route[i], function(response){	
			      // Retrieve the object
			      var point = new GLatLng(listLL[j].coord2, listLL[j].coord1);			      
			      if (listLL[j].link == "y") { 
			      	var linknaam = listLL[j].titel.replace(/[!?,]/g,"").toLowerCase();
			      	linknaam = linknaam.replace(/ /g,"_");
			      	var doclink = "<a href='" + linknaam + ".php'>" + listLL[j].naam + "</a><br />" ; 
			      	}
				else { var doclink = listLL[j].naam + "<br />"; }
			      // var tekst = "<a href='" + doclink + "'>" + listLL[j].naam + "</a><br /><i>" + listLL[j].titel + "</i><br />" + listLL[j].adres;
			      var tekst = doclink + "<i>" + listLL[j].titel + "</i><br />" + listLL[j].adres;
			      //if (listLL[j].icon == "bol") { var pin = bol; } else { var pin = vlag; }
			      switch (listLL[j].icon) {
				case "bol":
					var pin = bol
					break
				case "vlag":
					var pin = vlag
					break
				case "eten":
					var pin = gevaar
					break
				default:
					var pin = gevaar
				}
			      var marker = createMarker(point, tekst, j, pin);
			      // Center the map on this point
			      //map.setCenter(point, 13);
			      // Create a marker
			      map.addOverlay(marker);
			      j++;
			//--});
	      }

      // Read the data from route.xml
      
      var request = GXmlHttp.create();
      request.open("GET", "../_scripts/route.xml", true);
      request.onreadystatechange = function() {
        if (request.readyState == 4) {
          var xmlDoc = request.responseXML;
         
          // ========= Now process the polylines ===========
          var lines = xmlDoc.documentElement.getElementsByTagName("line");
          // read each line
          for (var a = 0; a < lines.length; a++) {
            // get any line attributes
            var colour = lines[a].getAttribute("colour");
            var width  = parseFloat(lines[a].getAttribute("width"));
            // read each point on that line
            var points = lines[a].getElementsByTagName("point");
            var pts = [];
            for (var i = 0; i < points.length; i++) {
               pts[i] = new GLatLng(parseFloat(points[i].getAttribute("lng")),
                                   parseFloat(points[i].getAttribute("lat")));
            }
            map.addOverlay(new GPolyline(pts,colour,width));
          }
          // ================================================           
        }
      }
      //alert(bedrijf);
      //bedrijf = 1;
	  if ((bedrijf > -0.1 ) && (bedrijf < j + 1)) { gmarkers[bedrijf].openInfoWindowHtml(htmls[bedrijf]); }

      request.send(null);
    }
    // display a warning if the browser was not compatible
    else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
    }
}