/**
 * A distance widget that will display a circle that can be resized and will
 * provide the radius in km.
 *
 * @param {Object} opt_options Options such as map, position etc.
 *
 * @constructor
 */
function DistanceWidget(opt_options) {
  var options = opt_options || {};

  this.setValues(options);

  if (!this.get('position')) {
    this.set('position', map.getCenter());
  }

  // Add a marker to the page at the map center or specified position
  var marker = new google.maps.Marker({
    draggable: false
  });

  marker.bindTo('map', this);
  marker.bindTo('zIndex', this);
  marker.bindTo('position', this);
  marker.bindTo('icon', this);

  // Create a new radius widget
  var radiusWidget = new RadiusWidget(options['distance'] || 50);

  // Bind the radius widget properties.
  radiusWidget.bindTo('center', this, 'position');
  radiusWidget.bindTo('map', this);
  radiusWidget.bindTo('zIndex', marker);
  radiusWidget.bindTo('maxDistance', this);
  radiusWidget.bindTo('minDistance', this);
  radiusWidget.bindTo('color', this);
  radiusWidget.bindTo('activeColor', this);
  radiusWidget.bindTo('sizerIcon', this);
  radiusWidget.bindTo('activeSizerIcon', this);

  // Bind to the radius widget distance property
  this.bindTo('distance', radiusWidget);
  // Bind to the radius widget bounds property
  this.bindTo('bounds', radiusWidget);

}
DistanceWidget.prototype = new google.maps.MVCObject();


/**
 * A radius widget that add a circle to a map and centers on a marker.
 *
 * @param {number} opt_distance Optional starting distance.
 * @constructor
 */
function RadiusWidget(opt_distance) {
  var circle = new google.maps.Circle({
    strokeWeight: 2
  });

  this.set('distance', opt_distance);
  this.set('active', false);
  this.bindTo('bounds', circle);

  circle.bindTo('center', this);
  circle.bindTo('zIndex', this);
  circle.bindTo('map', this);
  circle.bindTo('strokeColor', this);
  circle.bindTo('radius', this);

  //this.addSizer_();
}
RadiusWidget.prototype = new google.maps.MVCObject();



/**
 * Update the radius when the distance has changed.
 */
RadiusWidget.prototype.distance_changed = function() {
  this.set('radius', this.get('distance') * 1000);
};


//http://maps.google.fr/maps?q=Pithiviers-le-Vieil&hl=fr&sll=46.75984,1.738281&sspn=13.836676,33.815918&vpsrc=0&hnear=Pithiviers-le-Vieil,+Loiret,+Centre&t=h&z=13&iwloc=A
//http://maps.google.fr/maps?f=q&source=s_q&hl=fr&geocode=&q=Pithiviers-le-Vieil&aq=0&sll=46.75984,1.738281&sspn=13.836676,33.815918&vpsrc=0&ie=UTF8&hq=&hnear=Pithiviers-le-Vieil,+Loiret,+Centre&ll=48.167116,2.205677&spn=0.105217,0.264187&t=m&z=13&iwloc=A
/////////////////
var distanceWidget;
var map;
var geocodeTimer;
var profileMarkers = [];

function init() {
  var mapDiv = document.getElementById('map');
  map = new google.maps.Map(mapDiv, {
    center: new google.maps.LatLng(48.167116,2.205677),
    zoom: 8,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  });

  distanceWidget = new DistanceWidget({
    map: map,
    distance: 80, // Starting distance in km.
    maxDistance: 80, // Twitter has a max distance of 2500km.
    color: '#000000',
    activeColor: '#5599bb'
  });

}

//google.maps.event.addDomListener(window, 'load', init);