//<![CDATA[
      // this variable will collect the html which will eventually be placed in the side_bar 
      var side_bar_html = "";
      side_bar_html += '<p><select id="country_select" onChange="myclick(this.options[this.selectedIndex].value)">';
      side_bar_html += '<option selected> - Select a country - </option>';

      // arrays to hold copies of the markers and html used by the side_bar 
      // because the function closure trick doesnt work there 
      var gmarkers = []; 

     // global "map" variable
      var map = null;
// A function to create the marker and set up the event window function 
function createMarker(latlng, country, company, contact, address, telephone, fax, email, web) {
    var contentString = '<table style="border:0;font-family:arial, sans-serif;font-size:12px;width:330px;">';
		contentString += '<tr><td colspan="2"><h1 style="border-bottom: 1px dotted #cccccc;font-size: 14pt;color: #004880;font-weight:bold;line-height: 20px;margin-bottom: 7px;clear:both;">' + country + '</h1></td></tr>';
		contentString += '<tr><td width="90" valign="top"><strong>Organisation:</strong></td><td>' + company + '</td></tr>';
		contentString += '<tr><td><strong>Name:</strong></td><td>' + contact + '</td></tr>';
		contentString += '<tr><td valign="top"><strong>Address:</strong></td><td>' + address + '</td></tr>';
		contentString += '<tr><td><strong>Tel:</strong></td><td>' + telephone + '</td></tr>';
		contentString += '<tr><td><strong>Fax:</strong></td><td>' + fax + '</td></tr>';
		contentString += '<tr><td><strong>Email:</strong></td><td><a onclick="pageTracker._trackEvent(\'Reps Map\',\'Click Email\',\''+ country + ' - ' + company + '\');" href="mailto:' + email + '">' + email + '</a></td></tr>';
		contentString += '<tr><td><strong>Web:</strong></td><td><a target="_blank" onclick="pageTracker._trackEvent(\'Reps Map\',\'Click Weblink\',\''+ country + ' - ' + company + '\');" href="http://' + web + '">' + web + '</a></td></tr>';
		contentString += '</table>';
    var marker = new google.maps.Marker({
        position: latlng,
        map: map,
		title: country,
        zIndex: Math.round(latlng.lat()*-100000)<<5
        });

    google.maps.event.addListener(marker, 'click', function() {
        infowindow.setContent(contentString); 
        infowindow.open(map,marker);
        });
    // save the info we need to use later for the side_bar
    gmarkers.push(marker);
    // add a line to the side_bar html
    side_bar_html += '<option value="' + (gmarkers.length-1) + '">' + country + '</option>';
}
 
// This function picks up the click and opens the corresponding info window
function myclick(i) {
  google.maps.event.trigger(gmarkers[i], "click");
}

function initialize() {
  // create the map
    var latlng = new google.maps.LatLng(20, 10);
	var myOptions = {
    zoom: 2,
    center: latlng,
	disableDoubleClickZoom: true,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
	navigationControl: true,
	navigationControlOptions: {style: google.maps.NavigationControlStyle.DEFAULT} 
  }
  map = new google.maps.Map(document.getElementById("map_canvas"),
                                myOptions);

	google.maps.event.addListener(map, 'zoom_changed', function() {
	  if (map.getZoom() > 6) {
		map.setZoom(6);
		}
	  if (map.getZoom() < 2) {
		map.setZoom(2);
		}
	});
								
  google.maps.event.addListener(map, 'click', function() {
        infowindow.close();
        });
      // Read the data from example.xml
      downloadUrl("agentdata.xml", function(doc) {
        var xmlDoc = xmlParse(doc);
        var markers = xmlDoc.documentElement.getElementsByTagName("marker");
        for (var i = 0; i < markers.length; i++) {
          // obtain the attribues of each marker
          var country = markers[i].getAttribute("country");
          var lat = parseFloat(markers[i].getAttribute("lat"));
          var lng = parseFloat(markers[i].getAttribute("lng"));
          var point = new google.maps.LatLng(lat,lng);
          var company = markers[i].getAttribute("company");
          var contact = markers[i].getAttribute("contact");
          var address = markers[i].getAttribute("address");
          var telephone = markers[i].getAttribute("telephone");
          var fax = markers[i].getAttribute("fax");
          var email = markers[i].getAttribute("email");
          var web = markers[i].getAttribute("web");
          // create the marker
          var marker = createMarker(point,country,company,contact,address,telephone,fax,email,web);
        }
        // put the assembled side_bar_html contents into the side_bar div
        side_bar_html +="</select>";
		document.getElementById("side_bar").innerHTML = side_bar_html;
      });
    }
 
var infowindow = new google.maps.InfoWindow(
  { 
    size: new google.maps.Size(150,50)
  });
    

    // This Javascript is based on code provided by the
    // Community Church Javascript Team
    // http://www.bisphamchurch.org.uk/   
    // http://econym.org.uk/gmap/
    // from the v2 tutorial page at:
    // http://econym.org.uk/gmap/basic3.htm 
//]]>