var map = null;
    var geocoder = null;

    var directionsPanel;
    var directions;
     var country="";
    // this variable will collect the html which will eventually be placed in the side_bar
      var side_bar_html = "";
    
      // 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 zoomable=true;
      var lastlinkid;


    var http_request = false;
   function makeRequest(url, parameters) {

      http_request = false;
      if (window.XMLHttpRequest) { // Mozilla, Safari,...
         http_request = new XMLHttpRequest();
        
         if (http_request.overrideMimeType) {
            http_request.overrideMimeType('text/xml');
         }
      } else if (window.ActiveXObject) { // IE
         try {
            http_request = new ActiveXObject("Msxml2.XMLHTTP");
         } catch (e) {
            try {
               http_request = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {}
         }
      }
      if (!http_request) {
         alert('Cannot create XMLHTTP instance');
         return false;
      }
      http_request.onreadystatechange = processXML;
      http_request.open('GET', url + parameters, true);
             
      http_request.send(null);
   }


    function initialize() {
           
      if (GBrowserIsCompatible()) {


        map = new GMap2(document.getElementById("map_canvas"), {draggableCursor:
'default', draggingCursor: 'default', backgroundColor: '#FFFFFF'});
        map.setCenter(new GLatLng(37.4419, -122.1419), 1);
        map.setMapType(G_HYBRID_MAP); 
        var mapControl = new GMapTypeControl();
          map.addControl(mapControl);
          map.addControl(new GLargeMapControl());     
        geocoder = new GClientGeocoder();            

          directionsPanel=document.getElementById("directionsDiv");
          directions = new GDirections(map, directionsPanel);
         GEvent.addListener(map,"click", function(overlay,latlng) {
          if (latlng) {
                map.setCenter(latlng, map.getZoom()+2);
          }
  
        }); 
         //GEvent.addListener(map,'moveend',function() {
    //updateMarkers();
//});

GEvent.addListener(map,'zoomend',function() {
    updateMarkers();
});


      }
    }
function resetDropDown(){
              document.addr.rad.selectedIndex=0;
        }
    function setMarkers(lat, lng) {
       zoomable=false;
        var address = document.getElementById("address");   
         
        var request = GXmlHttp.create();
         gmarkers = [];
        document.getElementById("side_bar").innerHTML = "";
        document.getElementById("directionsDiv").innerHTML = "";
          side_bar_html="";
          map.clearOverlays();
var getVars = "?lat=" + lat + "&lng=" + lng + "&radius=" + document.addr.rad.options[document.addr.rad.selectedIndex].value + "&country=" + country;

request.open("GET", "q.php" + getVars, true);
request.onreadystatechange = function() {
     if(request.readyState == 4) {
                      if (request.status == 200) {

                    map.setZoom(11);
                  map.clearOverlays();
            var xmlDoc = GXml.parse(request.responseText);
              
            var bounds = new GLatLngBounds();
            
             var markers = xmlDoc.getElementsByTagName("marker");

             for (var i=0; i<markers.length; i++) {
                         
                      var lat= parseFloat(GXml.value(markers[i].getElementsByTagName("latitude")[0]));
                       var lng = parseFloat(GXml.value(markers[i].getElementsByTagName("longitude")[0]));
                       var latlng = new GLatLng(lat,lng);
                     
var nameString = GXml.value(markers[i].getElementsByTagName("name")[0]);
var addrString = GXml.value(markers[i].getElementsByTagName("address")[0]);
var phoneString = GXml.value(markers[i].getElementsByTagName("phone")[0]);
var emailString = GXml.value(markers[i].getElementsByTagName("email")[0]);
var urlString = GXml.value(markers[i].getElementsByTagName("url")[0]);
var miscString = GXml.value(markers[i].getElementsByTagName("misc")[0]);

                                              
                    html ="<b>" + nameString + "<\/b><br\/>" + addrString + "<br\/>Phone: " + phoneString + "<br\/>" + emailString + "<br\/>";
                    if(urlString != "(none)"){
                     html += "<a href=\"http://"+urlString+"\">" + urlString + "<br\/>";
                     }

                    html += "<a href=\"javascript:getDirectionsTo(" + lat + "," + lng + ")\">" + "Directions to here" + "<\/a><br\/>";
                     if(i==0){
                       html+= "<a href=\"javascript:getWalkingDirectionsTo(" + lat + "," + lng + ")\">" + "Walk or bike here" + "<\/a><br\/>";
                       }
                       var marker = createMarker(latlng, nameString, html);
                       bounds.extend(latlng);

                             
                       map.addOverlay(marker);
                 
                }//for
                 var zLevel=(map.getBoundsZoomLevel(bounds)>15)?12:map.getBoundsZoomLevel(bounds);
                 
                        
                map.setZoom(zLevel+1); 
                
                map.setCenter(bounds.getCenter());
                
                myclick(0);
                zoomable=true;
               } //status
            }//readyState
        

       }//function
    // }
       request.send(null);


 }
function updateMarkers() {
curZoom = map.getZoom();

 // alert("Zoom: " + curZoom);
 if(zoomable && curZoom > 4 && curZoom < 8) {
    zoomable=false;
    //remove the existing points
    map.clearOverlays();

       gmarkers = [];
        document.getElementById("address").value="";
        resetDropDown();
        document.getElementById("side_bar").innerHTML = "";
        document.getElementById("directionsDiv").innerHTML = "";
          side_bar_html="";
    //create the boundary for the data
    var bounds = map.getBounds();
    var southWest = bounds.getSouthWest();
    var northEast = bounds.getNorthEast();
    var center_Lat = bounds.getCenter().lat();
    var center_Lng = bounds.getCenter().lng();
     //setMarkers(bounds.getCenter().lat(), bounds.getCenter().lng());

    var getVars = 'ne=' + northEast.toUrlValue() + '&sw=' + southWest.toUrlValue() + '&lat=' + center_Lat + '&lng=' + center_Lng;
    //log the URL for testing
    //GLog.writeUrl('server.php?'+getVars);
    //retrieve the points using Ajax
     // alert(getVars);
    var request2 = GXmlHttp.create();
    request2.open('GET', 'server.php?'+getVars, true);
    request2.onreadystatechange = function() {
         if (request2.readyState == 4) {
            
              //var jscript = request.responseText;
              //var points;
              //eval(jscript);


              
             if (request2.status == 200) {
                  //alert("request complete");
                   // map.setZoom(11);
                  
            var xmlDoc2 = GXml.parse(request2.responseText);
              
            var boundsX = new GLatLngBounds();
            
            var markers = xmlDoc2.getElementsByTagName("marker");

             for (var i=0; i<markers.length; i++) {
                         
                      var lat= parseFloat(GXml.value(markers[i].getElementsByTagName("latitude")[0]));
                       var lng = parseFloat(GXml.value(markers[i].getElementsByTagName("longitude")[0]));
                       var latlng = new GLatLng(lat,lng);
                     
var nameString = GXml.value(markers[i].getElementsByTagName("name")[0]);
var addrString = GXml.value(markers[i].getElementsByTagName("address")[0]);
var phoneString = GXml.value(markers[i].getElementsByTagName("phone")[0]);
var emailString = GXml.value(markers[i].getElementsByTagName("email")[0]);
var urlString = GXml.value(markers[i].getElementsByTagName("url")[0]);
var miscString = GXml.value(markers[i].getElementsByTagName("misc")[0]);

                                              
                    html ="<b>" + nameString + "<\/b><br\/>" + addrString + "<br\/>Phone: " + phoneString + "<br\/>" + emailString + "<br\/>";
                    if(urlString != "(none)"){
                     html += "<a href=\"http://"+urlString+"\">" + urlString + "<br\/>";
                     }

                    
                       var marker = createMarker(latlng, nameString, html);
                       //bounds.extend(latlng);

                             
                       map.addOverlay(marker);
                 
                }//for
                
               

               zoomable=true;
               myclick(0);
            }//request.status
            
        }//request.readyState
    }//onReadyStateChange
     
    request2.send(null);
  }//if

}

 function getDirectionsTo(endLat, endLng) {
                   document.getElementById("directionsDiv").innerHTML = "";
                   var startAddress = document.getElementById("address").value;
                   var directionString = "from: " + startAddress + " to: " + endLat + ", " + endLng;
                   directions.load(directionString);
        }
  function getWalkingDirectionsTo(endLat, endLng) {
                   document.getElementById("directionsDiv").innerHTML = "";
                   var startAddress = document.getElementById("address").value;
                   var directionString = "from: " + startAddress + " to: " + endLat + ", " + endLng;
                   directions.load(directionString, {travelMode:G_TRAVEL_MODE_WALKING});
        }
 function createMarker(point, nameString, html) {

        var marker = new GMarker(point);
        var linkid = "link"+(gmarkers.length);
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
          document.getElementById(linkid).style.background="#ffff00";
          lastlinkid=linkid;
        });
        // 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 += "<div id=\""+linkid+"\"><a href=\"javascript:myclick(" + (gmarkers.length-1) + ")\">" + "&raquo; " + nameString + "<\/a><br\/><\/div>";
             // put the assembled side_bar_html contents into the side_bar div
      document.getElementById("side_bar").innerHTML = side_bar_html;
        return marker;

      }

      function myclick(i) {
        GEvent.trigger(gmarkers[i], "click");
        
      }
    function getCountry(response) {
       var place = response.Placemark[0];
       country = place.AddressDetails.Country.CountryName;
       
    }
    function showAddress(address) {
          
      if (geocoder) {
         geocoder.getLocations(address, getCountry);
        geocoder.getLatLng(
          address,
          function(point) {
            if (!point) {
              alert(address + " not found");
            } else {
               map.clearOverlays();
              map.setCenter(point, 13);
              
              var marker = new GMarker(point);
              map.addOverlay(marker);
              marker.openInfoWindowHtml(address);
              setMarkers(point.lat(), point.lng());
              GEvent.addListener(map,"infowindowclose", function() {
        document.getElementById(lastlinkid).style.background="#ffffff";
      });


                      
     

            }
          }
        );
      }
      else {
        alert("no geocoder");
        }
    }