var map = null;
    var zoomLevel = 3;
    var timerValue = 400;
    var directionsPanel;
    var directions;
    var baseIcon = null;
    var gmarkers = [];
    var to_htmls = [];
    var from_htmls = [];
    var htmls = [];
    var curr_location = "canada";
    var showAll = false;
    
    function load() {

        if (zoomCity == "True") 
        { 
            curr_location = city +", " +province +" " +country;
            zoomLevel = 11; 
        }
        else if (zoomProvince == "True") 
        { 
            curr_location = province +" " +country;
            zoomLevel = 5; 
        }
        else
        {
            showAll = true;
        }

      if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("map"));
        map.enableScrollWheelZoom();
        directionsPanel = document.getElementById("directions");
        setCenter(curr_location);
        map.addControl(new GLargeMapControl());
        map.addControl(new GMapTypeControl());
        
        // Create a base icon for all of our markers that specifies the
        // shadow, icon dimensions, etc.
        baseIcon = new GIcon();
        baseIcon.image = "../images/Mox_Gmaps_icon.png";
        baseIcon.shadow = "../images/Mox_Gmaps_icon_shadow2.png";
        baseIcon.iconSize = new GSize(43, 47);
        baseIcon.shadowSize = new GSize(43, 43);
        baseIcon.iconAnchor = new GPoint(18, 38);
        baseIcon.infoWindowAnchor = new GPoint(9, 2);
        baseIcon.infoShadowAnchor = new GPoint(18, 25);
        
        GDownloadUrl("XmlStoreLocations.aspx?city="+city+"&province="+province+"&country="+country+"&countryShort="+countryShort+"&showAll="+showAll, function(data, responseCode)
        {
          // To ensure against HTTP errors that result in null or bad data,
          // always check status code is equal to 200 before processing the data
          if(responseCode == 200) {
            var xml = GXml.parse(data);
            var markers = xml.documentElement.getElementsByTagName("location");
            
            for (var i = 0; i < markers.length; i++) {
              var locationId = markers[i].getAttribute("locationId");
              var name = markers[i].getAttribute("name");
              var address = markers[i].getAttribute("address"); 
              var city = markers[i].getAttribute("city");  
              var province = markers[i].getAttribute("province");    
              var postal = markers[i].getAttribute("postal");
              var country = markers[i].getAttribute("country");                         
              var phone = markers[i].getAttribute("phone");
              var html = "<div id='info-window'><b>" +name +"</b><br/>" 
                         +"<table><tr><td>"
                         +address +"<br/>" 
                         +city +", " +province +" " +postal +", " +country +"<br/>" 
                         +phone +"<br><a href='http://www.moxies.ca'>moxies.ca</a></td>"
                         +"<td><img src='../images/moxies.jpg' /></td></tr></table>";
              //createMarker(address +" " +city +" " +province, i, html);
            // Request the Geo-Coding Service after a regular interval of time, to prevent 500 error code
            
            // hack to solve google point location if postal code is used in the search
            if(city == "Newmarket"){
                postal = "";
            }
            setTimeout("createMarker(\""+address+" "+city+" " +province+" "+postal+" "+country+"\", '"+i+"', \""+html+"\");", timerValue * i);              
            }
          } else if(responseCode == -1) {
            alert("Data request timed out. Please try later.");
          } else { 
            alert("Request resulted in error. Check XML file is retrievable.");
          }
        });
      }
    }        
        
    function hideOverlays()
    {
        for (var i = 0; i < gmarkers.length; i++)
        {
            gmarkers[i].hide();
            gmarkers[i].closeInfoWindow();
        }
    }
    
    function setCenter(location)
    {
        var geocoder = new GClientGeocoder();
        geocoder.getLatLng(location, 
            function(point) {
                if (!point) {
                    alert(address +" not found");
                }
                else {
                    map.setCenter(point, zoomLevel);
                }
            }
        );
    }
    
    function resetMap()
    {
        if (directions) directions.clear();
        setCenter(curr_location);
        map.setMapType(G_NORMAL_MAP);
        for (var i = 0; i < gmarkers.length; i++)
        {
            gmarkers[i].show();
            gmarkers[i].closeInfoWindow();
        }        
    }        
        
    function getDirections(from, to)
    {
        hideOverlays();
        directions = new GDirections(map, directionsPanel);
        directions.load("from: " +from +" to: " +to);
    }        
        
    // Creates a marker whose info window displays the location info
    function createMarker(address, index, html) {
      var geocoder = new GClientGeocoder();

      geocoder.getLatLng(address, 
        function(point) {
            if (!point) {
                //alert(address +" not found");
            }
            else {
                var marker = new GMarker(point, baseIcon);
                map.addOverlay(marker);
                
                // The info window version with the "to here" form open
                to_htmls[index] = html + '<br>Directions: <b>To here</b> - <a href="javascript:fromhere('+ index + ')">From here</a>' +
                   '<br>Start address:<form>' +
                   '<input type="text" SIZE=30 MAXLENGTH=48 name="saddr" id="saddr" value="" />' +
                   '<INPUT value="Go" TYPE="button" name="submit" onclick="getDirections(saddr.value, \'' +address +'\')" /><br>' +
                   '<a href="javascript:openInfoWindow(' +index + ')">< Back</a>'; +
                   '</form></div>';
                
                // The info window version with the "from here" form open
                from_htmls[index] = html + '<br>Directions: <a href="javascript:tohere(' + index + ')">To here</a> - <b>From here</b>' +
                   '<br>End address:<form>' +
                   '<input type="text" SIZE=30 MAXLENGTH=48 name="daddr" id="daddr" value="" />' +
                   '<INPUT value="Go" TYPE="button" name="submit" onclick="getDirections(\'' +address +'\', daddr.value)" /><br>' +
                   '<a href="javascript:openInfoWindow(' +index + ')">< Back</a>'; +
                   '</form></div>';
                
                html = html + '<br/>Directions: <a href="javascript:tohere('+index+')">To here</a> - <a href="javascript:fromhere('+index+')">From here</a></div>';
                htmls[index] = html;
                gmarkers[index] = marker;
                
                GEvent.addListener(marker, "click", function() {
                    marker.openInfoWindowHtml(html);          
                });
            }
        }
      );
    }  
    
    function openInfoWindow(i) {
        gmarkers[i].openInfoWindowHtml(htmls[i]);
    }
    
    // functions that open the directions forms
    function tohere(i) {
        gmarkers[i].openInfoWindowHtml(to_htmls[i]);
    }
    function fromhere(i) {
        gmarkers[i].openInfoWindowHtml(from_htmls[i]);
    }