// JavaScript Document
<!--
	// create the map
    var map = new GMap2(document.getElementById("map"));
	map.addControl(new GLargeMapControl());
	map.addControl(new GMapTypeControl());
	map.setCenter(new GLatLng(40.839658228207675, 14.247550964355468), 13);
	map.enableContinuousZoom();
	map.enableDoubleClickZoom();
	map.setMapType(G_SATELLITE_MAP);
	
	      	////'mouseover' listener shows controls

	GEvent.addListener(map, "mouseover", function(){
	map.showControls();
	});

////'mouseout' listener hides controls

	GEvent.addListener(map, "mouseout", function(){
	map.hideControls(); 
	});

	 
    if (GBrowserIsCompatible()) {
	  var side_bar_html = "";
      var gmarkers = [];
      var htmls = [];
      var i = 0;
    var iconBlue = new GIcon(); 
    iconBlue.image = 'http://www.abcnapoli.com/mm_1.png';
    iconBlue.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
    iconBlue.iconSize = new GSize(12, 20);
    iconBlue.shadowSize = new GSize(22, 20);
    iconBlue.iconAnchor = new GPoint(6, 20);
    iconBlue.infoWindowAnchor = new GPoint(5, 1);
	
	    var iconRed = new GIcon(); 
    iconRed.image = 'http://www.abcnapoli.com/mm_13.png';
    iconRed.iconSize = new GSize(33, 35);
    iconRed.iconAnchor = new GPoint(-5, 35);
    iconRed.infoWindowAnchor = new GPoint(12, 3);
// Creates a marker whose info window displays the letter corresponding
        // to the given index.
	    var customIcons = [];
    customIcons["musei"] = iconBlue;
    customIcons["chiese"] = iconRed;
    var markerGroups = { "musei": [], "chiese": []};
	
	  var gmarkers = [];
      var htmls = [];
      var i = 0;
	  
GDownloadUrl("xml/xml_chiese.php", function(data) {
          var xml = GXml.parse(data);
          var markers = xml.documentElement.getElementsByTagName("marker");
          for (var i = 0; i < markers.length; i++) {
            var name = markers[i].getAttribute("html");
            var address = markers[i].getAttribute("info");
            var type = markers[i].getAttribute("type");
            var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                                    parseFloat(markers[i].getAttribute("lng")));
            var marker = createMarker(point, name, address, type);
            map.addOverlay(marker);
			
            }
        });
		
	    function createMarker(point, name, address, type) {
      var marker = new GMarker(point, customIcons[type]);
      markerGroups[type].push(marker);
      var html = "<span class=\"testomappa\">" +type + "</span><br><span class=\"titolomapp\">" + name + "</span>" +  "<br><table width=\"250\"  border=\"0\" cellspacing=\"0\" cellpadding=\"0\"><tr><td><span class=\"testomappa\">" + address + "</span></td></tr></table>" ;
      GEvent.addListener(marker, 'click', function() {
        marker.openInfoWindowHtml(html);
      });
	    gmarkers[i] = marker;
        htmls[i] = html;
        // add a line to the side_bar html
        side_bar_html += '<a href="javascript:myclick(' + i + ')">' + name + '</a><br>';
        i++;
      return marker;
    }
		        // This function picks up the click and opens the corresponding info window
      function myclick(i) {
		map.setMapType(G_NORMAL_MAP);
		map.setZoom(15);
        gmarkers[i].openInfoWindowHtml(htmls[i]);
      }
	  
    function toggleGroup(type) {
      for (var i = 0; i < markerGroups[type].length; i++) {
        var marker = markerGroups[type][i];
        if (marker.isHidden()) {
          marker.show();
        					    } 
		else {
          marker.hide();
        	}
     							 							} 
								 }



}

    // display a warning if the browser was not compatible
    else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
    }
-->
