locator.js

$().ready(function() {

  // search address and get latitude/longitude
  var searchLocations = function(e) {
    var $form = $(this);
    var address = $('input#address').val();
    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({address: address}, function(results, status) {
      if (status === google.maps.GeocoderStatus.OK) {
        var center = results[0].geometry.location;
        $('input#latitude').val(center.lat());
        $('input#longitude').val(center.lng());
        searchLocationsNear($form);
      } else {
        alert(address + ' not found');
      }
    });
    return false;
  };

  // do ajax search
  var searchLocationsNear = function($form) {
    $.ajax({
      url:     $form.attr('action') + '?sf_format=json',
      data:    $form.serializeArray(),
      success: showEntries
    });
  };

  // show found items after ajax search
  var showEntries = function(res) {
    var i;
    for (i = 0; i < markers.length; i ++) {
      markers[i].setMap(null);
    }
    markers.length = 0;
    var bounds = new google.maps.LatLngBounds();
    var $sidebar = $('div#sidebar');
    $sidebar.empty();
    if (res.length === 0 || !res[0].name) {
      $sidebar.text('Nessun risultato trovato');
      map.setCenter(new google.maps.LatLng(42, 12));
      map.setZoom(6);
    } else {
      $.each(res, function(i, r) {
        var latlng = new google.maps.LatLng(parseFloat(r.lat), parseFloat(r.lng));
        var m = createMarker(latlng, r.name, r.address, r.city);
        createSidebarEntry($sidebar, m, r.name, r.address, r.city, parseFloat(r.distance));
        bounds.extend(latlng);
        map.fitBounds(bounds);
      });
    }
  };

  // create entry in sidebar for each found item
  var createSidebarEntry = function($sidebar, marker, name, address, city, distance) {
    var $div = $('<div class="item">');
    $div.append(name);
    $div.append(' (' + distance.toFixed(1) + 'km) ');
    $div.append('<br />' + address + ' ' + city);
    $div.click(function() {
      google.maps.event.trigger(marker, 'click');
    });
    $sidebar.append($div);
  };

  // create marker for each found item
  var createMarker = function(latlng, name, address, city) {
    var html = '<div class=balloon"><strong>' + name + '</strong><br />' + address + ' ' + city + '</div>';
    var marker = new google.maps.Marker({
      map:      map,
      position: latlng
    });
    google.maps.event.addListener(marker, 'click', function() {
      infoWindow.setContent(html);
      infoWindow.open(map, marker);
    });
    markers.push(marker);
    return marker;
  };

  // ------------------------------------------------------------------------- //

  var markers = [];

  // init map
  var map = new google.maps.Map(document.getElementById('gmap'), {
    center: new google.maps.LatLng(42, 12),
    zoom: 6,
    mapTypeId: 'roadmap',
    mapTypeControlOptions: { style: google.maps.MapTypeControlStyle.DROPDOWN_MENU }
  });
  var infoWindow = new google.maps.InfoWindow();

  // item search
  $('form#myform').submit(searchLocations);

});