// JavaScript Document
    var map;
    var geocoder;
	var sidebarEntry = new Array();
	var postalCode = queryString('postalcode');
	
	if(postalCode == false || postalCode == null || postalCode==0 || postalCode == ''){
		postalCode = "";
	}

    function init() {
      if (GBrowserIsCompatible()) {
        geocoder = new GClientGeocoder();
        map = new GMap2(document.getElementById('map'));
        map.addControl(new GLargeMapControl());
        map.addControl(new GMapTypeControl());
        map.setCenter(new GLatLng(37, -95), 3);
		document.getElementById('addressInput').value = postalCode;
		if (postalCode != "") {
		    searchLocationsNear(postalCode);
		}		
      }
    }

   function searchLocationsNear() {
     var radius = document.getElementById('radiusSelect').value;
	 var postalcode = document.getElementById('addressInput').value;
	 var searchUrl = 'locations.ashx?postal_code='+postalcode+'&radius='+radius;
     
	 GDownloadUrl(searchUrl, function(data) {
       var xml = GXml.parse(data);
       var markers = xml.documentElement.getElementsByTagName('marker');
       map.clearOverlays();

       var sidebar = document.getElementById('sidebar');
       sidebar.innerHTML = '';
       if (markers.length == 0) {
        sidebar.innerHTML = '<strong>Please enter a Postal/Zip Code.</strong>';
        map.setCenter(new GLatLng(37, -95), 3);
        return;
       }

       var bounds = new GLatLngBounds();
       for (var i = 0; i < markers.length; i++) {
         var name = markers[i].getAttribute('name');
         var address = markers[i].getAttribute('address');
         var distance = parseFloat(markers[i].getAttribute('distance'));
         var point = new GLatLng(parseFloat(markers[i].getAttribute('lat')),
                                             parseFloat(markers[i].getAttribute('lng')));
		 if(markers[i].getAttribute('phone') != null){
	         var phone = markers[i].getAttribute('phone');
		 }else{
			var phone = ''; 
		 }
         var marker = createMarker(point, name, address, phone);
         map.addOverlay(marker);
		 sidebarEntry[i] = createSidebarEntry(marker, name, address, phone, distance);
         bounds.extend(point);
       }
	   
		for(var i = 0; i < sidebarEntry.length; i++){
			sidebar.appendChild(sidebarEntry[i]);
		}
		
       map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));
	   
     });
   }

    function createSidebarEntry(marker, name, address, phone, distance) {
      var div = document.createElement('div');
	  var html = '<div style="max-width:200px; padding: 0 0 15px 0;  font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;line-height:16px;">'+
		'<div id="name" style="font-weight:bold; font-size:12px;">'+name+'</div>'+
    	'<div id="dist" style="font-weight:bold;">Distance: '+distance.toFixed(1)+' mi</div>'+
	    '<div id="address">'+address.split(',')[0] +'<br/>'+address.split(',')[1]+', '+address.split(',')[2]+'</div>'+
	    '<div id="tele">'+phone+'</div>'+
	    '<div id="mapIt" style="color:#CC6600; text-decoration:underline;border-bottom:thin solid #999;padding:0 0 5px 0;">Show on map</div>'+
		'</div>';
      div.innerHTML = html;
      div.style.cursor = 'pointer';
      GEvent.addDomListener(div, 'click', function() {
        GEvent.trigger(marker, 'click');
      });
      return div;
    }
	
    function createMarker(point, name, address, phone) {
      var marker = new GMarker(point);
	  var div = document.createElement('div');
	  var html = '<div style=" font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;line-height:16px; text-align:right; padding-top:10px;">'+
		'<div id="name" style="font-weight:bold; font-size:12px;">'+name+'</div>'+
	    '<div id="address">'+address.split(",")[0] +'<br/>'+address.split(",")[1]+', '+address.split(",")[2]+'</div>'+
	    '<div id="tele">'+phone+'</div>'+
		'</div>'+
	   	'<div id="dir" style="text-align:left; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;line-height:12px; padding-top:10px;"><b>Get Directions:<br />'+
    	'<span style="font-size:9px;color:#333;">Start Address:</span><br />'+
		'<input type="hidden" id="to" value="' + address + '"/>'+
		'<input type="text" id="from" value=""/>'+
		'<input type="button" onclick="getDirections(document.getElementById(\'to\').value,document.getElementById(\'from\').value)" value="GO"/></div>'
      div.innerHTML = html;
      GEvent.addListener(marker, 'click', function() {
        marker.openInfoWindowHtml(div);
      });
      return marker;
    }

	function getDirections(toAddy, fromAddy){
	 var goTo = toAddy.replace(/ /g,"+");
	 var goFrom = fromAddy.replace(/ /g,"+");
		window.location.href= "directions.aspx?to="+goTo+"&from="+goFrom;
	}
	
	
	
	window.onload = init;
	window.onunload = GUnload;