var waitingData = true;

// on a read/write map we must use overlays to calculate distances. Also this method doesn't work if several routes are displayed on the same map
function addTrajetInfos(map, directions, componentId, useOverlays) {
	trajetLength = 0;
	
	// Directions Info
	function DirectionsInfo(directions, componentId) {
		var getTextFromDistance = function (meters) {
			// Consommation (l/100km)
			var consoMoyenne = 7;
			// Emission de CO2 (g/km)
			var emissionMoyenne = 150;
			
			var consommation = Math.round(10 * meters * consoMoyenne / 100000) / 10;
			
			var co2 = 150 * meters / 1000;
			var br = '<br/>'; 
			
			if(co2 > 1000) {
				var co2texte = (co2 / 1000).toPrecision(3) + " kg";
			} else {
				var co2texte = co2.toPrecision(3) + " g";
			}
			co2texte = "Emission de CO<sub>2</sub> : " + co2texte;
			var distanceTexte = "Distance : " + Math.round(meters/100)/10 + " km";
			var consommationTexte = "Consommation : " + consommation + " l"
		
			return "<b>Trajet actuel</b>" + br + distanceTexte + br + consommationTexte + br + co2texte;
		}
		
		loadDirectionUpdate = function () {
			var info = document.getElementById(componentId+"info");
			if (info) {
				info.innerHTML = getTextFromDistance(directions.getDistance().meters);
				if (waitingData) {
					waitingData = false;
					jQ('#' + componentId + 'frame').show();
				}
			}
		}
		
		addoverlayUpdate = function(overlay) {
			if (overlay.getLength) { 
				trajetLength += overlay.getLength();
				var info = document.getElementById(componentId + "info");
				if (info) {
					info.innerHTML = getTextFromDistance(trajetLength);
					if (waitingData) {
						waitingData = false;
						jQ('#' + componentId + 'frame').show();
					}
				}
			}
		}
		
		removeoverlayUpdate = function(overlay) {
			if (overlay.getLength) {
				trajetLength -= overlay.getLength();
				var info = document.getElementById(componentId + "info");
				if (info) {
					info.innerHTML = getTextFromDistance(trajetLength);
				}
			}
		}
		
		if (useOverlays) {
			GEvent.addListener(map, "addoverlay", addoverlayUpdate);
			GEvent.addListener(map, "removeoverlay", removeoverlayUpdate);
		} else {
			GEvent.addListener(directions, "load", loadDirectionUpdate);
		}
	}
	
	DirectionsInfo.prototype = new GControl();
	
	DirectionsInfo.prototype.initialize = function(map) {
		waitingData = true;
		
		container = document.getElementById(componentId);
		if (!container) {
			container = document.createElement('div');
			container.id = componentId;
		}
	
		infoImg = document.getElementById(componentId+'showRouteInformation');
		if (!infoImg) {
			infoImg = document.createElement('img');
			infoImg.id = componentId + 'showRouteInformation';
		}
		
		infoImg.title = 'Afficher des informations sur le trajet';
		infoImg.src = contextPath + '/common/img/pictos/information.png';
		infoImg.style.cursor = "pointer";
		
		jQ(infoImg).click(function () {
			jQ([frame, infoImg]).toggle('normal');
		});
		
		container.appendChild(infoImg);
	
		frame = document.getElementById(componentId + 'frame');
		if (!frame) {
			frame = document.createElement('div');
			frame.id = componentId + 'frame';
		}
		
		// Informations sur le trajet
		routeInfo = document.getElementById(componentId + 'info');
		if (!routeInfo) {
			routeInfo = document.createElement('div');
			routeInfo.id = componentId + 'info';
		}
		
		this.setStyle_(routeInfo);
		frame.appendChild(routeInfo);
		
		closeButton = document.getElementById(componentId + 'closeButton');
		if (!closeButton) {
			closeButton = document.createElement('img');
			closeButton.id = componentId + 'closeButton';
		}
		
		closeButton.title = "Masquer les informations sur le trajet";
		closeButton.src = contextPath + '/common/img/pictos/close.gif';
		closeButton.style.position = 'absolute';
		closeButton.style.left = '185px';
		closeButton.style.top = '4px';
		closeButton.style.cursor = "pointer";

		jQ(closeButton).click(function () {
			jQ(infoImg).slideDown('normal');
			jQ(frame).hide();
		});
		
		frame.appendChild(closeButton);
		container.appendChild(frame);
		
		map.getContainer().appendChild(container);
		
		jQ(frame).hide();
		jQ(infoImg).hide();
		
		return container;
	}
	
	DirectionsInfo.prototype.getDefaultPosition = function() {
		return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(70, 7));
	}
	
	DirectionsInfo.prototype.setStyle_ = function(element) {
		element.style.textDecoration = "none";
		element.style.color = "#0000cc";
		element.style.backgroundColor = "white";
		element.style.font = "small Arial";
		element.style.border = "1px solid black";
		element.style.padding = "2px";
		element.style.marginBottom = "3px";
		element.style.textAlign = "center";
		element.style.cursor = "pointer";
		element.style.width = "195px";
		element.style.cssFloat = "left";
		element.style.styleFloat = "left";
		element.style.marginRight = "5px";
		element.style.opacity = "0.85";
		element.style.filter = "alpha(opacity=85)";
	}

	map.addControl(new DirectionsInfo(directions, componentId));
}