// Paradise Resort

    if (GBrowserIsCompatible()) {
      
      // this variable will collect the html which will eventually be placed in the side_bar
      //var side_bar_html = "";
    
      // arrays to hold copies of the markers and html used by the side_bar
      // because the function closure trick doesnt work there
      var gmarkers = [];
      var i = 0;
      var lastlinkid;
	
	var iconBlue = new GIcon(); 
    iconBlue.image = 'http://labs.google.com/ridefinder/images/mm_20_blue.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://labs.google.com/ridefinder/images/mm_20_red.png';
    iconRed.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
    iconRed.iconSize = new GSize(12, 20);
    iconRed.shadowSize = new GSize(22, 20);
    iconRed.iconAnchor = new GPoint(6, 20);
    iconRed.infoWindowAnchor = new GPoint(5, 1);

    var customIcons = [];
    customIcons["other"] = iconBlue;
    customIcons["resort"] = iconRed;
    var markerGroups = { "other": [], "resort": []};

      // A function to create the marker and set up the event window
      function createMarker(point, name, picture, type, phone, city, description) {
        var marker = new GMarker(point, customIcons[type]);
        var linkid = "link"+i;
			var html = '<div id="popup"><p><b>' + name + "</b>";
			var html = html + '<br>' + city;
		var html = html + '</p>';
		if (picture != "") {
			var html = html + '<p><img src="' + picture + '" width="150" height="70" /></p>';
		}
		var html = html + '<p>' + description + '</p>';
		var html = html + "</div>";
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
          //document.getElementById(linkid).style.background="#ffff00";
          lastlinkid=linkid;
        });

		gmarkers[i] = marker;
        i++;
        return marker;

      }

      // This function picks up the click and opens the corresponding info window
      function myclick(i) {
        GEvent.trigger(gmarkers[i], "click");
      }

      // create the map
      var map = new GMap2(document.getElementById("map"));
	  map.setMapType(G_SATELLITE_MAP);
      map.addControl(new GSmallMapControl());
  	  map.setCenter(new GLatLng(cenlat, cenlon), cenzoom);

	  //add the points from the database
        //var phpquery = 'map/google-map-markers.xml';
		GDownloadUrl(phpquery, function(data) {
          var xml = GXml.parse(data);
          var markers = xml.documentElement.getElementsByTagName("marker");
		  //var bounds = new GLatLngBounds();
          for (var i = 0; i < markers.length; i++) {
            var name = markers[i].getAttribute("name");
			var description = markers[i].getAttribute("description");
            var picture = markers[i].getAttribute("picture");
			var email = markers[i].getAttribute("email");
			var phone = markers[i].getAttribute("phone");
			var city = markers[i].getAttribute("city");
            var type = markers[i].getAttribute("type");
            var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                                    parseFloat(markers[i].getAttribute("lng")));
											
			//bounds.extend(point);
									
            var marker = createMarker(point, name, picture, type, phone, city, description);
            map.addOverlay(marker);
          }
		  
      	GEvent.addListener(map,"infowindowclose", function() {
        	//document.getElementById(lastlinkid).style.background="#ffffff";
      		});
		  
        }); // end of adding points from the database
		
		//now open the first info window
		//javascript:myclick(0);       
    }

    else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
    }