//<![CDATA[
		var mapfile = "mongolia-embassies-markers.xml";
var lat = 16.63619;
var lng = 4.21875;
var attr = 1;
//]]>

    //<![CDATA[
      // === Create an associative array of GIcons() ===
      var gicons = [];
      gicons["embassy"] = new GIcon(G_DEFAULT_ICON);
      gicons["embassy"].image = "images/red20.png";
      gicons["embassy"].iconSize = new GSize(20,20);
	  gicons["embassy"].iconAnchor =  new GPoint(5, 5);

      gicons["consulate"] = new GIcon(G_DEFAULT_ICON);
      gicons["consulate"].image = "images/blue20.png";
      gicons["consulate"].iconSize = new GSize(20,20);
	  gicons["consulate"].iconAnchor = new GPoint(20, 20);

    if (GBrowserIsCompatible()) {
      var side_bar_html = ""; // this variable will collect the html which will eventually be placed in the side_bar
      // 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 htmls = [];
      var ii = 0;


      // A function to create the marker and set up the event window
      function createMarker(point,label,html,icontype,country,abbreviation, htmlFileName) {
        var marker = new GMarker(point, gicons[icontype]);
        marker.mycategory = icontype;
        marker.mylabel = label;
		marker.mycountry = country;
		marker.myabbreviation = abbreviation;
		marker.htmlFileName = htmlFileName;
		
        //GEvent.addListener(marker, "mouseover", function() {
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html+"<br/><a href='"+htmlFileName+"'><img src='images/print.gif'/> хэвлэх</a>");
        });
        gmarkers[ii] = marker;
        htmls[ii] = html+"<br/><a href='"+htmlFileName+"'><img src='images/print.gif'/> хэвлэх</a>";
        side_bar_html += '<a href="javascript:myclick(' + ii + ')"><b>' + country + '</b>' + label + '</a><br>';
        ii++;
        return marker;
      }


      // == shows all markers of a particular category, and ensures the checkbox is checked ==
      function show(category) {
        for (var i=0; i<gmarkers.length; i++) {
          if (gmarkers[i].mycategory == category) {
            gmarkers[i].show();
          }
        }
        // == check the checkbox ==
        document.getElementById(category+"box").checked = true;
      }

      // == hides all markers of a particular category, and ensures the checkbox is cleared ==
      function hide(category) {
        for (var i=0; i<gmarkers.length; i++) {
          if (gmarkers[i].mycategory == category) {
            gmarkers[i].hide();
          }
        }
        // == clear the checkbox ==
        document.getElementById(category+"box").checked = false;
        // == close the info window, in case its open on a marker that we just hid
        map.closeInfoWindow();
      }

      // == a checkbox has been clicked ==
      function boxclick(box,category) {
        if (box.checked) {
          show(category);
        } else {
          hide(category);
        }
        // == rebuild the side bar
        makeSidebar();
      }

      // This function picks up the click and opens the corresponding info window
      function myclick(i) {
        gmarkers[i].openInfoWindowHtml(htmls[i]);
      }

      // == rebuilds the sidebar to match the markers currently displayed ==
      function makeSidebar() {
        var html = "";
		gmarkers.sort();
        for (var i=0; i<gmarkers.length; i++) {
          if (!gmarkers[i].isHidden()) {
		  	var flagUrl = '<img class="noborder" src="images/countries/' + gmarkers[i].myabbreviation + '.gif"></img>';
			
			html += '<a href="javascript:myclick(' + i + ')">'+flagUrl+' <b>' + gmarkers[i].mycountry + '</b>, ' + gmarkers[i].mylabel + '  хэвлэх<\/a><br>';
          }
        }
//			dont show sidebar in Country level
//        document.getElementById("side_bar").innerHTML = html;
      }


      // create the map
      var map = new GMap2(document.getElementById("map"));
      // Get the list of map types      
      var mt = map.getMapTypes();
      
      map.addControl(new GLargeMapControl());
      map.addControl(new GMapTypeControl());
      map.setCenter(new GLatLng( lat, lng), attr);

      // A function to read the data
      function readMap(url) {
        var request = GXmlHttp.create();
        request.open("GET", url, true);
        request.onreadystatechange = function() {
          if (request.readyState == 4) {
            var xmlDoc = GXml.parse(request.responseText);
            // obtain the array of markers and loop through it
            var markers = xmlDoc.documentElement.getElementsByTagName("marker");
            // hide the info window, otherwise it still stays open where the removed marker used to be
            map.getInfoWindow().hide();
            
            map.clearOverlays();            
            
            // empty the arrays
            gmarkers = [];
            htmls = [];
            ii = 0;

            // reset the side_bar
            side_bar_html="";
			
            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 html = markers[i].getAttribute("html");
				var html = GXml.value(markers[i].getElementsByTagName("infowindow")[0]);
              var label = markers[i].getAttribute("city");
            var icontype = markers[i].getAttribute("icontype");
			var country = markers[i].getAttribute("country");
			var city = markers[i].getAttribute("city");
			var abbreviation = markers[i].getAttribute("abbreviation");
			var htmlFileName = "elchin-saidiin-yam-" + markers[i].getAttribute("country") + "-" +  markers[i].getAttribute("countryMn") + "-" + markers[i].getAttribute("city") + ".html";

              // create the marker
              var marker = createMarker(point,label,html,icontype,country,abbreviation, htmlFileName);
              map.addOverlay(marker);
            }
                    // == show or hide the categories initially ==
        // == create the initial sidebar ==
        makeSidebar();

          }
        }
        request.send(null);
      }
      
      // When initially loaded, use the data from "xml/chinese-embassies-markers.xml"
		readMap(mapfile);
    }

    else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
    }
    // This Javascript is based on code provided by the
    // Blackpool Community Church Javascript Team
    // http://www.commchurch.freeserve.co.uk/   
    // http://econym.googlepages.com/index.htm

    //]]>