if(!is_defined(beoordeeld_pagina)){ var beoordeeld_pagina = 0; }

var baseIcon = new GIcon();
baseIcon.iconAnchor = new GPoint(5, 42);
baseIcon.iconSize = new GSize(27, 52);
baseIcon.infoWindowAnchor = new GPoint(5, 42);
var gmarkers = new Array();
var i = 0;
var i2 = 0;
var side_bar_html;		
var map;	
var sorteren;
var sorteer;	
var sort;
var sorteerhoe = "DESC";
var weergeven = 0;
var mapgeladen = 0;
var c = 0;
var all_weergeven = false;
var geocoder = new GClientGeocoder();				
side_bar_html;		
aantal_veranderingen = 0;
openwindow = 0;
	
	window.addEvent('domready', 
 		 function(){
  				google_load();
		}
	);			
				

function sort(waarop){
 sorteren = 1;
 veranderMarkers(map.getCenter(), waarop, sorteerhoe);
	if ( sorteerhoe == "ASC" ){ sorteerhoe = "DESC"; }
	else{ 						sorteerhoe = "ASC";}
 sorteren = 0;
}

function verander_weergeven(){
 weergeven = $('laatzien').options[$('laatzien').selectedIndex].value;
 sorteren = 1;
 veranderMarkers(map.getCenter(), weergeven);
 sorteren = 0;				

}		
function alles_weergeven(){
 all_weergeven = $('all').checked;
 mapgeladen = 0;
 google_load();
 mapgeladen = 2;
 veranderMarkers(map.getCenter(), weergeven);				

}	
	
				

function wijzigTekst(inhoud) {
	$('winkelinfo').innerHTML = inhoud; 
	
	$('winkelinfo').style.display=""
	
	} 
function wijzigTekstRemove(inhoud) {
	$('winkelinfo').innerHTML = inhoud; 
	$('winkelinfo').style.display="none"
	
	} 
	  

  	
	
function google_load(){
	
	all_weergeven = $('all').checked; 
	
	if (mapgeladen == 1) {
		var center = map.getCenter();
	}
    
	if (GBrowserIsCompatible()) {
		map = new GMap2($("map"));
		map.addControl(new GLargeMapControl());
		map.addControl(new GMapTypeControl());
		map.addControl(new GScaleControl());
		if (mapgeladen == 0) {
			map.setCenter(new GLatLng(52.5, 5), 7);
		}
		else {
			map.setCenter(center);
		}
		var geocoder = new GClientGeocoder();
		map.enableScrollWheelZoom();
		if (!all_weergeven) {
		
			GEvent.addListener(map, "moveend", function(){
				veranderMarkers(map.getCenter());
			});
		}else{
			mapgeladen = 2;
		}
		
		
		GEvent.addListener(map, "infowindowopen", function() {openwindow = 1;}); 
		GEvent.addListener(map, "infowindowclose", function() {openwindow = 0;}); 
		if(mapgeladen != 2) mapgeladen = 1;
		
		return map;
	}
	else {
		alert("Sorry, the Google Maps API is not compatible with this browser");
	}
}
 




function showLocation(id) {
	var address = $(id).value;
      geocoder.getLocations(address+" Nederland", addAddressToMap);
	  side_bar_html = "<table class='adressentable'><tr><th><a onclick='sort(\"bedrijfsnaam\");return false;' href='#'>Naam</a></th><th><a onclick='sort(\"straat\");return false;' href='#'>Adres</a></th><th><a onclick='sort(\"postcode\");return false;' href='#'>Postcode</a></th><th><a onclick='sort(\"plaats\");return false;' href='#'>Plaats</a></th><th><a onclick='sort(\"beoordeling\");return false;' href='#'>Beoordeling</a></th></tr>";
    }
	 
	    function addAddressToMap(response) {
		
				map.clearOverlays();
		
				  if (!response || response.Status.code != 200) {
					alert("Sorry, deze plaatsnaam is niet bekend");
				  } else {
						place = response.Placemark[0];
						point = new GLatLng(place.Point.coordinates[1],
											place.Point.coordinates[0]);

						lat_w = place.Point.coordinates[1];
						lng_w = place.Point.coordinates[0];
						map.setCenter(new GLatLng(lat_w,lng_w),11); 
										  
								    
				  }

    }  
	
    
