//<![CDATA[

    var map;
    var geocoder;
	var locationName;
	var cluster;
	var markers;
	
    function load() {
      if (GBrowserIsCompatible()) {
	      geocoder = new GClientGeocoder();	
	      map = new GMap2(document.getElementById("map"));

	      map.setCenter(new GLatLng(56, 11.0), 6);
	      map.setUIToDefault();

	      //geocoder = new GClientGeocoder();
	      
	      loadXmlToMap();
    	}
    }
	function fixString(str) {
		str= decodeURI(str);
		str= str.replace(/\%2C/g, ",");
		
		return str.replace(/\+/g, " ");
	}
 
	 function createMarker(point, icon, name, building_id, location, main_image, images, arkitekt, year) {
 	 		
	 		 name = fixString(name);
	 		 location = fixString(location);
	 		 
 	 		
 	 		var marker = new GMarker(point, {title:name, building_id:building_id, main_image:main_image, icon:icon});
 	 		
			GEvent.addListener(marker, "click", function() {
				var html = "<div style='width:204px;height:240px'>"
				html += "<h2 style='margin-bottom:5px;'>"+name.replace('+', ' ')+"</h2><br />";
				html += "<a href='bygning_$$"+building_id+"'><img alt=\"\" border=\"0\" src='http://www.arkitekturbilleder.dk/assets/images/cache/resizer.php?imgfile=http://www.arkitekturbilleder.dk/images/"+building_id+""+main_image+".jpg&max_width=110&max_height=75' /></a>";
				
				html += "<br />Arkitekt: "+ fixString(arkitekt);
						
				html += "<br />Sted: "+location;
				html += "<br />Opf&oslash;rt: "+year;
				html += "<br />Antal billeder: "+images;
				html += "<br /><a onmouseout=\"this.style.color=\'#000000\'\" onmouseover=\"this.style.color=\'#FF7F00\'\" href='bygning_$$"+building_id+"'>Se bygning &#187;</a></div>";
				marker.openInfoWindowHtml(html);
			});
			
 	 return marker;
	}
	
	
	function loadXmlToMap() {
	
		var marker, markersArray=[];
		
    	  GDownloadUrl("assets/snippets/Googlemap/markers.php?dummy=" + Math.random(), function(data) {
          	var xml = GXml.parse(data);
          
          	markers = xml.documentElement.getElementsByTagName("marker");
          	
          //G_DEFAULT_ICON
          	var icon = new GIcon(G_DEFAULT_ICON);
			icon.image = "assets/snippets/Googlemap/images/mm_20_green.png";
			icon.shadow = "assets/snippets/Googlemap/images/mm_20_shadow.png";
			icon.iconSize = new GSize(12, 20);
			icon.shadowSize = new GSize(22, 20);
			icon.iconAnchor = new GPoint(6, 20);
			icon.infoWindowAnchor = new GPoint(5, 1);
          	
         	for (var i = 0; i < markers.length; i++) {
         		
          	  var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng")));
				//map.addOverlay(new GMarker(point));
				marker = createMarker(point, icon, markers[i].getAttribute("name"), markers[i].getAttribute("building_id"), markers[i].getAttribute("location"), markers[i].getAttribute("main_image"), markers[i].getAttribute("images"), markers[i].getAttribute("arkitekt"), markers[i].getAttribute("year"));
				map.addOverlay(marker);
				markersArray.push(marker);        
          }	   
          
		  		
	   		//cluster = new ClusterMarker(map, {clusterMarkerTitle:'Info om %count bygninger' , clusterMarkerClick:myClusterClick });
	   		//cluster.addMarkers(markersArray);
			//cluster.intersectPadding=5;
	   		//cluster.fitMapToMarkers();
	   		
        });
    }
    
    function myClusterClick(args) {
    	
		cluster.defaultClickAction=function(){
				map.setCenter(args.clusterMarker.getLatLng(), map.getBoundsZoomLevel(args.clusterMarker.clusterGroupBounds))
				delete cluster.defaultClickAction;
			}
			var html='<div style="height:250px; overflow:auto; width:300px"><h4>'+args.clusteredMarkers.length+' bygninger:</h4><table>';
			
			for (i=0; i<args.clusteredMarkers.length; i++) {
				
				html+='<tr><td><a onmouseout="this.style.color=\'#000000\'" onmouseover="this.style.color=\'#FF7F00\'" href="javascript:cluster.triggerClick('+args.clusteredMarkers[i].index+')"><img border="0" alt="" src="http://www.arkitekturbilleder.dk/assets/images/cache/resizer.php?imgfile=http://www.arkitekturbilleder.dk/images/'+args.clusteredMarkers[i].ca.building_id+''+args.clusteredMarkers[i].ca.main_image+'.jpg&max_width=110&max_height=75" /></a></td>';
				html+='<td><a onmouseout="this.style.color=\'#000000\'" onmouseover="this.style.color=\'#FF7F00\'" href="javascript:cluster.triggerClick('+args.clusteredMarkers[i].index+')">'+fixString(args.clusteredMarkers[i].getTitle())+'</a></td></tr>';
			}
			html+='</table>';
			//html+='<br /><a onmouseout="this.style.color=\'#000000\'" onmouseover="this.style.color=\'#FF7F00\'" href="javascript:void(0)" onclick="cluster.defaultClickAction()">Zoom</a> in to show these locations</div>';
			//	args.clusterMarker.openInfoWindowHtml(html);
			map.openInfoWindowHtml(args.clusterMarker.getLatLng(), html);

    }
    
    function moveMap(location) {
    	
    	switch(location) {
    		case 'koebenhavn':
				map.setCenter(new GLatLng(55.68031063801105, 12.566677499218754), 12);    
			break;
			case 'odense':
				map.setCenter(new GLatLng(55.397457814597566, 10.390182900830082), 12);    
			break;	
			case 'aarhus':
				map.setCenter(new GLatLng(56.159333723402916, 10.212341714306644), 12);    
			break;	
			case 'aalborg':
				map.setCenter(new GLatLng(57.04970990271348, 9.921375680371098), 12);    
			break;
    		case 'hovedstaden':
				map.setCenter(new GLatLng(55.93114149426412, 12.306438851757816), 10);    
			break;
			case 'sjaelland':
				map.setCenter(new GLatLng(55.302981487506365, 11.640392709179691), 9);    
			break;
			case 'syddanmark':
				map.setCenter(new GLatLng(55.27170005381407, 9.720531869335941), 8);    
			break;
			case 'midtjylland':
				map.setCenter(new GLatLng(56.0448310413968, 9.346996713085941), 9);    
			break;
			case 'nordjylland':
				map.setCenter(new GLatLng(57.169401733276324, 9.542004037304691), 9);    
			break;
			case 'bornholm':
				map.setCenter(new GLatLng(55.12346344648335, 14.91586344282227), 11);    
			break;
			
    		default:
    			map.setCenter(new GLatLng(56, 11.0), 6);
    	}   	
    }
//]]>