X-Git-Url: https://git.openstreetmap.org/rails.git/blobdiff_plain/2198b6ebbf46cdad39b75a461b9a72e5cde93c3a..15c156483263893d2c767030bd544d589833af93:/app/assets/javascripts/routing.js.erb

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 30846479d..f496262d2 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -7,7 +7,10 @@
 	https://github.com/apmon/openstreetmap-website/blob/9755c3ae0a8d0684d43760f91dc864ff42d8477a/app/views/routing/start.js.erb
 
 	*** draggable start/end markers
-	
+	*** click each part
+	*** translation (including all alerts and presentation)
+	*** export GPX
+	*** URL history (or do we consciously not want to support that?)
 */
 
 var TURN_INSTRUCTIONS=["",
@@ -85,26 +88,57 @@ OSM.Routing=function(map,name,jqSearch) {
 	r.setPolyline=function(line) {
 		if (r.polyline) map.removeLayer(r.polyline);
 		r.polyline=L.polyline(line, ROUTING_POLYLINE).addTo(r.map);
-		// *** zoom to fit
+		r.map.fitBounds(r.polyline.getBounds());
 	};
 
 	// Take an array of directions and write it out
 	// (we use OSRM's route_instructions format)
+	// *** translations?
 	r.setItinerary=function(steps) {
+		// Create base table
 		$("#content").removeClass("overlay-sidebar");
 		$('#sidebar_content').empty();
-		var html="";
+		var html='<h2><a class="geolink" href="#" onclick="$(~.close_directions~).click();return false;"><span class="icon close"></span></a>Directions</h2>'.replace(/~/g,"'");
+		html+="<table id='turnbyturn' />";
+        $('#sidebar_content').html(html);
+		// Add each row
 		for (var i=0; i<steps.length; i++) {
-			var s=steps[i];
-			html+="<div class='route_step'>";
-			html+=TURN_INSTRUCTIONS[s[0]] || s[0];
-			html+=s[1];
-			html+="</div>";
+			var step=steps[i];
+			var instCodes=step[0].split('-');
+			// Assemble instruction text
+			var instText="<b>"+(i+1)+".</b> ";
+			instText+=TURN_INSTRUCTIONS[instCodes[0]];
+			if (instCodes[1]) { instText+="exit "+instCodes[1]+" "; }
+			if (instCodes[0]!=15) { instText+=step[1] ? "<b>"+step[1]+"</b>" : "(unnamed)"; }
+			// Distance
+			var dist=step[2];
+			if (dist<5) { dist=""; }
+			else if (dist<200) { dist=Math.round(dist/10)*10+"m"; }
+			else if (dist<1500) { dist=Math.round(dist/100)*100+"m"; }
+			else if (dist<5000) { dist=Math.round(dist/100)/10+"km"; }
+			else { dist=Math.round(dist/1000)+"km"; }
+			// Add to table
+			var row=$("<tr class='turn'/>");
+			row.append("<td class='direction i"+instCodes[0]+"'> ");
+			row.append("<td class='instruction'>"+instText);
+			row.append("<td class='distance'>"+dist);
+			with ({n: i}) { row.on('click',function(e) { r.clickTurn(n); });
+			}
+			$('#turnbyturn').append(row);
 		}
-        $('#sidebar_content').html(html);
+	};
+	r.clickTurn=function(num) {
+		console.log("clicked turn",num);
 	};
 
 
+	// Close all routing UI
+	
+	r.close=function() {
+		$("#content").addClass("overlay-sidebar");
+		if (r.polyline) map.removeLayer(r.polyline);
+	};
+
 	// Add engines
 	
 	r.engines=[];
@@ -147,7 +181,11 @@ OSM.Routing=function(map,name,jqSearch) {
 			this.requestJSONP(url);
 		},
 		gotRoute: function(data) {
-			// *** save hints
+			if (data.status==207) {
+				alert("Couldn't find route between those two places");
+				return false;
+			}
+			// *** store hints
 			var line=L.PolylineUtil.decode(data.route_geometry);
 			for (i=0; i<line.length; i++) { line[i].lat/=10; line[i].lng/=10; }
 			r.setPolyline(line);