var map;
var infoOpen;
var mapmarkers=new Array();

// Create a base icon for all of our markers that specifies the
// shadow, icon dimensions, etc.
var baseIcon = new GIcon();
baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
baseIcon.iconSize = new GSize(20, 34);
baseIcon.shadowSize = new GSize(37, 34);
baseIcon.iconAnchor = new GPoint(9, 34);
baseIcon.infoWindowAnchor = new GPoint(9, 2);
baseIcon.infoShadowAnchor = new GPoint(18, 25);

var infoWindow=null;

function createMarker(point, index, html, title, marker_url) {
  // Create a lettered icon for this point using our icon class
  var icon = new GIcon(baseIcon);
  icon.image = marker_url;
  var marker = new GMarker(point, {title:title, icon:icon});
  html=html.replace(/&gt;/g,'>');
  html=html.replace(/&lt;/g,'<');

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

  return marker;
}

var baseIcon2 = new GIcon();
baseIcon2.iconSize=new GSize(32,32);
baseIcon2.shadowSize=new GSize(56,32);
baseIcon2.iconAnchor=new GPoint(16,32);
baseIcon2.infoWindowAnchor=new GPoint(16,0);

function bringFront(marker,b) {
	return 100000;
}
	  
function createMarker2(point, index, html, title, marker_url) {
  // Create a lettered icon for this point using our icon class
  var icon = new GIcon(baseIcon2);
  icon.image = marker_url;
  
  var marker = new GMarker(point, {title:title, zIndexProcess:bringFront, icon:icon});
  html=html.replace(/&gt;/g,'>');
  html=html.replace(/&lt;/g,'<');

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

  return marker;
}

function load(min_lat, max_lat, min_longi, max_longi) {
	if (GBrowserIsCompatible()) {
		map = new GMap2(document.getElementById("map"));
		map.addControl(new GSmallMapControl());
		map.addControl(new GMapTypeControl());
		map.setCenter(new GLatLng((max_lat+min_lat)/2, (max_longi+min_longi)/2) ,
						map.getBoundsZoomLevel(new GLatLngBounds(new GLatLng(min_lat, min_longi),new GLatLng(max_lat, max_longi))));
		map.enableContinuousZoom();
		infoOpen=false;
		refreshMap();
	}
}

function showWaitMessage() {
	var message_div = document.getElementById("message_div");
	var google_map = document.getElementById("map");
	if (message_div != null && google_map != null) {
		message_div.innerHTML = "<img src=\"/images/public/loading.gif\"/> Veuillez patienter";
		google_map.appendChild(message_div);
		message_div.style.zIndex = parseInt(google_map.style.zIndex + 1);
		message_div.style.position = 'absolute';
		message_div.style.top = ((google_map.offsetHeight - message_div.offsetHeight) / 2) + "px";
		message_div.style.left = ((google_map.offsetWidth - message_div.offsetWidth) / 2) + "px";
		message_div.style.visibility = 'visible';
	}
}
function hideWaitMessage() {
	var message_div = document.getElementById("message_div");
	if (message_div != null) {
		message_div.style.zIndex = 0;
		message_div.style.visibility = 'hidden';
	}
}

function refreshMap() {
	map.closeInfoWindow();

	currentquery = document.getElementById('CATEGORIE').value;
	currentregion = document.getElementById('REGION').value;
	currentclangue = document.getElementById('CLANGUE').value;
	showWaitMessage();
	map.clearOverlays();

	var bounds = map.getBounds();
	if (currentquery > 0) {
	//  GDownloadUrl('/tourisme/xmlch.php?QUERY='+currentquery+'&CLANGUE='+currentclangue+'&REGION='+currentregion+'&MIN_LAT='+bounds.getSouthWest().lat()+'&MIN_LONGI='+bounds.getSouthWest().lng()+'&MAX_LAT='+bounds.getNorthEast().lat()+'&MAX_LONGI='+bounds.getNorthEast().lng()+'&LAT=<?= $LAT ?>&LONGI=<?= $LONGI ?>',
	  GDownloadUrl('/tourisme/xmlch.php?CATEGORIE='+currentquery+'&CLANGUE='+currentclangue+'&REGION='+currentregion,
			function(data, responseCode) {
					
				var xml = GXml.parse(data);
				var markers = xml.documentElement.getElementsByTagName("marker");
				//      mapmarker.length = 0;

				//      for (var i=0; i<markers.length; i++)
				//       if (currentOverlay!=markers[i]) map.removeOverlay(markers[i]);


				for (var i = 0; i < markers.length; i++) {
					var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
											parseFloat(markers[i].getAttribute("lng")));
					mapmarkers[i]=createMarker(point, i, '<h5>'+markers[i].getAttribute("title")+ '</h5><table width="300px" height="200px"><tr><td><img src="'+markers[i].getAttribute("photo_url")+'" /></td><td><small>'+markers[i].getAttribute("description")+' <a href="'+markers[i].getAttribute("url")+'">MORE &gt;&gt;&gt;</small></td></tr></table>' , markers[i].getAttribute("title"), markers[i].getAttribute("marker_url"));
					map.addOverlay(mapmarkers[i],{zIndexProcess:1}); //'marker :<b>'+i+'</b>'));
						//        html = html + '<li><a onclick="this.blur();return openInfoWindow(\'A\');" href="'+markers[i].getAttribute("url")+'" >'+markers[i].getAttribute("title")+'</a>  <a href="'+markers[i].getAttribute("url")+'">Plus d\'info</a></li>';
					
				}


				var point = new GLatLng(50.446608, 5.962754);
				mapmarkers_circuit=createMarker2(point, i, '<h5>Le circuit de Spa-Francorchamps</h5>', 'Le circuit de Spa-Francorchamps', "http://maps.google.com/mapfiles/kml/pal4/icon17.png");
				map.addOverlay(mapmarkers_circuit,{zIndexPr:10000});
				
	
				var result = document.getElementById("result");

				var responses = xml.documentElement.getElementsByTagName("response");

				result.innerHTML = '<h4>'+responses[0].getAttribute("message")+'</h4>';

				hideWaitMessage();
			}
		)
	} else {
	 	hideWaitMessage();
	}
}
