var allMarkers = new Array();
	var map;

	function getMap() { return map; }

    function load() {
      if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("map"));
	map.addControl(new GSmallMapControl());
	map.addControl(new GMapTypeControl());
	map.addControl(new GScaleControl() );
        map.setCenter(new GLatLng(32.764, -97.042), 9);

// Create a base icon for all of our markers that specifies the
// shadow, icon dimensions, etc.
var baseIcon = new GIcon();
baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
baseIcon.iconSize = new GSize(20, 34);
baseIcon.shadowSize = new GSize(37, 34);
baseIcon.iconAnchor = new GPoint(9, 34);
baseIcon.infoWindowAnchor = new GPoint(9, 2);
baseIcon.infoShadowAnchor = new GPoint(18, 25);      
baseIcon.transparent = "http://www.shanem.net/photography/flickr/point-trans.png";
baseIcon.imageMap = [9,0,6,1,4,2,2,4,0,8,0,12,1,14,2,16,5,19,7,23,8,26,9,30,9,34,11,34,11,30,12,26,13,24,14,21,16,18,18,16,20,12,20,8,18,4,16,2,15,1,13,0]; 


	function buildUserHtml( userStrings ) {
	  var userHtml = "<table>";

	  var userWidth = 4;
	  for( var i = 0; i < userStrings.length; i++ ) {
	    if( ( i % userWidth ) == 0 ) {
		  userHtml += "<tr>"
		}
		userHtml += "<td>" + userStrings[i] + "</td>";
	    if( ( i % userWidth ) == ( userWidth - 1 ) ) {
		  userHtml += "</tr>"
		}
	  }

	  userHtml += "</table>";

	  return userHtml;
	}

// Download the data in data.xml and load it on the map. The format we
// expect is:

	GDownloadUrl("http://shanem.net/photography/flickr/DAM/Peopledata.xml", function(data, responseCode) {
	  var xml = GXml.parse(data);
	  var latSum = 0;
	  var lngSum = 0;
	  var userHtmls = new Array();

  	  var markers = xml.documentElement.getElementsByTagName("person");
  	  for (var i = 0; i < markers.length; i++) {
    	    var lat = parseFloat(markers[i].getAttribute("lat") );
	    latSum += lat;
    	    var lng = parseFloat(markers[i].getAttribute("lng") );
	    lngSum += lng;

    	    var point = new GLatLng( lat, lng );

	    var marker = MakeMarker( point, markers[i] )
//	    GEvent.addListener(marker, "click", function( ) {
//    	          marker.openInfoWindowHtml("<A HREF=\"" + markers[i].getAttribute("url") + "\">click</a><br>");
//  	    });

	    map.addOverlay( marker );
        var name = markers[i].getAttribute("name");
        var imageLink = markers[i].getAttribute("img");
		var userHtml = "<A HREF=\"javascript:selectMarker(" + i + ")\"><img border=0 src=\"" + imageLink + "\">&nbsp;" + name + "</a><br>";

		userHtmls.push( userHtml );
		allMarkers[i] = marker;
  	  }
	  
	  var avgLat = latSum / markers.length;
	  var avgLng = lngSum / markers.length;
	  var midIcon = new GIcon( baseIcon );
	  midIcon.image = "http://shanem.net/photography/flickr/point-yellow.png";
	  var midMarker = new GMarker( new GLatLng( avgLat, avgLng ), midIcon );
	  map.addOverlay( midMarker );

	  GEvent.addListener(midMarker, "click", function( ) {

    	  midMarker.openInfoWindowHtml( "This is the geographic center of everyone listed on the map" );
  	  });

	  var userListDiv = document.getElementById('userList');
	  if( userListDiv != null ) {
	    var fullUserHtml = buildUserHtml ( userHtmls );
	    userListDiv.innerHTML = fullUserHtml;
	  }
	});
      }
    }

	function MakeMarker( point, mXML ) {

            var imageLink = mXML.getAttribute("img");
            var name = mXML.getAttribute("name");
            var url = mXML.getAttribute("url");
            var desc = "";//mXML.getAttribute("desc");
		return MakeMarkerFromData( point, imageLink, name, url, desc );
	}

	function MakeMarkerFromData( point, imageLink, name, url, desc ) {
    	var marker = new GMarker( point )

        var startLink = "<A HREF=" + url + ">"
        var imgText = "<img border=0 height='48' width='48' src=" + imageLink + ">"

        var htmlContent = "<div style=\"width: 48px;\">" + startLink + name + "</a><br>" + startLink + imgText + "</a></div>";

	    GEvent.addListener(marker, "click", function( ) {
    	  marker.openInfoWindowHtml( htmlContent, {maxWidth: 30 } );
  	    });

	    return marker;
	}

	function selectMarker( index ) {
	  GEvent.trigger( allMarkers[index], "click" );
	}