// When the window has finished loading create our google map below
google.maps.event.addDomListener(window, 'load', init);

function init() {
    
	var locations = [
        ['<div class="infobox text-center"><h3 class="title">Siège social</h3><span>26, rue Jean Cocteau 306 Résidence Anaxagore - 97490 Sainte-Clotilde</span></div>',  -20.887400, 55.466673 , 1],
        ['<div class="infobox text-center"><h3 class="title">Agence</h3><span>32 Rue du Général de Gaulle - 97438 Sainte Marie</span></div>',  -20.897493, 55.564629 , 2],
    ];

	var map = new google.maps.Map(document.getElementById('google-map'), {
		zoom: 11,
		scrollwheel: false,
		navigationControl: true,
		mapTypeControl: false,
		scaleControl: false,
		draggable: true,
		
		// center: new google.maps.LatLng(-33.890294, 151.274737),
	  mapTypeId: google.maps.MapTypeId.ROADMAP
	});

	var infowindow = new google.maps.InfoWindow();
	var bounds = new google.maps.LatLngBounds(); //centrage auto

	var marker, i;

	for (i = 0; i < locations.length; i++) {  
  
		marker = new google.maps.Marker({ 
			position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
			map: map ,
			icon: 'assets/images/icons/marker.png'
		});
		
		bounds.extend(marker.position);

		google.maps.event.addListener(marker, 'click', (function(marker, i) {
			return function() {
			infowindow.setContent(locations[i][0]);
			infowindow.open(map, marker);
			}
		})(marker, i));
	  
	}
	
	//zoom souhaité + centrage auto
	
	google.maps.event.addListenerOnce(map, 'bounds_changed', function (event) {
		this.setZoom(10);   
	});
	
	
	//centrage auto
	map.fitBounds(bounds); 
	
	
}