google.load('maps', '2'); // Load version 2 of the Maps API

google.setOnLoadCallback(showMap);

// SHOW MAP
function showMap() {

	var bounds = new google.maps.LatLngBounds();

	// add new
	var map = new GMap2(document.getElementById("map"));

	map.addMapType(G_PHYSICAL_MAP); 

	// add controls
	map.addControl(new google.maps.LargeMapControl());
    // map.addControl(new google.maps.MapTypeControl());
    map.enableContinuousZoom();
    map.enableScrollWheelZoom();
    
	// set center
	map.setCenter(
		new google.maps.LatLng(43.834526782236814, -37.265625), 3, G_PHYSICAL_MAP
	);

	// make array
	var markers = [];

	//	grounds data already loaded from map-grounds-json.php
	for (var i=0; i<grounds.length; i++) {
		var point = new GLatLng(grounds[i].lat, grounds[i].lng);
		var html = "<p>" + grounds[i].title + "</p>";
		var marker = addMarker(point, html);
		markers.push(marker);
		map.addOverlay(marker);
		bounds.extend(point);
	}


	// set bounds
	map.setZoom(map.getBoundsZoomLevel(bounds));
	map.setCenter(bounds.getCenter());

	// save position so that centre button return to initial view
	map.savePosition();

	var markerCluster = new MarkerClusterer(map, markers);

}

// CREATE MARKER
function addMarker(point, html) {

	// MAKE ICON
	var icon = new GIcon();
	icon.image = "/wp-content/themes/fussballburo/img/map-icon.png";
	icon.shadow = "/wp-content/themes/fussballburo/img/map-icon-shadow.png";
    icon.iconSize = new GSize(9.0, 14.0);
    icon.shadowSize = new GSize(17.0, 14.0);
    icon.iconAnchor = new GPoint(4.0, 7.0);
    icon.infoWindowAnchor = new GPoint(4.0, 7.0);

	var marker = new GMarker(point, icon);

	GEvent.addListener(marker, "click", function() {
	  marker.openInfoWindowHtml(html);
	});

	return marker;
}