//<![CDATA[

    if (GBrowserIsCompatible()) {

      // display the loading message
      var om = new OverlayMessage(document.getElementById('map'));      
      om.Set('<b>Loading...<\/b>');
      

      var n=0;

      var icon = new GIcon();
      icon.image = "images/point-people.png";
//      icon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
      icon.iconSize = new GSize(32, 32);
      icon.shadowSize = new GSize(22, 20);
      icon.iconAnchor = new GPoint(6, 20);
      icon.infoWindowAnchor = new GPoint(5, 1);      

      iconLevel2 = new GIcon(icon,"images/point-house.png"); 
      iconLevel3 = new GIcon(icon,"images/point-city.png"); 
	  iconLevel3.iconSize = new GSize(20, 20);
		 iconLevel4 = new GIcon(icon,"images/point-city.png"); 

      function createMarker(point,name,html,icon) {
        var marker = new GMarker(point, {icon:icon});
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
        });
        return marker;
      }

      // new strategy - read the XML first, THEN create the map


      // read the markers from the XML
      GDownloadUrl(mapfile, function (doc) {
        var gmarkersA = [];      
        var gmarkersB = [];      
        var gmarkersC = [];      
//        var gmarkersD = [];      
        var xmlDoc = GXml.parse(doc);
        var markers = xmlDoc.documentElement.getElementsByTagName("marker");

          
        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 point = new GLatLng(lat,lng);
          var name = markers[i].getAttribute("name");
		  var state = markers[i].getAttribute("state");
		  
          var pop = markers[i].getAttribute("pop");
		  var zoomLevel = markers[i].getAttribute("zoomLevel");
		  var zoomToCity = markers[i].getAttribute("city");
          // split the markers into four arrays, with different GIcons
          if (parseInt(zoomLevel) == 1) {
		  // continent
			var marker = createMarker(point,name,"<b>"+name+"</b>"+"<br/>Mongolian population ca.: <b>"+pop+"</b><br/><br/><a href='index.php?city="+zoomToCity+"'><img src='images/icon-zoom.png'/> Zoom <i>[Ойртуул]</i></a>",icon);
             gmarkersA.push(marker);
          }
          else if((parseInt(zoomLevel) == 2)) {
		  // country / State
			var marker = createMarker(point,name,"<b>"+name+"</b>"+"<br/>Mongolian population ca.: <b>"+pop+"</b><br/><br/><a href='index.php?city="+zoomToCity+"'><img src='images/icon-zoom.png'/> (zoom)</a>",iconLevel2);
             gmarkersB.push(marker);
          }
          else if((parseInt(zoomLevel) == 3)) {
		  // city 3
			var marker = createMarker(point,name,"<b>"+name+"</b>"+"<br/>Mongolian population ca.: <b>"+pop+"</b><br/><br/><a href='index.php?city="+zoomToCity+"'><img src='images/icon-zoom.png'/> (zoom)</a>",iconLevel3);
             gmarkersC.push(marker);
          }
          else if((parseInt(zoomLevel) == 4)) {
		  // neighbourhood=4
			var marker = createMarker(point,name,"<b>"+name+"</b>"+"<br/>Mongolian population ca.: <b>"+pop+"</b><br/><br/><a href='index.php?city="+zoomToCity+"'><img src='images/icon-zoom.png'/> (zoom)</a>",iconLevel4);
             //gmarkersC.push(marker);
			 // deactivated yet
          }
        }

        // Display the map, with some controls and set the initial location 

        var map = new GMap2(document.getElementById("map"));
		var mt = map.getMapTypes();

      // Overwrite the getMinimumResolution() and getMaximumResolution() methods
      for (var i=0; i<mt.length; i++) {
        mt[i].getMaximumResolution = function() {return attr+2;}
		mt[i].getMinimumResolution = function() {return 1;}
      }

        map.addControl(new GLargeMapControl());
        map.addControl(new GMapTypeControl());
		map.addControl(new GOverviewMapControl());
        map.setCenter(new GLatLng(cityLat, cityLng), attr, G_NORMAL_MAP);
        var mm = new GMarkerManager(map, {borderPadding:1});

        mm.addMarkers(gmarkersA,1,2);
        mm.addMarkers(gmarkersB,2,3);
		mm.addMarkers(gmarkersC,4,17);
//        mm.addMarkers(gmarkersC,12,17);
//        mm.addMarkers(gmarkersD,13,17);
        mm.refresh();
        om.Clear(); // Clear the loading message
      });
    }

    // display a warning if the browser was not compatible
    else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
    }
  
    // This Javascript is based on code provided by the
    // Community Church Javascript Team
    // http://www.bisphamchurch.org.uk/   
    // http://econym.org.uk/gmap/
    
    //]]>