var strListeHtml = "<h1> </h1>";
var intCompteur = 0;
var glieu = [];
var strinfo = [];
var strdirection = [];
var bounds = new GLatLngBounds();

function createMarker(point, details, map) {
var marker = new GMarker(point);
var strInfoWindow = "";
var strPhoto = "<img src='" + getNodeValue(details.getElementsByTagName("photo")) + "' width='100' height='100' />";
var strName  = "<h3>" + getNodeValue(details.getElementsByTagName("nom")) + "</h3>";
var strDesc  = "<p>" + getNodeValue(details.getElementsByTagName("description")) + "</p><br />";
//getNodeValue(details.getElementsByTagName("link"))

var strlink  = "<a href='javascript:clkDirection(" + intCompteur +")'>Obtenir le trajet</a>";


strListeHtml  = strListeHtml + "<a href='javascript:clkCarte(" + intCompteur +")'>" + getNodeValue(details.getElementsByTagName("nom")) + "</a><br />";

strinfo[intCompteur] = "<div class='ginfo'>" + strPhoto + strName + strDesc + strlink + "</div>"

strdirection[intCompteur] = '<div class="ginfo"><form action="http://maps.google.com/maps" method="get" target="_blank">' +
						 '<p>Lieu de d&eacute;part : <br /><input type="text" size="40" maxlength="40" name="saddr" id="saddr" /><br />' +
						 '<input value="Obtenir le trajet" type="submit" />' +
						 '<input type="hidden" name="daddr" value="' + getNodeValue(details.getElementsByTagName("gmaploc")) +'" /></p>' +
						 '</form><br><a href="javascript:clkCarte(' + intCompteur + ')">Retour</a></div>';

glieu[intCompteur] = marker;
strInfoWindow = strinfo[intCompteur];

GEvent.addListener(marker, "click", function() {
	marker.openInfoWindowHtml(strInfoWindow);
	//map.setCenter(bounds.getCenter());
	//map.setZoom(map.getBoundsZoomLevel(bounds));

});
intCompteur++;
return marker;
}

function getNodeValue(Element) {
if ((Element.length>0) && Element[0] && Element[0].firstChild && Element[0].firstChild.nodeValue)
   return Element[0].firstChild.nodeValue;
}

function clkCarte(lieu) {
	glieu[lieu].openInfoWindowHtml(strinfo[lieu]);
}

function clkDirection(lieu) {
	glieu[lieu].openInfoWindowHtml(strdirection[lieu]);
}

function init() {
  if (GBrowserIsCompatible()) {
	var mapobj = document.getElementById("gmap");
	var map = new GMap2(mapobj);
	GMap2.prototype.wheelZoom = function(event)
	{ if((event.detail || -event.wheelDelta) < 0)
		{ map.zoomIn();}
	  else
		{ map.zoomOut();}
	 return false;
	}
	GEvent.addDomListener(mapobj, "DOMMouseScroll", map.wheelZoom);
	GEvent.addDomListener(mapobj, "mousewheel", map.wheelZoom);
	map.addControl(new GSmallMapControl());
	map.addControl(new GMapTypeControl());
	map.setCenter(new GLatLng(45.600716,-73.669335), 12);

	GDownloadUrl("xml/gmaps.xml", function(data, responseCode) {
	if(responseCode == 200) {
	  var xml = GXml.parse(data);
	  var markers = xml.documentElement.getElementsByTagName("marker");
	  for (var i = 0; i < markers.length; i++) {
		var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
								parseFloat(markers[i].getAttribute("lng")));
		bounds.extend(point);
		varMarker = createMarker(point,markers[i],map);
		map.addOverlay(varMarker);
	  }
	} else if(responseCode == -1) {
		alert("Data request timed out. Please try later.");
	} else {
		alert("Request resulted in error. Check XML file is retrievable.");
	}
	map.setCenter(bounds.getCenter());
	map.setZoom(map.getBoundsZoomLevel(bounds));
	map.setMapType(G_HYBRID_MAP);

	document.getElementById("liste").innerHTML = strListeHtml;
	});
  }
}
onDOMLoaded(this);