function veranderMarkers(pos,sort,hoe) {
	
	all_weergeven = $('all').checked;
	
	if(openwindow == 1){
		return false;
	}  
	if(map.getZoom() > 11   && aantal_veranderingen < 3 && mapgeladen !=2 ){
		aantal_veranderingen ++;
		return false; 
	}
	if(all_weergeven && mapgeladen != 2  && sorteren != 1){
		
		return false;
	}

	wijzigTekst("<img src='/i/loadingS.gif'/> &nbsp; Bezig met laden.....");
	aantal_veranderingen = 0;
	 mapgeladen = 1;
	pos = pos + "";
	var pos2 = pos.split(', ');
	
	 map.clearOverlays();
	  

	  side_bar_html = "<table class='adressentable'><tr><th><a onclick='sort(\"bedrijfsnaam\");return false;' href='#'>Naam</a></th><th><a onclick='sort(\"straat\");return false;' href='#'>Adres</a></th><th><a onclick='sort(\"postcode\");return false;' href='#'>Postcode</a></th><th><a onclick='sort(\"plaats\");return false;' href='#'>Plaats</a></th><th><a onclick='sort(\"beoordeling\");return false;' href='#'>Beoordeling</a></th></tr>";
		 
					var request = GXmlHttp.create();
					  request.open("GET", "/xml/winkels/winkels.xml?pos="+pos+"&beoordeeld="+beoordeeld_pagina+"&watdoen="+weergeven+"&sort="+sort+"&hoe="+hoe+"&all="+all_weergeven, true);
					  request.onreadystatechange = function() {
								if (request.readyState == 4) {
									  var xmlDoc = GXml.parse(request.responseText);
									  var markers = xmlDoc.documentElement.getElementsByTagName("marker");
									  
									  for (var i = 0; i < markers.length; i++) {
												// obtain the attribues of each marker
												var lat = parseFloat(markers[i].getAttribute("lat"));
												var lng = parseFloat(markers[i].getAttribute("lng"));
												var point = new GLatLng(lat,lng);
												var label = markers[i].getAttribute("label");
												var icon = markers[i].getAttribute("img");
												var naam = markers[i].getAttribute("naam");
												var plaats = markers[i].getAttribute("plaats");
												var postcode = markers[i].getAttribute("postcode");
												var beoordeling = markers[i].getAttribute("beoordeling");
												var aantalbeoordelingen = markers[i].getAttribute("aantalbeoordelingen");
												
												var adres = markers[i].getAttribute("adres");
												var winkelid = markers[i].getAttribute("winkel_id");
												
												if(aantalbeoordelingen == 0){
													beoordeling = " - " ;
												}else{
													beoordeling = beoordeling+"/5" ;
												}
												
												html = '<div id="winkel_'+winkelid+'"><img src="/i/loading.gif" alt=""/></div>';
												var naam2 = urlencode(naam);
												links = '<tr id="s'+i2+'" onclick="javascript:change_location(\'/winkels/' + winkelid + '/'+naam2+'\')"><td>'+naam+'</td><td>'+adres+'</td><td>'+postcode+'</td><td>'+plaats+'</td><td>'+beoordeling+'</td></tr>';
												
												// create the marker
												var marker = createMarker(point,label,html,icon,links,winkelid);
												map.addOverlay(marker);
												i2 ++;
												
									  }
									  document.getElementById("adressen").innerHTML = side_bar_html;
									  wijzigTekstRemove("");
								}
					  }
					    
			 request.send(null);
}



function createMarker(point,name,html,icon,links,winkelid) {
		var spotIcon = new GIcon(baseIcon);
		spotIcon.image = icon;
		spotIcon.iconSize = new GSize(27, 52);
		
		var marker = new GMarker(point,spotIcon);
		
		
		
		GEvent.addListener(marker, "click", function() {
		 openwindow = 1;
		  load_html_data(winkelid, marker);
			 map.panTo(point);
			map.savePosition();
      		var CDivPixel = map.fromLatLngToDivPixel(map.getCenter());
      		var pointDivPixel = map.fromLatLngToDivPixel(point);
      		var fromCenter = subGPoints(pointDivPixel, CDivPixel);
      		map.panBy(new GSize(-fromCenter.x-40,-fromCenter.y+155));

		 
		});
		  GEvent.addListener(marker,"mouseover", function() {
		  wijzigTekst(name);
		});  
		 GEvent.addListener(marker,"mouseout", function() {
		  wijzigTekstRemove("");
		}); 
		
		gmarkers[i] = marker;
	    side_bar_html += links;
		i++;
		return marker;
}

function load_html_data(winkelid, marker){
		
		
		
		var req = new Request({
		method: 'get',
		url: '/xml/winkels/winkel_infowindow.xml',
		
		onSuccess: function(txt){
			
		marker.openInfoWindowHtml( txt );
	    
			
		
		}

	}).send("winkelid="+winkelid);

}
function subGPoints(a,b) {
		             //returns the distance in pixels between point a and b
    	    	        return new GPoint(a.x-b.x, a.y-b.y);
	      	}

