var locations = {};
    var gmarkers = [];
    function load() {

        // A TextualZoomControl is a GControl that displays textual "Zoom In"
        // and "Zoom Out" buttons (as opposed to the iconic buttons used in
        // Google Maps).
        function CloseButtonControl() {
        }
        CloseButtonControl.prototype = new GControl();

        // Creates a one DIV for each of the buttons and places them in a container
        // DIV which is returned as our control element. We add the control to
        // to the map container and return the element for the map class to
        // position properly.
        CloseButtonControl.prototype.initialize = function(map) {
            var container = document.createElement("div");

            var CloseButtonDiv = document.createElement("div");
            this.setButtonStyle_(CloseButtonDiv);
            container.appendChild(CloseButtonDiv);
            CloseButtonDiv.appendChild(document.createTextNode("X"));
            GEvent.addDomListener(CloseButtonDiv, "click", function() {
                lb_close();
            });

            map.getContainer().appendChild(container);
            return container;
        }

        // By default, the control will appear in the top left corner of the
        // map with 7 pixels of padding.
        CloseButtonControl.prototype.getDefaultPosition = function() {
            //return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(3, 3));
        }

        // Sets the proper CSS for the given button element.
        CloseButtonControl.prototype.setButtonStyle_ = function(button) {
            //button.className = "links_nounderline"
            //button.style.textDecoration = "underline";
            button.style.color = "black";
            button.style.fontFamily = "verdana";
            button.style.fontSize = "12px";
            button.style.textAlign = "center";
            button.style.cursor = "pointer";
            button.style.fontWeight = "bold";
            button.style.backgroundColor = "white";
            button.style.border = "1px solid black";
            button.style.padding = "2px";
            button.style.marginBottom = "3px";
            button.style.width = "13px";
            button.style.height = "14px";
            button.title = "Close";
        }

      
      var map = new GMap2(document.getElementById("map"));
      map.setCenter(new GLatLng(58, 0), 1);
	  map.addControl(new GSmallMapControl());
      //var mapdiv = document.getElementById("map");
      //var mapdiv_children = mapdiv.childNodes;
      //for (var i = 0; i < mapdiv_children.length; i++)
      //{
        //mapdiv_children[i].style.whiteSpace = "normal";
      //}
	  //map.addControl(new CloseButtonControl());
	  //map.addControl(new GMapTypeControl());
	  //map.setMapType(G_SATELLITE_MAP); 
	  
      GDownloadUrl("App_Master/markerdata.xml", function(data) {
        var xml = GXml.parse(data);
        var markers = xml.documentElement.getElementsByTagName("marker");
		for (var i = 0; i < markers.length; i++) {
          var name = markers[i].getAttribute("name");
          var address = markers[i].getAttribute("address");
          var address2 = markers[i].getAttribute("address2");
          var address3 = markers[i].getAttribute("address3");
          var phone = markers[i].getAttribute("phone");
          var tollfree = markers[i].getAttribute("tollfree");
          var fax = markers[i].getAttribute("fax");
          var email = markers[i].getAttribute("email");
          var type = markers[i].getAttribute("type");
		  var img = markers[i].getAttribute("img");
          var latlng = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                                  parseFloat(markers[i].getAttribute("lng")));
          var store = { latlng: latlng, name: name, address: address, address2: address2, address3: address3, phone: phone, tollfree: tollfree, fax: fax, email: email, type: type, img: img };
          var latlngHash = (latlng.lat().toFixed(3) + "" + latlng.lng().toFixed(3));
          latlngHash = latlngHash.replace(".","").replace(".", "").replace("-","");
          if (locations[latlngHash] == null) {
            locations[latlngHash] = []
          }
          locations[latlngHash].push(store);
        }
        for (var latlngHash in locations) {
          var stores = locations[latlngHash];
		  var hq_size = 24;
		  var ofc_size = 24;
		  var hq_color = "#336699";
		  var ofc_color = "#336699";		  
          map.addOverlay(createMarker(stores, hq_size, ofc_size, hq_color, ofc_color));
         }
      });
	    //use style below to overlay judge logo
        //var boundaries = new GLatLngBounds(new GLatLng(42.000000,-123.000000), new GLatLng(48.000000,-107.000000));
        //var logo = new GGroundOverlay("http://www.judge.com/new.net/images/judgelogo2009.gif", boundaries);
        //map.addOverlay(logo);
    }

    function createMarker(stores, hq_size, ofc_size, hq_color, ofc_color) {
      var store = stores[0];
      var directions_address = store.address + ", " + store.address3;
      if (store.type == 'hq') {
	  var newIcon = MapIconMaker.createMarkerIcon({width: hq_size, height: hq_size, primaryColor: hq_color});
	  }
	  else {
      var newIcon = MapIconMaker.createMarkerIcon({width: ofc_size, height: ofc_size, primaryColor: ofc_color});
	  }
	  var marker = new GMarker(store.latlng, { icon: newIcon, title: store.name });
	  var html = "<table><tr><td valign='top' align='left' class='sidetext'><b>" + store.name + "</b><br/>" + store.address + "<br/>";
	  if (store.address2.length > 0) {
		html = html + store.address2 + "<br/>";
	  }
	  html = html + store.address3;
	  html = html + "<br/>Phone: " + store.phone;
	  if (store.tollfree != "") {
	      html = html + "<br/>Toll Free: " + store.tollfree;
	  }
	  html = html + "<br/>Fax: " + store.fax;
	  //html = html + "<br/><a href='mailto:" + store.email + "'>" + store.email + "</a><br/>";
	  html = html + "<br/><b><a href='http://maps.google.com/maps?daddr=" + directions_address + "' target='_blank'>Directions</a></b>";
	  html = html + "</td>";
	  if (store.img.length > 0) {
	      html = html + "<td valign='top'><img src='images/office_images/" + store.img + "' border=0/></td>";
	  }
	  html = html + "</tr></table>";
	  //GEvent.addListener(marker, 'click', function() {
        //marker.openInfoWindowHtml(html);
      //});
      
      // save the info we need to use later for the side_bar
      gmarkers.push(marker);
      return marker;
  }
  // This function picks up the click and opens the corresponding info window
  function myclick(i) {
      GEvent.trigger(gmarkers[i], "click");
  }