var map = null;

function DoZoom(lat, lng) {
    map.setCenter(new GLatLng(lat, lng), map.getZoom() + 2);
}

function DoZoomRegione(lat, lng) {
    map.setCenter(new GLatLng(lat, lng), 8);
    LoadMarkers();
}

function LoadMarkers() {
	// Read the data from XML
	var request = GXmlHttp.create();
	// Open the XML file
	request.open("GET", MarkerXml + "&sw=" + map.getBounds().getSouthWest() + "&ne=" + map.getBounds().getNorthEast() + "&z=" + map.getZoom(), true);
	request.onreadystatechange = function() {
		if (request.readyState == 4) {
			var xmlDoc = request.responseXML;
			// Obtain the array of markers and loop through it
			var markers = xmlDoc.documentElement.getElementsByTagName("marker");

			// Clean all the markers
			map.clearOverlays();

			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 name = markers[i].getAttribute("name");
						
			var point = new GLatLng(lat,lng);
		        
			// Call the function to create the marker
			var marker;
			if (map.getZoom() >= 13) {
				var markerhtml = "";
				
				var c = markers[i].getAttribute("c");
				var address = markers[i].getAttribute("address");
				var zipCode = markers[i].getAttribute("zipCode");
				var city = markers[i].getAttribute("city");
				var province = markers[i].getAttribute("province");
				var logo = markers[i].getAttribute("logo");
				
				if (logo != "")
					markerhtml += "<img src=\"" + logo + ".jpg\" alt=\"Logo\" width=\"42\" height=\"30\" vspace=\"2\" hspace=\"2\" align=\"left\">"
					
				if (c != "")
					markerhtml += "<b><a href=\"/Contenuti/Grossista/" + c + ".aspx\">" + name + "</a></b><br>";
				else
					markerhtml += "<b>" + name + "</b><br>";

				markerhtml += address + "<br>";
				markerhtml += zipCode + " - " + city + " (" + province + ")" + "<br>";
				
				marker = createMarker(point, markerhtml);
			} else {
				marker = createGroupMarker(point, name);
			}
			map.addOverlay(marker);
			}
		}
	}
	request.send(null);
}

 // Function to create the marker and set up the event window
function createMarker(point,markerhtml) {
    // Create the map marker
    var marker = new GMarker(point);
    // Add a click event to each marker which will open the HTML window
    GEvent.addListener(marker, "click", function() {
	    marker.openInfoWindowHtml(markerhtml);
    });
    
    return marker;
}

// Function to create the marker group and set up the event window
function createGroupMarker(point,count) {
	var lngDelta = (map.getBounds().getNorthEast().lng() - map.getBounds().getSouthWest().lng()) / 40;
	var latDelta = (map.getBounds().getNorthEast().lat() - map.getBounds().getSouthWest().lat()) / 60;
	var rectBounds = new GLatLngBounds(
		new GLatLng(point.lat() + latDelta,
			        point.lng() + lngDelta),
		new GLatLng(point.lat() - latDelta,
			        point.lng() - lngDelta));

    // Create the map marker
    var htmlText = "<a href=\"javascript:void(0);\" class=\"Glabel\" onclick=\"DoZoom(" + point.lat() + "," + point.lng() + ");\">" + count + "</a>";
    var marker = new GLabel(rectBounds, htmlText);
    
    // Add a click event to each marker which will open the HTML window
    GEvent.addListener(marker, "click", function() {
		map.setCenter(marker.getPoint(), map.getZoom() + 2);
    });
    
    return marker;
}  

function load() {
   if (GBrowserIsCompatible()) {
      // Create the map
      // Make sure this element has the same ID as your div
      map = new GMap2(document.getElementById("gmap"));
      // Add controls for moving and zooming the map. Use GSmallMapControl for small maps
      map.addControl(new GLargeMapControl());
       // Add controls for the map type control
      map.addControl(new GMapTypeControl());
       // Add controls for the overview of the map
      map.addControl(new GOverviewMapControl());
      
      // Add two event listener so when the map is zoomed or dragged the markers are reloaded
      GEvent.addListener(map, "zoomend", function (OldValue, NewValue) {
		LoadMarkers();
      });
      GEvent.addListener(map, "dragend", function () {
		LoadMarkers();
      });
      
      // ITALY
      map.setCenter(new GLatLng(startLat,startLng), startZoom);      
   }
   // Javascript alert for older browsers where Google Maps isn't supported
   else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
   }
}