From 2198b6ebbf46cdad39b75a461b9a72e5cde93c3a Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Tue, 21 Jan 2014 13:29:05 +0000
Subject: [PATCH 01/88] Beginning of JavaScript-only routing UI

---
 app/assets/javascripts/index.js           |  33 ++++-
 app/assets/javascripts/routing.js.erb     | 159 ++++++++++++++++++++++
 app/assets/stylesheets/common.css.scss    |   4 +
 app/views/layouts/_search.html.erb        |  19 ++-
 vendor/assets/leaflet/leaflet.polyline.js | 127 +++++++++++++++++
 5 files changed, 335 insertions(+), 7 deletions(-)
 create mode 100644 app/assets/javascripts/routing.js.erb
 create mode 100755 vendor/assets/leaflet/leaflet.polyline.js

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index 55e612f17..4645a3e2e 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -5,6 +5,7 @@
 //= require leaflet.key
 //= require leaflet.note
 //= require leaflet.share
+//= require leaflet.polyline
 //= require index/search
 //= require index/browse
 //= require index/export
@@ -13,6 +14,7 @@
 //= require index/note
 //= require index/new_note
 //= require router
+//= require routing
 
 (function() {
   var loaderTimeout;
@@ -322,12 +324,18 @@ $(document).ready(function () {
 
   $(".search_form").on("submit", function(e) {
     e.preventDefault();
-    $("header").addClass("closed");
-    var query = $(this).find("input[name=query]").val();
-    if (query) {
-      OSM.router.route("/search?query=" + encodeURIComponent(query) + OSM.formatHash(map));
+    if ($(".query_wrapper.routing").is(":visible")) {
+      // Routing
+      OSM.routing.requestRoute();
     } else {
-      OSM.router.route("/" + OSM.formatHash(map));
+      // Search
+      $("header").addClass("closed");
+      var query = $(this).find("input[name=query]").val();
+      if (query) {
+        OSM.router.route("/search?query=" + encodeURIComponent(query) + OSM.formatHash(map));
+      } else {
+        OSM.router.route("/" + OSM.formatHash(map));
+      }
     }
   });
 
@@ -338,4 +346,19 @@ $(document).ready(function () {
       map.getCenter().lat.toFixed(precision) + "," +
       map.getCenter().lng.toFixed(precision)));
   });
+
+  $(".get_directions").on("click",function(e) {
+	e.preventDefault();
+	$(".query_wrapper.search").hide();
+	$(".query_wrapper.routing").show();
+  });
+
+  $(".close_directions").on("click",function(e) {
+	e.preventDefault();
+	$(".query_wrapper.search").show();
+	$(".query_wrapper.routing").hide();
+  });
+
+  OSM.routing = OSM.Routing(map,'OSM.routing',$('.query_wrapper.routing'));
+
 });
diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
new file mode 100644
index 000000000..30846479d
--- /dev/null
+++ b/app/assets/javascripts/routing.js.erb
@@ -0,0 +1,159 @@
+/*
+	osm.org routing interface
+	
+	See also:
+	https://github.com/apmon/openstreetmap-website/tree/routing2
+	https://github.com/apmon/openstreetmap-website/compare/routing2
+	https://github.com/apmon/openstreetmap-website/blob/9755c3ae0a8d0684d43760f91dc864ff42d8477a/app/views/routing/start.js.erb
+
+	*** draggable start/end markers
+	
+*/
+
+var TURN_INSTRUCTIONS=["",
+	"Continue on ",				// 1
+	"Slight right onto ",		// 2
+	"Turn right onto ",			// 3
+	"Sharp right onto ",		// 4
+	"U-turn along ",			// 5
+	"Sharp left onto ",			// 6
+	"Turn left onto ",			// 7
+	"Slight left onto ",		// 8
+	"(via point) ",				// 9
+	"Follow ",					// 10
+	"At roundabout take ",		// 11
+	"Leave roundabout - ",		// 12
+	"Stay on roundabout - ",	// 13
+	"Start at end of ",			// 14
+	"Reach destination",		// 15
+	"Go against one-way on ",	// 16
+	"End of one-way on "]		// 17
+
+var ROUTING_POLYLINE={
+	color: '#03f',
+	opacity: 0.3,
+	weight: 10
+};
+
+
+OSM.Routing=function(map,name,jqSearch) {
+	var r={};
+	r.map=map;				// Leaflet map
+	r.name=name;			// global variable name of this instance (needed for JSONP)
+	r.jqSearch=jqSearch;	// JQuery object for search panel
+
+	r.route_from=null;
+	r.route_to=null;
+	r.viaPoints=[];
+	r.polyline=null;
+
+	// Geocoding
+
+	r.geocode=function(id,event) { var _this=this;
+		var field=event.target;
+		var v=event.target.value;
+		// *** do something if v==''
+		var querystring = '<%= NOMINATIM_URL %>search?q=' + encodeURIComponent(v) + '&format=json';
+		// *** &accept-language=<%#= request.user_preferred_languages.join(',') %>
+		// *** prefer current viewport
+		$.getJSON(querystring, function(json) { _this._gotGeocode(json,field); });
+	};
+	
+	r._gotGeocode=function(json,field) {
+		if (json.length==0) {
+			alert("Sorry, couldn't find that place."); 	// *** internationalise
+			r[field.id]=null;
+			return;
+		}
+		field.value=json[0].display_name;
+		var lat=Number(json[0].lat), lon=Number(json[0].lon);
+		r[field.id]=[lat,lon];
+		// ** update markers
+	};
+	
+	// Route-fetching UI
+
+	r.requestRoute=function() {
+		if (r.route_from && r.route_to) {
+			var chosen=jqSearch.find('select.routing_engines :selected').val();
+			r.engines[chosen].getRoute(true,[r.route_from,r.route_to]);
+			// then, when the route has been fetched, it'll call the engine's gotRoute function
+		}
+	};
+
+	// Take an array of Leaflet LatLngs and draw it as a polyline
+	r.setPolyline=function(line) {
+		if (r.polyline) map.removeLayer(r.polyline);
+		r.polyline=L.polyline(line, ROUTING_POLYLINE).addTo(r.map);
+		// *** zoom to fit
+	};
+
+	// Take an array of directions and write it out
+	// (we use OSRM's route_instructions format)
+	r.setItinerary=function(steps) {
+		$("#content").removeClass("overlay-sidebar");
+		$('#sidebar_content').empty();
+		var html="";
+		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>";
+		}
+        $('#sidebar_content').html(html);
+	};
+
+
+	// Add engines
+	
+	r.engines=[];
+	r.addEngine=function(engine) {
+		// Save engine
+		var i=r.engines.length;
+		engine.subscript=i;
+		r['engine'+i]=engine;
+		r.engines.push(engine);
+
+		// Add generic JSONP function
+		engine.requestJSONP=function(url) {
+			var script = document.createElement('script');
+			script.src = url+"&jsonp="+r.name+".engine"+this.subscript+".gotRoute";
+ 			// OSRM doesn't like non-alphanumeric, otherwise we could just do OSM.routing.engines["+engine.subscript+"].gotRoute
+			document.body.appendChild(script); 
+		};
+
+		// Populate dropdown
+		var select=jqSearch.find('select.routing_engines');
+		select.append("<option value='"+i+"'>"+engine.name+"</option>");
+	};
+
+	// OSRM car engine
+	// *** this should all be shared from an OSRM library somewhere
+	// *** need to clear hints at some point
+
+	r.addEngine({
+		name: 'Car (OSRM)',
+		draggable: true,
+		_hints: {},
+		getRoute: function(final,points) {
+			var url="http://router.project-osrm.org/viaroute?z=14&output=json";
+			for (var i=0; i<points.length; i++) {
+				var pair=points[i].join(',');
+				url+="&loc="+pair;
+				if (this._hints[pair]) url+= "&hint="+this._hints[pair];
+			}
+			if (final) url+="&instructions=true";
+			this.requestJSONP(url);
+		},
+		gotRoute: function(data) {
+			// *** save 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);
+			r.setItinerary(data.route_instructions);
+		}
+	});
+
+	return r;
+};
diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index 088d4e07a..a784493d6 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -953,6 +953,10 @@ header .search_form {
     font-size: 10px;
     color: $blue;
   }
+
+  .query_wrapper.routing {
+    display: none;
+  }
 }
 
 /* Rules for the map key which appears in the popout sidebar */
diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index 732e57d31..acc910b48 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -1,7 +1,22 @@
 <%= form_tag search_path, :class => "search_form" do %>
   <%= submit_tag t('site.search.submit_text') %>
-  <div class='query_wrapper'>
+
+  <div class='query_wrapper search'>
     <%= text_field_tag "query", params[:query], :placeholder => t("site.search.search"), :autofocus => autofocus %>
-    <%= link_to t('site.search.where_am_i'), '#', { :class => "describe_location", :title => t('site.search.where_am_i_title') } %>
+    <div class='query_options'>
+      <%= link_to t('site.search.get_directions'), '#', { :class => "get_directions", :title => t('site.search.get_directions_title') } %>
+      &middot;
+      <%= link_to t('site.search.where_am_i'), '#', { :class => "describe_location", :title => t('site.search.where_am_i_title') } %>
+    </div>
   </div>
+
+  <div class='query_wrapper routing'>
+    <%= text_field_tag "route_from", params[:from], :placeholder => "From", :onchange=>"OSM.routing.geocode('route_from',event)" %>
+    <%= text_field_tag "route_to"  , params[:to]  , :placeholder => "To"  , :onchange=>"OSM.routing.geocode('route_to'  ,event)" %>
+    <div class='query_options'>
+      <select class='routing_engines'></select>
+      <%= link_to t('site.search.close_directions'), '#', { :class => "close_directions", :title => t('site.search.close_directions_title') } %>
+    </div>
+  </div>
+
 <% end %>
diff --git a/vendor/assets/leaflet/leaflet.polyline.js b/vendor/assets/leaflet/leaflet.polyline.js
new file mode 100755
index 000000000..b7e85d6c5
--- /dev/null
+++ b/vendor/assets/leaflet/leaflet.polyline.js
@@ -0,0 +1,127 @@
+/*
+ * L.PolylineUtil contains utilify functions for polylines, two methods
+ * are added to the L.Polyline object to support creation of polylines
+ * from an encoded string and converting existing polylines to an
+ * encoded string.
+ *
+ *  - L.Polyline.fromEncoded(encoded [, options]) returns a L.Polyline
+ *  - L.Polyline.encodePath() returns a string
+ *
+ * Actual code from:
+ * http://facstaff.unca.edu/mcmcclur/GoogleMaps/EncodePolyline/\
+ */
+
+/*jshint browser:true, debug: true, strict:false, globalstrict:false, indent:4, white:true, smarttabs:true*/
+/*global L:true, console:true*/
+
+
+// Inject functionality into Leaflet
+(function (L) {
+	if (!(L.Polyline.prototype.fromEncoded)) {
+		L.Polyline.fromEncoded = function (encoded, options) {
+			return new L.Polyline(L.PolylineUtil.decode(encoded), options);
+		};
+	}
+	if (!(L.Polygon.prototype.fromEncoded)) {
+		L.Polygon.fromEncoded = function (encoded, options) {
+			return new L.Polygon(L.PolylineUtil.decode(encoded), options);
+		};
+	}
+
+	var encodeMixin = {
+		encodePath: function () {
+			return L.PolylineUtil.encode(this.getLatLngs());
+		}
+	};
+
+	if (!L.Polyline.prototype.encodePath) {
+		L.Polyline.include(encodeMixin);
+	}
+	if (!L.Polygon.prototype.encodePath) {
+		L.Polygon.include(encodeMixin);
+	}
+})(L);
+
+// Utility functions.
+L.PolylineUtil = {};
+
+L.PolylineUtil.encode = function (latlngs) {
+	var i, dlat, dlng;
+	var plat = 0;
+	var plng = 0;
+	var encoded_points = "";
+
+	for (i = 0; i < latlngs.length; i++) {
+		var lat = latlngs[i].lat;
+		var lng = latlngs[i].lng;
+		var late5 = Math.floor(lat * 1e5);
+		var lnge5 = Math.floor(lng * 1e5);
+		dlat = late5 - plat;
+		dlng = lnge5 - plng;
+		plat = late5;
+		plng = lnge5;
+		encoded_points +=
+			L.PolylineUtil.encodeSignedNumber(dlat) +
+			L.PolylineUtil.encodeSignedNumber(dlng);
+	}
+	return encoded_points;
+};
+
+// This function is very similar to Google's, but I added
+// some stuff to deal with the double slash issue.
+L.PolylineUtil.encodeNumber = function (num) {
+	var encodeString = "";
+	var nextValue, finalValue;
+	while (num >= 0x20) {
+		nextValue = (0x20 | (num & 0x1f)) + 63;
+		encodeString += (String.fromCharCode(nextValue));
+		num >>= 5;
+	}
+	finalValue = num + 63;
+	encodeString += (String.fromCharCode(finalValue));
+	return encodeString;
+};
+
+// This one is Google's verbatim.
+L.PolylineUtil.encodeSignedNumber = function (num) {
+	var sgn_num = num << 1;
+	if (num < 0) {
+		sgn_num = ~(sgn_num);
+	}
+	return (L.PolylineUtil.encodeNumber(sgn_num));
+};
+
+L.PolylineUtil.decode = function (encoded) {
+	var len = encoded.length;
+	var index = 0;
+	var latlngs = [];
+	var lat = 0;
+	var lng = 0;
+
+	while (index < len) {
+		var b;
+		var shift = 0;
+		var result = 0;
+		do {
+			b = encoded.charCodeAt(index++) - 63;
+			result |= (b & 0x1f) << shift;
+			shift += 5;
+		} while (b >= 0x20);
+		var dlat = ((result & 1) ? ~(result >> 1) : (result >> 1));
+		lat += dlat;
+
+		shift = 0;
+		result = 0;
+		do {
+			b = encoded.charCodeAt(index++) - 63;
+			result |= (b & 0x1f) << shift;
+			shift += 5;
+		} while (b >= 0x20);
+		var dlng = ((result & 1) ? ~(result >> 1) : (result >> 1));
+		lng += dlng;
+
+		latlngs.push(new L.LatLng(lat * 1e-5, lng * 1e-5));
+	}
+
+	return latlngs;
+};
\ No newline at end of file

From 69437cf0ad12550ebfaadea56d074ac9996b8ca0 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Tue, 21 Jan 2014 19:22:50 +0000
Subject: [PATCH 02/88] Presentation work

---
 app/assets/images/routing-sprite.png   | Bin 0 -> 1770 bytes
 app/assets/javascripts/index.js        |   2 ++
 app/assets/javascripts/routing.js.erb  |  33 ++++++++++++++++++-------
 app/assets/stylesheets/common.css.scss |  15 +++++++++++
 config/locales/en.yml                  |   4 +++
 5 files changed, 45 insertions(+), 9 deletions(-)
 create mode 100644 app/assets/images/routing-sprite.png

diff --git a/app/assets/images/routing-sprite.png b/app/assets/images/routing-sprite.png
new file mode 100644
index 0000000000000000000000000000000000000000..37d94886ddf07ea4074f92c01584394761984983
GIT binary patch
literal 1770
zcmV<G1{L{<P)<h;3K|Lk000e1NJLTq00C40000yS1^@s6(!IrP0000PbVXQnQ*UN;
zcVTj606}DLVr3vnZDD6+Qe|Oed2z{QJOBU&j7da6RCwC#TtTbkL=fItJO~OeXD{aL
zX~csU582zYJTT(Ln-LaID`xM4@g{iK_zTS5yg3UZ-pqpDT+D)}MKBK*z2?E93kqY`
zZbfSAbu#Jd%DlYUE~q#2l1WW<RoB;FcRI7$Znu|$1PLOS)oK-+m)O)&tz<7VwyLH2
z7i3s2PfSQ^G@7wPuHieBZAR#K64Lxk9+MgD#sC5rEDoCeIX9YV^;`2&LQO2uzkT3=
zGOpC9rE42SUkVI$ml|mxAyYo<szwTM!)PkF7DnC#HA7n!`U@ZEj79>xx#T*F9q_3p
z3ce)@b|XnXjI1#(TjCGIEG2P_gg(KajYiz&R?Ys5x#+O{v0^<`OZ0DUJW$SaLi@WQ
zX3n+h;#50BV_VYTSlC%gVuNcg^ex4Jro!vj1k`O>dc@7ww`#<%!n4TwL9Dm{Mb;`4
z0&fsx;HM4HDj+=<9xMz{Giki07_W&_iBcnLUd*00uN(b`*=#*+c7(~rjz!UqfR+fn
zSln90q6PiS=rzxH@tn5UF{6bQnOc9w8PX|hcj94>lY?5pKi==wONpOiPGe<29VL2b
zx3HdbKzQFm9%F5thuwU@W+s@DQ+>$nO`5J-7+{HUOfBtSPXy8pyYAtL-<go5idnCP
z38~m+ZSU}XqQqD<2Ho1y-bT30)cf`~d(E`{TTuMG^NWK<s|BbQJlTx&^~4oW8?9+H
z1J>VsM`C1J8y|ok0f8|cEEo$T$SpoMQ>I{+&ra1s$XvXZBP_9eZ1mW3{dp@LEa&de
zI6y-2y+>>vqu;5Jou&i?Ypj(*2++NM#~S|45I>dt5^|9F0_wo*?F?{=0CflBh?NVa
z7JzbVnPOgZ0R=}u?S^Rn!06UY7&W^Iz*h_;*=s2Q2cwRx$?`!X76R(OW23vrRF!M2
z$e?}tGX>P^N;iDq&96!~MpgXNjGtD1nVnVvP=^RwOLO52s0dgcqW{mt@aOoYjnewv
zrk|<`?^JL3-DT{MYsrE=xzn8x7Trx{2`nM`g!S2})BcD7Yr}l41b~|L3>iCS<FgDy
z{QHpENfp)-y_ocj{ka_LiwY#ccNxa!UnTTSEq+@0MeKNtpMS*rz6+pYJ+v0za;%NY
z2T<d&MQAKQNvEk;XNmf$yT>{XpH^qWQMa&+d>h9bQj-?!r3?G$SItN8p>|B!ayHh{
z1%R4Z+Se(q{fTEabM$8x^B++~%O;Fy{9*KaeD&D@qv@Y&{50~5-<gtj9`o9F1k{*q
z0eq$g2I}oh?Oq<(o7(Q!y9)HW6Ks2p>1JcFfp&7?-rc+A`jYvk@q`H^>H}jd-4zRm
zjlwx>F1Bpgei=5!8?Eq(mR)g&PI41{6bss_*|FTiWJ&DNP2@*2?c45L+B!pj?qdc0
z<SkJ1{t6!Z*m2`~hH*ME`kJwI)#xkc{T)1C2siU{|K5@KHzOX1^NZiPA%`A8?c)PI
zrEOzAK7e99H>Hhe8`$bqJbVKm8i<^pl$uG}sg2pU07z>-`q$gUsnah;-z2BLHu@E^
z^wz<@a$zy+6!W>6@R|BNpTI!?Jf-~v2bBBxugjB8eL+?Xm`V!~nc`p412pq*BlJ&O
zX3H<e53c>j=(pt58%BS}CAN)+?VQx_yFD>n0-!#RlHtC^7s;`gjNX<e`9P&Ywl*Xu
z_?h!214kC7=krKrG%}-;_!n9Hi(MK1MawVN(jBa=|7U_&dzmM30I<G`|3ck1^n3u+
z{j#{0u#R3%J(fHUHBSBRgZq}#a4el+is|ZK?^}gaNdPYZfme~ax-hJoOvQ7;GD`<W
z$NSj{vQ+M0&s>`W&u@;kMWs}l4HrX8F)xJj-Mf^S>?4xoE`;Sw(LLF%f$LrU^t4$J
zlh1JZ=517d&WZJycHTB`-#2>8yuZZ&rV{%1!+?MJ0p+(v#@O*e1%D9bQ$k!yCEp=m
zH*Me?80z_q&ZTye4>(@1wp^fY7UUNI!s|xABZpz{=oN{d<{ALN&y4<whhQ7fmzSR2
zN$w;?Z}IOZseen&FRT&6joJamT@se6N?eBSVFW<c?HrKU6>7bMrJe?MdJru73v%cq
zpWhq>P%$qL@ZWo|>%ymhSp56sdHPLMj9s-);u5C(=agt%&#FQ+f&`gWN&>F4%PRb0
ze~=&^1@v?aRnLBM-<v(S?)T(}ggo~J&*EQ@0H{HN1PQVi`A>iW0MJ+G3_ddYI{*Lx
M07*qoM6N<$f|-VHxBvhE

literal 0
HcmV?d00001

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index 4645a3e2e..74ec05823 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -351,12 +351,14 @@ $(document).ready(function () {
 	e.preventDefault();
 	$(".query_wrapper.search").hide();
 	$(".query_wrapper.routing").show();
+	$(".query_wrapper.routing [name=route_from]").focus();
   });
 
   $(".close_directions").on("click",function(e) {
 	e.preventDefault();
 	$(".query_wrapper.search").show();
 	$(".query_wrapper.routing").hide();
+	$(".query_wrapper.search [name=query]").focus();
   });
 
   OSM.routing = OSM.Routing(map,'OSM.routing',$('.query_wrapper.routing'));
diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 30846479d..1f50fa480 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -7,7 +7,9 @@
 	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
 */
 
 var TURN_INSTRUCTIONS=["",
@@ -85,22 +87,31 @@ 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) {
 		$("#content").removeClass("overlay-sidebar");
 		$('#sidebar_content').empty();
-		var html="";
+		var html='<h2><a class="geolink" href="#"><span class="icon close"></span></a>Directions</h2>';
+		html+="<table>";
 		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)"; }
+			// Add to table
+			html+="<tr>";
+			html+="<td class='direction i"+instCodes[0]+"'> ";
+			html+="<td>"+instText;
 		}
+		html+="</table>";
         $('#sidebar_content').html(html);
 	};
 
@@ -147,7 +158,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);
diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index a784493d6..5166c7a31 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -993,6 +993,21 @@ header .search_form {
   color: #f00;
 }
 
+/* Rules for routing */
+
+#sidebar_content>table {
+    margin: 20px 0px 10px 15px;
+}
+
+td.direction {
+    background-image: image-url('routing-sprite.png'); 
+    width: 20px; height: 20px; 
+    background-repeat: no-repeat;
+}
+@for $i from 1 through 17 {
+td.direction.i#{$i}  { background-position: #{($i)*-20+20}px 0px; }
+}
+
 /* Rules for entity history */
 
 #sidebar_content {
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 9efda4556..4bc926f2b 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -1324,6 +1324,10 @@ en:
       close: Close
     search:
       search: Search
+      get_directions: "Get directions"
+      get_directions_title: "Find directions between two points"
+      close_directions: "Close directions"
+      close_directions_title: "Close the directions panel"
       where_am_i: "Where am I?"
       where_am_i_title: Describe the current location using the search engine
       submit_text: "Go"

From 99cf44ba2b7954d7669a46e76cf59197acf8a255 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Tue, 21 Jan 2014 20:41:55 +0000
Subject: [PATCH 03/88] Precompile routing JS

---
 config/environments/production.rb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/config/environments/production.rb b/config/environments/production.rb
index c4910d86f..36f71792f 100644
--- a/config/environments/production.rb
+++ b/config/environments/production.rb
@@ -69,7 +69,7 @@ OpenStreetMap::Application.configure do
 
   # Precompile additional assets.
   # application.js, application.css, and all non-JS/CSS in app/assets folder are already added.
-  config.assets.precompile += %w( index.js browse.js welcome.js fixthemap.js )
+  config.assets.precompile += %w( index.js browse.js welcome.js fixthemap.js routing.js )
   config.assets.precompile += %w( user.js diary_entry.js swfobject.js )
   config.assets.precompile += %w( large-ltr.css small-ltr.css print-ltr.css )
   config.assets.precompile += %w( large-rtl.css small-rtl.css print-rtl.css )

From c6e8775dbab81daf9515fe94fa0ed4c51cab5f3b Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Tue, 21 Jan 2014 20:42:31 +0000
Subject: [PATCH 04/88] Presentation of directions

---
 app/assets/javascripts/routing.js.erb  | 10 +++++++++-
 app/assets/stylesheets/common.css.scss | 14 +++++++++++++-
 2 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 1f50fa480..ee76fb14f 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -106,10 +106,18 @@ OSM.Routing=function(map,name,jqSearch) {
 			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
 			html+="<tr>";
 			html+="<td class='direction i"+instCodes[0]+"'> ";
-			html+="<td>"+instText;
+			html+="<td class='instruction'>"+instText;
+			html+="<td class='distance'>"+dist;
 		}
 		html+="</table>";
         $('#sidebar_content').html(html);
diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index 5166c7a31..93b8f0d07 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -996,7 +996,9 @@ header .search_form {
 /* Rules for routing */
 
 #sidebar_content>table {
-    margin: 20px 0px 10px 15px;
+    padding: 5px 20px 10px 15px;
+    width: 100%;
+    border-collapse: separate;
 }
 
 td.direction {
@@ -1008,6 +1010,16 @@ td.direction {
 td.direction.i#{$i}  { background-position: #{($i)*-20+20}px 0px; }
 }
 
+td.instruction, td.distance {
+    padding-top: 0;
+    border-bottom: 1px solid #DDD;
+}
+td.distance {
+    color: #BBB;
+    text-align: right;
+    font-size: x-small;
+}
+
 /* Rules for entity history */
 
 #sidebar_content {

From ad01a61b6d07fffff3dedfd476830699c8f50038 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Tue, 21 Jan 2014 20:57:55 +0000
Subject: [PATCH 05/88] Query options presentation

---
 app/assets/javascripts/index.js        |  8 ++++----
 app/assets/stylesheets/common.css.scss |  9 ++++-----
 app/views/layouts/_search.html.erb     | 19 ++++++++++---------
 3 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index 74ec05823..638be0dca 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -349,15 +349,15 @@ $(document).ready(function () {
 
   $(".get_directions").on("click",function(e) {
 	e.preventDefault();
-	$(".query_wrapper.search").hide();
-	$(".query_wrapper.routing").show();
+	$(".search").hide();
+	$(".routing").show();
 	$(".query_wrapper.routing [name=route_from]").focus();
   });
 
   $(".close_directions").on("click",function(e) {
 	e.preventDefault();
-	$(".query_wrapper.search").show();
-	$(".query_wrapper.routing").hide();
+	$(".search").show();
+	$(".routing").hide();
 	$(".query_wrapper.search [name=query]").focus();
   });
 
diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index 93b8f0d07..6e402f3b8 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -916,6 +916,7 @@ header .search_form {
 .search_form {
   position: relative;
   padding: $lineheight/2;
+  padding-top: 1px;
   background-color: $lightgrey;
 
   .query_wrapper {
@@ -946,15 +947,13 @@ header .search_form {
     border-radius: 0 2px 2px 0;
   }
 
-  .describe_location {
-    position: absolute;
-    top: 6px;
-    right: 6px;
+  .query_options {
+    text-align: right;
     font-size: 10px;
     color: $blue;
   }
 
-  .query_wrapper.routing {
+  .routing {
     display: none;
   }
 }
diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index acc910b48..247798bf2 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -1,22 +1,23 @@
 <%= form_tag search_path, :class => "search_form" do %>
+  <div class='query_options search'>
+    <%= link_to t('site.search.where_am_i'), '#', { :class => "describe_location", :title => t('site.search.where_am_i_title') } %>
+    &middot;
+    <%= link_to t('site.search.get_directions'), '#', { :class => "get_directions", :title => t('site.search.get_directions_title') } %>
+  </div>
+  <div class='query_options routing'>
+    <%= link_to t('site.search.close_directions'), '#', { :class => "close_directions", :title => t('site.search.close_directions_title') } %>
+  </div>
+
   <%= submit_tag t('site.search.submit_text') %>
 
   <div class='query_wrapper search'>
     <%= text_field_tag "query", params[:query], :placeholder => t("site.search.search"), :autofocus => autofocus %>
-    <div class='query_options'>
-      <%= link_to t('site.search.get_directions'), '#', { :class => "get_directions", :title => t('site.search.get_directions_title') } %>
-      &middot;
-      <%= link_to t('site.search.where_am_i'), '#', { :class => "describe_location", :title => t('site.search.where_am_i_title') } %>
-    </div>
   </div>
 
   <div class='query_wrapper routing'>
     <%= text_field_tag "route_from", params[:from], :placeholder => "From", :onchange=>"OSM.routing.geocode('route_from',event)" %>
     <%= text_field_tag "route_to"  , params[:to]  , :placeholder => "To"  , :onchange=>"OSM.routing.geocode('route_to'  ,event)" %>
-    <div class='query_options'>
-      <select class='routing_engines'></select>
-      <%= link_to t('site.search.close_directions'), '#', { :class => "close_directions", :title => t('site.search.close_directions_title') } %>
-    </div>
+    <select class='routing_engines'></select>
   </div>
 
 <% end %>

From fd991a0201c83a639c585de3119c779fda761209 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Tue, 21 Jan 2014 21:15:49 +0000
Subject: [PATCH 06/88] Close directions

---
 app/assets/javascripts/index.js       |  5 +++--
 app/assets/javascripts/routing.js.erb | 10 +++++++++-
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index 638be0dca..a3531eb30 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -347,6 +347,8 @@ $(document).ready(function () {
       map.getCenter().lng.toFixed(precision)));
   });
 
+  OSM.routing = OSM.Routing(map,'OSM.routing',$('.query_wrapper.routing'));
+
   $(".get_directions").on("click",function(e) {
 	e.preventDefault();
 	$(".search").hide();
@@ -358,9 +360,8 @@ $(document).ready(function () {
 	e.preventDefault();
 	$(".search").show();
 	$(".routing").hide();
+	OSM.routing.close();
 	$(".query_wrapper.search [name=query]").focus();
   });
 
-  OSM.routing = OSM.Routing(map,'OSM.routing',$('.query_wrapper.routing'));
-
 });
diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index ee76fb14f..ed9551252 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -10,6 +10,7 @@
 	*** 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=["",
@@ -96,7 +97,7 @@ OSM.Routing=function(map,name,jqSearch) {
 	r.setItinerary=function(steps) {
 		$("#content").removeClass("overlay-sidebar");
 		$('#sidebar_content').empty();
-		var html='<h2><a class="geolink" href="#"><span class="icon close"></span></a>Directions</h2>';
+		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>";
 		for (var i=0; i<steps.length; i++) {
 			var step=steps[i];
@@ -124,6 +125,13 @@ OSM.Routing=function(map,name,jqSearch) {
 	};
 
 
+	// Close all routing UI
+	
+	r.close=function() {
+		$("#content").addClass("overlay-sidebar");
+		if (r.polyline) map.removeLayer(r.polyline);
+	};
+
 	// Add engines
 	
 	r.engines=[];

From 15c156483263893d2c767030bd544d589833af93 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Tue, 21 Jan 2014 21:44:09 +0000
Subject: [PATCH 07/88] Start to make turn-by-turn instructions clickable

---
 app/assets/javascripts/routing.js.erb  | 21 ++++++++++++++-------
 app/assets/stylesheets/common.css.scss |  6 ++++++
 2 files changed, 20 insertions(+), 7 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index ed9551252..f496262d2 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -95,10 +95,13 @@ OSM.Routing=function(map,name,jqSearch) {
 	// (we use OSRM's route_instructions format)
 	// *** translations?
 	r.setItinerary=function(steps) {
+		// Create base table
 		$("#content").removeClass("overlay-sidebar");
 		$('#sidebar_content').empty();
 		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>";
+		html+="<table id='turnbyturn' />";
+        $('#sidebar_content').html(html);
+		// Add each row
 		for (var i=0; i<steps.length; i++) {
 			var step=steps[i];
 			var instCodes=step[0].split('-');
@@ -115,13 +118,17 @@ OSM.Routing=function(map,name,jqSearch) {
 			else if (dist<5000) { dist=Math.round(dist/100)/10+"km"; }
 			else { dist=Math.round(dist/1000)+"km"; }
 			// Add to table
-			html+="<tr>";
-			html+="<td class='direction i"+instCodes[0]+"'> ";
-			html+="<td class='instruction'>"+instText;
-			html+="<td class='distance'>"+dist;
+			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);
 		}
-		html+="</table>";
-        $('#sidebar_content').html(html);
+	};
+	r.clickTurn=function(num) {
+		console.log("clicked turn",num);
 	};
 
 
diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index 6e402f3b8..d0732de74 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -1018,6 +1018,12 @@ td.distance {
     text-align: right;
     font-size: x-small;
 }
+tr.turn {
+    cursor: pointer;
+}
+tr.turn:hover {
+    background: lighten($green, 30%); 
+}
 
 /* Rules for entity history */
 

From a41aec9609afabe09cc2189a798bc711ea13c7c9 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Tue, 21 Jan 2014 22:39:51 +0000
Subject: [PATCH 08/88] Show little popup on click

---
 app/assets/javascripts/routing.js.erb | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index f496262d2..98f6d86e8 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -100,8 +100,9 @@ OSM.Routing=function(map,name,jqSearch) {
 		$('#sidebar_content').empty();
 		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);
+		$('#sidebar_content').html(html);
 		// Add each row
+		var cumulative=0;
 		for (var i=0; i<steps.length; i++) {
 			var step=steps[i];
 			var instCodes=step[0].split('-');
@@ -122,13 +123,17 @@ OSM.Routing=function(map,name,jqSearch) {
 			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); });
-			}
+			with ({num: i, dist: step[3]}) {
+				row.on('click',function(e) { 
+					r.clickTurn(num, r.polyline.getLatLngs()[dist]);
+				});
+			};
 			$('#turnbyturn').append(row);
+			cumulative+=step[2];
 		}
 	};
-	r.clickTurn=function(num) {
-		console.log("clicked turn",num);
+	r.clickTurn=function(num,latlng) {
+		L.popup().setLatLng(latlng).setContent("<p>"+(num+1)+"</p>").openOn(r.map);
 	};
 
 

From 40ad8c7def36c7f5658e9987075578f491f77f0b Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Tue, 21 Jan 2014 23:47:50 +0000
Subject: [PATCH 09/88] Start work on second engine

---
 app/assets/javascripts/routing.js.erb | 42 ++++++++++++++++++++++++---
 app/views/layouts/_search.html.erb    |  2 +-
 2 files changed, 39 insertions(+), 5 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 98f6d86e8..4eb91fc7a 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -49,6 +49,7 @@ OSM.Routing=function(map,name,jqSearch) {
 	r.route_to=null;
 	r.viaPoints=[];
 	r.polyline=null;
+	r.chosenEngine=null;
 
 	// Geocoding
 
@@ -76,10 +77,12 @@ OSM.Routing=function(map,name,jqSearch) {
 	
 	// Route-fetching UI
 
+	r.selectEngine=function(e) {
+		r.chosenEngine=r.engines[e.target.selectedIndex];
+	};
 	r.requestRoute=function() {
 		if (r.route_from && r.route_to) {
-			var chosen=jqSearch.find('select.routing_engines :selected').val();
-			r.engines[chosen].getRoute(true,[r.route_from,r.route_to]);
+			r.chosenEngine.getRoute(true,[r.route_from,r.route_to]);
 			// then, when the route has been fetched, it'll call the engine's gotRoute function
 		}
 	};
@@ -157,7 +160,7 @@ OSM.Routing=function(map,name,jqSearch) {
 		// Add generic JSONP function
 		engine.requestJSONP=function(url) {
 			var script = document.createElement('script');
-			script.src = url+"&jsonp="+r.name+".engine"+this.subscript+".gotRoute";
+			script.src = url+r.name+".engine"+this.subscript+".gotRoute";
  			// OSRM doesn't like non-alphanumeric, otherwise we could just do OSM.routing.engines["+engine.subscript+"].gotRoute
 			document.body.appendChild(script); 
 		};
@@ -183,7 +186,7 @@ OSM.Routing=function(map,name,jqSearch) {
 				if (this._hints[pair]) url+= "&hint="+this._hints[pair];
 			}
 			if (final) url+="&instructions=true";
-			this.requestJSONP(url);
+			this.requestJSONP(url+"&jsonp=");
 		},
 		gotRoute: function(data) {
 			if (data.status==207) {
@@ -198,5 +201,36 @@ OSM.Routing=function(map,name,jqSearch) {
 		}
 	});
 
+	// CloudMade foot engine
+	// *** again, this should be shared from a Cloudmade library somewhere
+	// *** this API key is taken from some example code, not for real live use!
+	
+	r.addEngine({
+		name: 'Foot (CloudMade)',
+		draggable: true,
+		getRoute: function(final,points) {
+			var url="http://routes.cloudmade.com/8ee2a50541944fb9bcedded5165f09d9/api/0.3/";
+			var p=[];
+			for (var i=0; i<points.length; i++) {
+				p.push(points[i][0]);
+				p.push(points[i][1]);
+			}
+			url+=p.join(',');
+			url+="/foot.js";
+			this.requestJSONP(url+"?callback=");
+		},
+		gotRoute: function(data) {
+			console.log(data);
+			// *** todo
+			// *** will require some degree of refactoring because instruction text is pre-assembled
+			// *** otherwise largely like OSRM (funny that)
+		}
+	});
+	
+	// *** add MapQuest
+	// *** add YOURS
+	// *** move into separate files
+	
+	r.chosenEngine=r.engines[0];
 	return r;
 };
diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index 247798bf2..bf734fce2 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -17,7 +17,7 @@
   <div class='query_wrapper routing'>
     <%= text_field_tag "route_from", params[:from], :placeholder => "From", :onchange=>"OSM.routing.geocode('route_from',event)" %>
     <%= text_field_tag "route_to"  , params[:to]  , :placeholder => "To"  , :onchange=>"OSM.routing.geocode('route_to'  ,event)" %>
-    <select class='routing_engines'></select>
+    <select class='routing_engines' name='routing_engines' onchange="OSM.routing.selectEngine(event)"></select>
   </div>
 
 <% end %>

From 3bd5ae239950a842e565ba747466da903e605bda Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Wed, 22 Jan 2014 09:52:01 +0000
Subject: [PATCH 10/88] Move routing engines into their own files

---
 app/assets/javascripts/index.js               |   3 +
 app/assets/javascripts/routing.js.erb         | 126 ++++++------------
 .../routing_engines/cloudmade_foot.js         |  26 ++++
 .../javascripts/routing_engines/osrm_car.js   |  30 +++++
 4 files changed, 99 insertions(+), 86 deletions(-)
 create mode 100644 app/assets/javascripts/routing_engines/cloudmade_foot.js
 create mode 100644 app/assets/javascripts/routing_engines/osrm_car.js

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index a3531eb30..9ddac98a3 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -15,6 +15,7 @@
 //= require index/new_note
 //= require router
 //= require routing
+//= require_tree ./routing_engines
 
 (function() {
   var loaderTimeout;
@@ -348,6 +349,8 @@ $(document).ready(function () {
   });
 
   OSM.routing = OSM.Routing(map,'OSM.routing',$('.query_wrapper.routing'));
+  OSM.routing.addEngines(OSM.RoutingEngines.list);
+  OSM.routing.chooseEngine('Car (OSRM)');
 
   $(".get_directions").on("click",function(e) {
 	e.preventDefault();
diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 4eb91fc7a..afa15ba4f 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -7,10 +7,13 @@
 	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?)
+
+	*** add MapQuest engine
+	*** add YOURS engine
+	*** finish CloudMade engine
 */
 
 var TURN_INSTRUCTIONS=["",
@@ -39,6 +42,11 @@ var ROUTING_POLYLINE={
 };
 
 
+OSM.RoutingEngines={
+	list: []
+	// common functions and constants, e.g. OSRM parser, can go here
+};
+
 OSM.Routing=function(map,name,jqSearch) {
 	var r={};
 	r.map=map;				// Leaflet map
@@ -77,9 +85,6 @@ OSM.Routing=function(map,name,jqSearch) {
 	
 	// Route-fetching UI
 
-	r.selectEngine=function(e) {
-		r.chosenEngine=r.engines[e.target.selectedIndex];
-	};
 	r.requestRoute=function() {
 		if (r.route_from && r.route_to) {
 			r.chosenEngine.getRoute(true,[r.route_from,r.route_to]);
@@ -147,90 +152,39 @@ OSM.Routing=function(map,name,jqSearch) {
 		if (r.polyline) map.removeLayer(r.polyline);
 	};
 
-	// Add engines
-	
-	r.engines=[];
-	r.addEngine=function(engine) {
-		// Save engine
-		var i=r.engines.length;
-		engine.subscript=i;
-		r['engine'+i]=engine;
-		r.engines.push(engine);
+	// Routing engine handling
 
-		// Add generic JSONP function
-		engine.requestJSONP=function(url) {
-			var script = document.createElement('script');
-			script.src = url+r.name+".engine"+this.subscript+".gotRoute";
- 			// OSRM doesn't like non-alphanumeric, otherwise we could just do OSM.routing.engines["+engine.subscript+"].gotRoute
-			document.body.appendChild(script); 
-		};
-
-		// Populate dropdown
-		var select=jqSearch.find('select.routing_engines');
-		select.append("<option value='"+i+"'>"+engine.name+"</option>");
+	// Add all engines
+	r.addEngines=function(list) {
+		list.sort(function(a,b) { return a.name>b.name; });
+		r.engines=list;
+		var select=r.jqSearch.find('select.routing_engines');
+		for (var i=0; i<list.length; i++) {
+			// Set up JSONP callback
+			var engine=r.engines[i];
+			engine.requestJSONP=function(url) {
+				var script = document.createElement('script');
+				script.src = url+r.name+".gotRoute"+this.subscript;
+				document.body.appendChild(script); 
+			};
+			r['gotRoute'+i]=function(data) { engine.gotRoute(r,data); };
+			select.append("<option value='"+i+"'>"+engine.name+"</option>");
+		}
+		r.chosenEngine=r.engines[0];
+	};
+	// Choose an engine on dropdown change
+	r.selectEngine=function(e) {
+		r.chosenEngine=r.engines[e.target.selectedIndex];
+	};
+	// Choose an engine by name
+	r.chooseEngine=function(name) {
+		for (var i=0; i<r.engines.length; i++) {
+			if (r.engines[i].name==name) {
+				r.chosenEngine[i]=r.engines[i];
+				r.jqSearch.find('select.routing_engines').val(i);
+			}
+		}
 	};
 
-	// OSRM car engine
-	// *** this should all be shared from an OSRM library somewhere
-	// *** need to clear hints at some point
-
-	r.addEngine({
-		name: 'Car (OSRM)',
-		draggable: true,
-		_hints: {},
-		getRoute: function(final,points) {
-			var url="http://router.project-osrm.org/viaroute?z=14&output=json";
-			for (var i=0; i<points.length; i++) {
-				var pair=points[i].join(',');
-				url+="&loc="+pair;
-				if (this._hints[pair]) url+= "&hint="+this._hints[pair];
-			}
-			if (final) url+="&instructions=true";
-			this.requestJSONP(url+"&jsonp=");
-		},
-		gotRoute: function(data) {
-			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);
-			r.setItinerary(data.route_instructions);
-		}
-	});
-
-	// CloudMade foot engine
-	// *** again, this should be shared from a Cloudmade library somewhere
-	// *** this API key is taken from some example code, not for real live use!
-	
-	r.addEngine({
-		name: 'Foot (CloudMade)',
-		draggable: true,
-		getRoute: function(final,points) {
-			var url="http://routes.cloudmade.com/8ee2a50541944fb9bcedded5165f09d9/api/0.3/";
-			var p=[];
-			for (var i=0; i<points.length; i++) {
-				p.push(points[i][0]);
-				p.push(points[i][1]);
-			}
-			url+=p.join(',');
-			url+="/foot.js";
-			this.requestJSONP(url+"?callback=");
-		},
-		gotRoute: function(data) {
-			console.log(data);
-			// *** todo
-			// *** will require some degree of refactoring because instruction text is pre-assembled
-			// *** otherwise largely like OSRM (funny that)
-		}
-	});
-	
-	// *** add MapQuest
-	// *** add YOURS
-	// *** move into separate files
-	
-	r.chosenEngine=r.engines[0];
 	return r;
 };
diff --git a/app/assets/javascripts/routing_engines/cloudmade_foot.js b/app/assets/javascripts/routing_engines/cloudmade_foot.js
new file mode 100644
index 000000000..3d047f8ab
--- /dev/null
+++ b/app/assets/javascripts/routing_engines/cloudmade_foot.js
@@ -0,0 +1,26 @@
+// CloudMade foot engine
+// *** again, this should be shared from a Cloudmade library somewhere
+// *** this API key is taken from some example code, not for real live use!
+
+OSM.RoutingEngines.list.push({
+	name: 'Foot (CloudMade)',
+	draggable: true,
+	getRoute: function(final,points) {
+		var url="http://routes.cloudmade.com/8ee2a50541944fb9bcedded5165f09d9/api/0.3/";
+		var p=[];
+		for (var i=0; i<points.length; i++) {
+			p.push(points[i][0]);
+			p.push(points[i][1]);
+		}
+		url+=p.join(',');
+		url+="/foot.js";
+		this.requestJSONP(url+"?callback=");
+	},
+	gotRoute: function(data) {
+		console.log(data);
+		// *** todo
+		// *** will require some degree of refactoring because instruction text is pre-assembled
+		// *** otherwise largely like OSRM (funny that)
+	}
+});
+
diff --git a/app/assets/javascripts/routing_engines/osrm_car.js b/app/assets/javascripts/routing_engines/osrm_car.js
new file mode 100644
index 000000000..f0c05a850
--- /dev/null
+++ b/app/assets/javascripts/routing_engines/osrm_car.js
@@ -0,0 +1,30 @@
+// OSRM car engine
+// *** this should all be shared from an OSRM library somewhere
+// *** need to clear hints at some point
+
+OSM.RoutingEngines.list.push({
+	name: 'Car (OSRM)',
+	draggable: true,
+	_hints: {},
+	getRoute: function(final,points) {
+		var url="http://router.project-osrm.org/viaroute?z=14&output=json";
+		for (var i=0; i<points.length; i++) {
+			var pair=points[i].join(',');
+			url+="&loc="+pair;
+			if (this._hints[pair]) url+= "&hint="+this._hints[pair];
+		}
+		if (final) url+="&instructions=true";
+		this.requestJSONP(url+"&jsonp=");
+	},
+	gotRoute: function(router,data) {
+		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; }
+		router.setPolyline(line);
+		router.setItinerary(data.route_instructions);
+	}
+});

From 7834c628e9088081fac0236f3f0aa6d22ff98452 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Wed, 22 Jan 2014 12:52:51 +0000
Subject: [PATCH 11/88] Simplify usage, fix closures

---
 app/assets/javascripts/index.js       |  1 -
 app/assets/javascripts/routing.js.erb | 29 ++++++++++++++-------------
 2 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index 9ddac98a3..7369c0fb4 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -349,7 +349,6 @@ $(document).ready(function () {
   });
 
   OSM.routing = OSM.Routing(map,'OSM.routing',$('.query_wrapper.routing'));
-  OSM.routing.addEngines(OSM.RoutingEngines.list);
   OSM.routing.chooseEngine('Car (OSRM)');
 
   $(".get_directions").on("click",function(e) {
diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index afa15ba4f..e9954bbcb 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -155,23 +155,24 @@ OSM.Routing=function(map,name,jqSearch) {
 	// Routing engine handling
 
 	// Add all engines
-	r.addEngines=function(list) {
-		list.sort(function(a,b) { return a.name>b.name; });
-		r.engines=list;
-		var select=r.jqSearch.find('select.routing_engines');
-		for (var i=0; i<list.length; i++) {
-			// Set up JSONP callback
-			var engine=r.engines[i];
-			engine.requestJSONP=function(url) {
+	var list=OSM.RoutingEngines.list;
+	list.sort(function(a,b) { return a.name>b.name; });
+	var select=r.jqSearch.find('select.routing_engines');
+	for (var i=0; i<list.length; i++) {
+		// Set up JSONP callback
+		with ({num: i}) {
+			list[num].requestJSONP=function(url) {
 				var script = document.createElement('script');
-				script.src = url+r.name+".gotRoute"+this.subscript;
+				script.src = url+r.name+".gotRoute"+num;
 				document.body.appendChild(script); 
 			};
-			r['gotRoute'+i]=function(data) { engine.gotRoute(r,data); };
-			select.append("<option value='"+i+"'>"+engine.name+"</option>");
+			r['gotRoute'+num]=function(data) { list[num].gotRoute(r,data); };
 		}
-		r.chosenEngine=r.engines[0];
-	};
+		select.append("<option value='"+i+"'>"+list[i].name+"</option>");
+	}
+	r.engines=list;
+	r.chosenEngine=list[0];	// default to first engine
+
 	// Choose an engine on dropdown change
 	r.selectEngine=function(e) {
 		r.chosenEngine=r.engines[e.target.selectedIndex];
@@ -180,7 +181,7 @@ OSM.Routing=function(map,name,jqSearch) {
 	r.chooseEngine=function(name) {
 		for (var i=0; i<r.engines.length; i++) {
 			if (r.engines[i].name==name) {
-				r.chosenEngine[i]=r.engines[i];
+				r.chosenEngine=r.engines[i];
 				r.jqSearch.find('select.routing_engines').val(i);
 			}
 		}

From c4f3d1bd32315abdcf057cae586bbf76eb6263b9 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Wed, 22 Jan 2014 15:53:35 +0000
Subject: [PATCH 12/88] Start MapQuest Open support

---
 .../routing_engines/cloudmade_foot.js         |  3 +-
 .../routing_engines/mapquest_bicycle.js       | 35 +++++++++++++++++++
 2 files changed, 37 insertions(+), 1 deletion(-)
 create mode 100644 app/assets/javascripts/routing_engines/mapquest_bicycle.js

diff --git a/app/assets/javascripts/routing_engines/cloudmade_foot.js b/app/assets/javascripts/routing_engines/cloudmade_foot.js
index 3d047f8ab..149ceb31a 100644
--- a/app/assets/javascripts/routing_engines/cloudmade_foot.js
+++ b/app/assets/javascripts/routing_engines/cloudmade_foot.js
@@ -1,6 +1,7 @@
 // CloudMade foot engine
 // *** again, this should be shared from a Cloudmade library somewhere
 // *** this API key is taken from some example code, not for real live use!
+// http://cloudmade.com/documentation/routing
 
 OSM.RoutingEngines.list.push({
 	name: 'Foot (CloudMade)',
@@ -16,7 +17,7 @@ OSM.RoutingEngines.list.push({
 		url+="/foot.js";
 		this.requestJSONP(url+"?callback=");
 	},
-	gotRoute: function(data) {
+	gotRoute: function(router,data) {
 		console.log(data);
 		// *** todo
 		// *** will require some degree of refactoring because instruction text is pre-assembled
diff --git a/app/assets/javascripts/routing_engines/mapquest_bicycle.js b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
new file mode 100644
index 000000000..123f2700a
--- /dev/null
+++ b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
@@ -0,0 +1,35 @@
+// see: 
+// http://developer.mapquest.com/web/products/open/directions-service
+// http://open.mapquestapi.com/directions/
+// https://github.com/apmon/openstreetmap-website/blob/21edc353a4558006f0ce23f5ec3930be6a7d4c8b/app/controllers/routing_controller.rb#L153
+
+// *** needs to give credit
+
+OSM.RoutingEngines.list.push({
+	name: 'Bicycle (MapQuest Open)',
+	draggable: true,
+	_hints: {},
+	getRoute: function(final,points) {
+		var url="http://open.mapquestapi.com/directions/v2/route?key=Fmjtd%7Cluur290anu%2Crl%3Do5-908a0y";
+		var from=points[0]; var to=points[points.length-1];
+		url+="&from="+from.join(',');
+		url+="&to="+to.join(',');
+		url+="&routeType=bicycle";
+		url+="&manMaps=false";
+		url+="&shapeFormat=raw&generalize=0";
+		this.requestJSONP(url+"&callback=");
+	},
+	gotRoute: function(router,data) {
+		var poly=[];
+		var shape=data.route.shape.shapePoints;
+		for (var i=0; i<shape.length; i+=2) {
+			poly.push(L.latLng(shape[i],shape[i+1]));
+		}
+		router.setPolyline(poly);
+
+		// data.shape.maneuverIndexes links turns to polyline positions
+		// data.legs[0].maneuvers is list of turns
+		console.log(data);
+//		router.setItinerary(data.route_instructions);
+	}
+});

From d14406cead2782c382de89428a2dcc5bb3e85ae8 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Wed, 22 Jan 2014 18:20:07 +0000
Subject: [PATCH 13/88] Move more engine-specific stuff out of main .js

---
 app/assets/javascripts/routing.js.erb         | 31 +++++++------------
 .../javascripts/routing_engines/osrm_car.js   | 16 ++++++++--
 2 files changed, 26 insertions(+), 21 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index e9954bbcb..27818b66b 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -99,10 +99,11 @@ OSM.Routing=function(map,name,jqSearch) {
 		r.map.fitBounds(r.polyline.getBounds());
 	};
 
-	// Take an array of directions and write it out
-	// (we use OSRM's route_instructions format)
+	// Take directions and write them out
+	// data = { steps: array of [latlng, sprite number, instruction text, distance in metres] }
+	// sprite numbers equate to OSRM's route_instructions turn values
 	// *** translations?
-	r.setItinerary=function(steps) {
+	r.setItinerary=function(data) {
 		// Create base table
 		$("#content").removeClass("overlay-sidebar");
 		$('#sidebar_content').empty();
@@ -111,16 +112,10 @@ OSM.Routing=function(map,name,jqSearch) {
 		$('#sidebar_content').html(html);
 		// Add each row
 		var cumulative=0;
-		for (var i=0; i<steps.length; i++) {
-			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)"; }
+		for (var i=0; i<data.steps.length; i++) {
+			var step=data.steps[i];
 			// Distance
-			var dist=step[2];
+			var dist=step[3];
 			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"; }
@@ -128,16 +123,14 @@ OSM.Routing=function(map,name,jqSearch) {
 			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='direction i"+step[1]+"'> ");
+			row.append("<td class='instruction'>"+step[2]);
 			row.append("<td class='distance'>"+dist);
-			with ({num: i, dist: step[3]}) {
-				row.on('click',function(e) { 
-					r.clickTurn(num, r.polyline.getLatLngs()[dist]);
-				});
+			with ({ num: i, ll: step[0] }) {
+				row.on('click',function(e) { r.clickTurn(num, ll); });
 			};
 			$('#turnbyturn').append(row);
-			cumulative+=step[2];
+			cumulative+=step[3];
 		}
 	};
 	r.clickTurn=function(num,latlng) {
diff --git a/app/assets/javascripts/routing_engines/osrm_car.js b/app/assets/javascripts/routing_engines/osrm_car.js
index f0c05a850..0fdb42889 100644
--- a/app/assets/javascripts/routing_engines/osrm_car.js
+++ b/app/assets/javascripts/routing_engines/osrm_car.js
@@ -21,10 +21,22 @@ OSM.RoutingEngines.list.push({
 			alert("Couldn't find route between those two places");
 			return false;
 		}
-		// *** store hints
+		// Draw polyline
 		var line=L.PolylineUtil.decode(data.route_geometry);
 		for (i=0; i<line.length; i++) { line[i].lat/=10; line[i].lng/=10; }
 		router.setPolyline(line);
-		router.setItinerary(data.route_instructions);
+		// *** store hints
+		// Assemble instructions
+		var steps=[];
+		for (i=0; i<data.route_instructions.length; i++) {
+			var s=data.route_instructions[i];
+			var instCodes=s[0].split('-');
+			var instText="<b>"+(i+1)+".</b> ";
+			instText+=TURN_INSTRUCTIONS[instCodes[0]];
+			if (instCodes[1]) { instText+="exit "+instCodes[1]+" "; }
+			if (instCodes[0]!=15) { instText+=s[1] ? "<b>"+s[1]+"</b>" : "(unnamed)"; }
+			steps.push([line[s[3]], s[0].split('-')[0], instText, s[2]]);
+		}
+		router.setItinerary({ steps: steps });
 	}
 });

From 36ee18b88eaff9a6a9c1bc555a9e70ec4dae180e Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Wed, 22 Jan 2014 18:38:07 +0000
Subject: [PATCH 14/88] Parse MapQuest directions

---
 .../routing_engines/mapquest_bicycle.js       | 32 ++++++++++++++++++-
 1 file changed, 31 insertions(+), 1 deletion(-)

diff --git a/app/assets/javascripts/routing_engines/mapquest_bicycle.js b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
index 123f2700a..5dfe13234 100644
--- a/app/assets/javascripts/routing_engines/mapquest_bicycle.js
+++ b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
@@ -9,6 +9,27 @@ OSM.RoutingEngines.list.push({
 	name: 'Bicycle (MapQuest Open)',
 	draggable: true,
 	_hints: {},
+	MQ_SPRITE_MAP: {
+		0: 1, // straight
+		1: 2, // slight right
+		2: 3, // right
+		3: 4, // sharp right
+		4: 5, // reverse
+		5: 6, // sharp left
+		6: 7, // left
+		7: 8, // slight left
+		8: 5, // right U-turn
+		9: 5, // left U-turn
+		10: 2, // right merge
+		11: 8, // left merge
+		12: 2, // right on-ramp
+		13: 8, // left on-ramp
+		14: 2, // right off-ramp
+		15: 8, // left off-ramp
+		16: 2, // right fork
+		17: 8, // left fork
+		18: 1  // straight fork
+	},
 	getRoute: function(final,points) {
 		var url="http://open.mapquestapi.com/directions/v2/route?key=Fmjtd%7Cluur290anu%2Crl%3Do5-908a0y";
 		var from=points[0]; var to=points[points.length-1];
@@ -20,6 +41,8 @@ OSM.RoutingEngines.list.push({
 		this.requestJSONP(url+"&callback=");
 	},
 	gotRoute: function(router,data) {
+		// *** what if no route?
+		
 		var poly=[];
 		var shape=data.route.shape.shapePoints;
 		for (var i=0; i<shape.length; i+=2) {
@@ -30,6 +53,13 @@ OSM.RoutingEngines.list.push({
 		// data.shape.maneuverIndexes links turns to polyline positions
 		// data.legs[0].maneuvers is list of turns
 		console.log(data);
-//		router.setItinerary(data.route_instructions);
+		var steps=[];
+		var mq=data.route.legs[0].maneuvers;
+		for (var i=0; i<mq.length; i++) {
+			var s=mq[i];
+			var d=(i==mq.length-1) ? 15: this.MQ_SPRITE_MAP[s.turnType];
+			steps.push([L.latLng(s.startPoint.lat, s.startPoint.lng), d, s.narrative, s.distance*1000]);
+		}
+		router.setItinerary( { steps: steps });
 	}
 });

From 81ebdee1852bae569d0ee82233578155f10d1bfb Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Wed, 22 Jan 2014 18:53:30 +0000
Subject: [PATCH 15/88] Parse CloudMade directions

---
 .../routing_engines/cloudmade_foot.js         | 22 +++++++++++++++----
 1 file changed, 18 insertions(+), 4 deletions(-)

diff --git a/app/assets/javascripts/routing_engines/cloudmade_foot.js b/app/assets/javascripts/routing_engines/cloudmade_foot.js
index 149ceb31a..a2b7bbc9a 100644
--- a/app/assets/javascripts/routing_engines/cloudmade_foot.js
+++ b/app/assets/javascripts/routing_engines/cloudmade_foot.js
@@ -6,6 +6,16 @@
 OSM.RoutingEngines.list.push({
 	name: 'Foot (CloudMade)',
 	draggable: true,
+	CM_SPRITE_MAP: {
+		"C": 1,
+		"TL": 7,
+		"TSLL": 8,
+		"TSHL": 6,
+		"TR": 3,
+		"TSLR": 2,
+		"TSHR": 4,
+		"TU": 5
+	}, // was half expecting to see TLDR in there
 	getRoute: function(final,points) {
 		var url="http://routes.cloudmade.com/8ee2a50541944fb9bcedded5165f09d9/api/0.3/";
 		var p=[];
@@ -18,10 +28,14 @@ OSM.RoutingEngines.list.push({
 		this.requestJSONP(url+"?callback=");
 	},
 	gotRoute: function(router,data) {
-		console.log(data);
-		// *** todo
-		// *** will require some degree of refactoring because instruction text is pre-assembled
-		// *** otherwise largely like OSRM (funny that)
+		router.setPolyline(data.route_geometry);
+		// Assemble instructions
+		var steps=[];
+		for (i=0; i<data.route_instructions.length; i++) {
+			var s=data.route_instructions[i];
+			steps.push([data.route_geometry[s[2]], this.CM_SPRITE_MAP[s[7]], s[0], s[1]]);
+		}
+		router.setItinerary({ steps: steps });
 	}
 });
 

From 576745e332c83d74890a19a323d310e602be9dac Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Wed, 22 Jan 2014 20:29:38 +0000
Subject: [PATCH 16/88] Allow user to click Go before geocode result

---
 app/assets/javascripts/routing.js.erb | 23 ++++++++++++++++-------
 1 file changed, 16 insertions(+), 7 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 27818b66b..7837c5327 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -11,9 +11,8 @@
 	*** export GPX
 	*** URL history (or do we consciously not want to support that?)
 
-	*** add MapQuest engine
 	*** add YOURS engine
-	*** finish CloudMade engine
+	*** add GraphHopper engine
 */
 
 var TURN_INSTRUCTIONS=["",
@@ -49,15 +48,17 @@ OSM.RoutingEngines={
 
 OSM.Routing=function(map,name,jqSearch) {
 	var r={};
+
 	r.map=map;				// Leaflet map
 	r.name=name;			// global variable name of this instance (needed for JSONP)
 	r.jqSearch=jqSearch;	// JQuery object for search panel
 
-	r.route_from=null;
-	r.route_to=null;
-	r.viaPoints=[];
-	r.polyline=null;
-	r.chosenEngine=null;
+	r.route_from=null;		// null=unset, false=awaiting response, [lat,lon]=geocoded
+	r.route_to=null;		//  |
+	r.awaitingGeocode=false;// true if the user has requested a route, but we're waiting on a geocode result
+	r.viaPoints=[];			// not yet used
+	r.polyline=null;		// Leaflet polyline object
+	r.chosenEngine=null;	// currently selected routing engine
 
 	// Geocoding
 
@@ -68,6 +69,7 @@ OSM.Routing=function(map,name,jqSearch) {
 		var querystring = '<%= NOMINATIM_URL %>search?q=' + encodeURIComponent(v) + '&format=json';
 		// *** &accept-language=<%#= request.user_preferred_languages.join(',') %>
 		// *** prefer current viewport
+		r[field.id]=false;
 		$.getJSON(querystring, function(json) { _this._gotGeocode(json,field); });
 	};
 	
@@ -81,6 +83,10 @@ OSM.Routing=function(map,name,jqSearch) {
 		var lat=Number(json[0].lat), lon=Number(json[0].lon);
 		r[field.id]=[lat,lon];
 		// ** update markers
+		if (r.awaitingGeocode) {
+			r.awaitingGeocode=false;
+			r.requestRoute();
+		}
 	};
 	
 	// Route-fetching UI
@@ -89,6 +95,9 @@ OSM.Routing=function(map,name,jqSearch) {
 		if (r.route_from && r.route_to) {
 			r.chosenEngine.getRoute(true,[r.route_from,r.route_to]);
 			// then, when the route has been fetched, it'll call the engine's gotRoute function
+		} else if (r.route_from==false || r.route_to==false) {
+			// we're waiting for a Nominatim response before we can request a route
+			r.awaitingGeocode=true;
 		}
 	};
 

From d40d32889c85577347733fcf9040002600e1962b Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Wed, 22 Jan 2014 20:31:58 +0000
Subject: [PATCH 17/88] Remove logging

---
 app/assets/javascripts/routing_engines/mapquest_bicycle.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/app/assets/javascripts/routing_engines/mapquest_bicycle.js b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
index 5dfe13234..bf3387078 100644
--- a/app/assets/javascripts/routing_engines/mapquest_bicycle.js
+++ b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
@@ -52,7 +52,6 @@ OSM.RoutingEngines.list.push({
 
 		// data.shape.maneuverIndexes links turns to polyline positions
 		// data.legs[0].maneuvers is list of turns
-		console.log(data);
 		var steps=[];
 		var mq=data.route.legs[0].maneuvers;
 		for (var i=0; i<mq.length; i++) {

From 08837b2f8b3a8434875682f8f18962a9bce73c46 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Thu, 23 Jan 2014 00:49:00 +0000
Subject: [PATCH 18/88] Start work on drag-and-drop start/end markers

---
 app/assets/javascripts/index.js        | 3 +++
 app/assets/javascripts/routing.js.erb  | 6 ++++++
 app/assets/stylesheets/common.css.scss | 2 ++
 app/views/layouts/_search.html.erb     | 2 ++
 4 files changed, 13 insertions(+)

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index 7369c0fb4..f3df5ae67 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -356,6 +356,8 @@ $(document).ready(function () {
 	$(".search").hide();
 	$(".routing").show();
 	$(".query_wrapper.routing [name=route_from]").focus();
+	$("#map").on('dragend dragover',function(e) { e.preventDefault(); });
+	$("#map").on('drop',function(e) { OSM.routing.handleDrop(e); });
   });
 
   $(".close_directions").on("click",function(e) {
@@ -363,6 +365,7 @@ $(document).ready(function () {
 	$(".search").show();
 	$(".routing").hide();
 	OSM.routing.close();
+	$("#map").off('dragend drop dragover');
 	$(".query_wrapper.search [name=query]").focus();
   });
 
diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 7837c5327..45ae08d81 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -88,6 +88,12 @@ OSM.Routing=function(map,name,jqSearch) {
 			r.requestRoute();
 		}
 	};
+
+	// Drag and drop markers
+	
+	r.handleDrop=function(e) {
+ 		console.log(r.map.mouseEventToLatLng(e.originalEvent))
+	};
 	
 	// Route-fetching UI
 
diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index d0732de74..0f306b6d3 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -1024,6 +1024,8 @@ tr.turn {
 tr.turn:hover {
     background: lighten($green, 30%); 
 }
+.routing_engines, #route_from, #route_to { margin-left: 25px; }
+.routing_marker { width: 15px; position: absolute; }
 
 /* Rules for entity history */
 
diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index bf734fce2..da0d0dcad 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -15,7 +15,9 @@
   </div>
 
   <div class='query_wrapper routing'>
+    <%= image_tag "marker-green.png", :class => 'routing_marker', :draggable => 'true' %>
     <%= text_field_tag "route_from", params[:from], :placeholder => "From", :onchange=>"OSM.routing.geocode('route_from',event)" %>
+    <%= image_tag "marker-red.png"  , :class => 'routing_marker', :draggable => 'true' %>
     <%= text_field_tag "route_to"  , params[:to]  , :placeholder => "To"  , :onchange=>"OSM.routing.geocode('route_to'  ,event)" %>
     <select class='routing_engines' name='routing_engines' onchange="OSM.routing.selectEngine(event)"></select>
   </div>

From edd6235b45164bff20cbe8f2a0c9d10027211cf4 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Thu, 23 Jan 2014 10:26:04 +0000
Subject: [PATCH 19/88] More work on draggable markers

---
 app/assets/javascripts/index.js       | 29 ++++++++------
 app/assets/javascripts/routing.js.erb | 58 ++++++++++++++++++++++++---
 app/views/layouts/_search.html.erb    |  4 +-
 3 files changed, 72 insertions(+), 19 deletions(-)

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index f3df5ae67..fc772a1a8 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -352,21 +352,26 @@ $(document).ready(function () {
   OSM.routing.chooseEngine('Car (OSRM)');
 
   $(".get_directions").on("click",function(e) {
-	e.preventDefault();
-	$(".search").hide();
-	$(".routing").show();
-	$(".query_wrapper.routing [name=route_from]").focus();
-	$("#map").on('dragend dragover',function(e) { e.preventDefault(); });
-	$("#map").on('drop',function(e) { OSM.routing.handleDrop(e); });
+    e.preventDefault();
+    $(".search").hide();
+    $(".routing").show();
+    $(".query_wrapper.routing [name=route_from]").focus();
+    $("#map").on('dragend dragover',function(e) { e.preventDefault(); });
+    $("#map").on('drop',function(e) { OSM.routing.handleDrop(e); });
+    $(".routing_marker").on('dragstart',function(e) {
+    e.originalEvent.dataTransfer.effectAllowed = 'move';
+      e.originalEvent.dataTransfer.setData('id', this.id);
+    });
   });
 
   $(".close_directions").on("click",function(e) {
-	e.preventDefault();
-	$(".search").show();
-	$(".routing").hide();
-	OSM.routing.close();
-	$("#map").off('dragend drop dragover');
-	$(".query_wrapper.search [name=query]").focus();
+    e.preventDefault();
+    $(".search").show();
+    $(".routing").hide();
+    OSM.routing.close();
+    $("#map").off('dragend drop dragover');
+    $(".routing_marker").off('dragstart');
+    $(".query_wrapper.search [name=query]").focus();
   });
 
 });
diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 45ae08d81..81cd3e7a1 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -57,9 +57,31 @@ OSM.Routing=function(map,name,jqSearch) {
 	r.route_to=null;		//  |
 	r.awaitingGeocode=false;// true if the user has requested a route, but we're waiting on a geocode result
 	r.viaPoints=[];			// not yet used
+
 	r.polyline=null;		// Leaflet polyline object
+	r.popup=null;			// Leaflet popup object
+	r.marker_from=null;		// Leaflet from marker
+	r.marker_to=null;		// Leaflet to marker
+
 	r.chosenEngine=null;	// currently selected routing engine
 
+	var icon_from = L.icon({
+		iconUrl: <%= asset_path('marker-green.png').to_json %>,
+		iconSize: [25, 41],
+		iconAnchor: [12, 41],
+		popupAnchor: [1, -34],
+		shadowUrl: <%= asset_path('images/marker-shadow.png').to_json %>,
+		shadowSize: [41, 41]
+	});
+	var icon_to = L.icon({
+		iconUrl: <%= asset_path('marker-red.png').to_json %>,
+		iconSize: [25, 41],
+		iconAnchor: [12, 41],
+		popupAnchor: [1, -34],
+		shadowUrl: <%= asset_path('images/marker-shadow.png').to_json %>,
+		shadowSize: [41, 41]
+	});
+
 	// Geocoding
 
 	r.geocode=function(id,event) { var _this=this;
@@ -82,7 +104,7 @@ OSM.Routing=function(map,name,jqSearch) {
 		field.value=json[0].display_name;
 		var lat=Number(json[0].lat), lon=Number(json[0].lon);
 		r[field.id]=[lat,lon];
-		// ** update markers
+		r.updateMarkers(field.id);
 		if (r.awaitingGeocode) {
 			r.awaitingGeocode=false;
 			r.requestRoute();
@@ -92,7 +114,31 @@ OSM.Routing=function(map,name,jqSearch) {
 	// Drag and drop markers
 	
 	r.handleDrop=function(e) {
- 		console.log(r.map.mouseEventToLatLng(e.originalEvent))
+		var id=e.originalEvent.dataTransfer.getData('id');
+		var ll=r.map.mouseEventToLatLng(e.originalEvent);
+		// *** ^^^ this is slightly off - we need to work out the latLng of the tip
+		r.createMarker(ll,id);
+		// update to/from field
+	};
+	r.createMarker=function(latlng,id) {
+		if (r[id]) r.map.removeLayer(r[id]);
+		r[id]=L.marker(latlng, {
+			icon: id=='marker_from' ? icon_from : icon_to,
+			draggable: true,
+			name: id
+		}).addTo(r.map);
+		r[id].on('drag',r.markerDragged);
+		r[id].on('dragend',r.markerDragged);
+	};
+	r.updateMarkers=function(id) {
+	};
+	r.markerDragged=function(e) {
+		// marker has been dragged
+		if (e.type=='drag' && !r.chosenEngine.draggable) return;
+		// *** also return if e.type=='drag' and not long enough since last request returned
+		// *** but always do if e.type=='dragend'
+		console.log(e.target.options.name);
+		console.log(e.target.getLatLng());
 	};
 	
 	// Route-fetching UI
@@ -149,15 +195,17 @@ OSM.Routing=function(map,name,jqSearch) {
 		}
 	};
 	r.clickTurn=function(num,latlng) {
-		L.popup().setLatLng(latlng).setContent("<p>"+(num+1)+"</p>").openOn(r.map);
+		r.popup=L.popup().setLatLng(latlng).setContent("<p>"+(num+1)+"</p>").openOn(r.map);
 	};
 
-
 	// Close all routing UI
 	
 	r.close=function() {
 		$("#content").addClass("overlay-sidebar");
-		if (r.polyline) map.removeLayer(r.polyline);
+		var remove=[r.polyline,r.popup,r.marker_from,r.marker_to];
+		for (var i=0; i<remove.length; i++) {
+			if (remove[i]) map.removeLayer(remove[i]);
+		}
 	};
 
 	// Routing engine handling
diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index da0d0dcad..e1c85f3b7 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -15,9 +15,9 @@
   </div>
 
   <div class='query_wrapper routing'>
-    <%= image_tag "marker-green.png", :class => 'routing_marker', :draggable => 'true' %>
+    <%= image_tag "marker-green.png", :class => 'routing_marker', :id => 'marker_from', :draggable => 'true' %>
     <%= text_field_tag "route_from", params[:from], :placeholder => "From", :onchange=>"OSM.routing.geocode('route_from',event)" %>
-    <%= image_tag "marker-red.png"  , :class => 'routing_marker', :draggable => 'true' %>
+    <%= image_tag "marker-red.png"  , :class => 'routing_marker', :id => 'marker_to'  , :draggable => 'true' %>
     <%= text_field_tag "route_to"  , params[:to]  , :placeholder => "To"  , :onchange=>"OSM.routing.geocode('route_to'  ,event)" %>
     <select class='routing_engines' name='routing_engines' onchange="OSM.routing.selectEngine(event)"></select>
   </div>

From e825f8b2647fb1bc62fb017149930b94ec4d4ea2 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Thu, 23 Jan 2014 11:38:01 +0000
Subject: [PATCH 20/88] More draggable routes work

---
 app/assets/javascripts/routing.js.erb         | 25 ++++++++++++-------
 .../routing_engines/cloudmade_foot.js         |  2 +-
 .../routing_engines/mapquest_bicycle.js       |  2 +-
 .../javascripts/routing_engines/osrm_car.js   |  2 +-
 4 files changed, 19 insertions(+), 12 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 81cd3e7a1..0c11f93a0 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -56,6 +56,7 @@ OSM.Routing=function(map,name,jqSearch) {
 	r.route_from=null;		// null=unset, false=awaiting response, [lat,lon]=geocoded
 	r.route_to=null;		//  |
 	r.awaitingGeocode=false;// true if the user has requested a route, but we're waiting on a geocode result
+	r.awaitingRoute=false;	// true if we've asked the engine for a route and are waiting to hear back
 	r.viaPoints=[];			// not yet used
 
 	r.polyline=null;		// Leaflet polyline object
@@ -107,7 +108,7 @@ OSM.Routing=function(map,name,jqSearch) {
 		r.updateMarkers(field.id);
 		if (r.awaitingGeocode) {
 			r.awaitingGeocode=false;
-			r.requestRoute();
+			r.requestRoute(true);
 		}
 	};
 
@@ -118,6 +119,8 @@ OSM.Routing=function(map,name,jqSearch) {
 		var ll=r.map.mouseEventToLatLng(e.originalEvent);
 		// *** ^^^ this is slightly off - we need to work out the latLng of the tip
 		r.createMarker(ll,id);
+		r[id.replace('marker','route')]=[ll.lat,ll.lng];
+		r.requestRoute(true);
 		// update to/from field
 	};
 	r.createMarker=function(latlng,id) {
@@ -135,17 +138,20 @@ OSM.Routing=function(map,name,jqSearch) {
 	r.markerDragged=function(e) {
 		// marker has been dragged
 		if (e.type=='drag' && !r.chosenEngine.draggable) return;
-		// *** also return if e.type=='drag' and not long enough since last request returned
-		// *** but always do if e.type=='dragend'
-		console.log(e.target.options.name);
-		console.log(e.target.getLatLng());
+		if (e.type=='drag' && r.awaitingRoute) return;
+		var id=e.target.options.name;
+		var ll=e.target.getLatLng();
+		r[id.replace('marker','route')]=[ll.lat,ll.lng];
+		r.requestRoute(e.type=='dragend');
+		// update to/from field
 	};
 	
 	// Route-fetching UI
 
-	r.requestRoute=function() {
+	r.requestRoute=function(final) {
 		if (r.route_from && r.route_to) {
-			r.chosenEngine.getRoute(true,[r.route_from,r.route_to]);
+			r.awaitingRoute=true;
+			r.chosenEngine.getRoute(final,[r.route_from,r.route_to]);
 			// then, when the route has been fetched, it'll call the engine's gotRoute function
 		} else if (r.route_from==false || r.route_to==false) {
 			// we're waiting for a Nominatim response before we can request a route
@@ -157,7 +163,8 @@ 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);
-		r.map.fitBounds(r.polyline.getBounds());
+		// r.map.fitBounds(r.polyline.getBounds());
+		// *** ^^^ we only want to do this for geocode-originated routes
 	};
 
 	// Take directions and write them out
@@ -222,7 +229,7 @@ OSM.Routing=function(map,name,jqSearch) {
 				script.src = url+r.name+".gotRoute"+num;
 				document.body.appendChild(script); 
 			};
-			r['gotRoute'+num]=function(data) { list[num].gotRoute(r,data); };
+			r['gotRoute'+num]=function(data) { r.awaitingRoute=false; list[num].gotRoute(r,data); };
 		}
 		select.append("<option value='"+i+"'>"+list[i].name+"</option>");
 	}
diff --git a/app/assets/javascripts/routing_engines/cloudmade_foot.js b/app/assets/javascripts/routing_engines/cloudmade_foot.js
index a2b7bbc9a..7aa147e5c 100644
--- a/app/assets/javascripts/routing_engines/cloudmade_foot.js
+++ b/app/assets/javascripts/routing_engines/cloudmade_foot.js
@@ -5,7 +5,7 @@
 
 OSM.RoutingEngines.list.push({
 	name: 'Foot (CloudMade)',
-	draggable: true,
+	draggable: false,
 	CM_SPRITE_MAP: {
 		"C": 1,
 		"TL": 7,
diff --git a/app/assets/javascripts/routing_engines/mapquest_bicycle.js b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
index bf3387078..2f7642de9 100644
--- a/app/assets/javascripts/routing_engines/mapquest_bicycle.js
+++ b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
@@ -7,7 +7,7 @@
 
 OSM.RoutingEngines.list.push({
 	name: 'Bicycle (MapQuest Open)',
-	draggable: true,
+	draggable: false,
 	_hints: {},
 	MQ_SPRITE_MAP: {
 		0: 1, // straight
diff --git a/app/assets/javascripts/routing_engines/osrm_car.js b/app/assets/javascripts/routing_engines/osrm_car.js
index 0fdb42889..e3eb6b44c 100644
--- a/app/assets/javascripts/routing_engines/osrm_car.js
+++ b/app/assets/javascripts/routing_engines/osrm_car.js
@@ -37,6 +37,6 @@ OSM.RoutingEngines.list.push({
 			if (instCodes[0]!=15) { instText+=s[1] ? "<b>"+s[1]+"</b>" : "(unnamed)"; }
 			steps.push([line[s[3]], s[0].split('-')[0], instText, s[2]]);
 		}
-		router.setItinerary({ steps: steps });
+		if (steps.length) router.setItinerary({ steps: steps });
 	}
 });

From 423b13d5cefed2efd986ff468cf6375ef899c62a Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Thu, 23 Jan 2014 20:19:06 +0000
Subject: [PATCH 21/88] Add GraphHopper engine (thanks @karussell!)

---
 .../routing_engines/graphhopper_bicycle.js    | 48 +++++++++++++++++++
 1 file changed, 48 insertions(+)
 create mode 100644 app/assets/javascripts/routing_engines/graphhopper_bicycle.js

diff --git a/app/assets/javascripts/routing_engines/graphhopper_bicycle.js b/app/assets/javascripts/routing_engines/graphhopper_bicycle.js
new file mode 100644
index 000000000..39c7bca59
--- /dev/null
+++ b/app/assets/javascripts/routing_engines/graphhopper_bicycle.js
@@ -0,0 +1,48 @@
+// GraphHopper bicycle engine
+
+OSM.RoutingEngines.list.push({    
+    name: 'Bicycle (GraphHopper)',
+    draggable: true,
+    _hints: {},
+    getRoute: function(final, points) {
+        var url = "http://graphhopper.com/routing/api/route?vehicle=bike&locale=en";
+        for (var i = 0; i < points.length; i++) {
+            var pair = points[i].join(',');
+            url += "&point=" + pair;
+        }
+        if (final)
+            url += "&instructions=true";
+        this.requestJSONP(url + "&type=jsonp&callback=");
+    },
+    gotRoute: function(router, data) {
+        if (!data.info.routeFound) {
+            alert("Couldn't find route between those two places");
+            return false;
+        }
+        // Draw polyline
+        var line = L.PolylineUtil.decode(data.route.coordinates);
+        router.setPolyline(line);
+        // Assemble instructions
+        var steps = [];
+        var instr = data.route.instructions;
+        for (i = 0; i < instr.descriptions.length; i++) {
+            var indi = instr.indications[i];
+            var instrCode = (i==instr.descriptions.length-1) ? 15 : this.GH_INSTR_MAP[indi];
+            var instrText = "<b>" + (i + 1) + ".</b> ";
+            instrText += instr.descriptions[i];
+            var latlng = instr.latLngs[i];
+            var distInMeter = instr.distances[i];            
+            steps.push([{lat: latlng[0], lng: latlng[1]}, instrCode, instrText, distInMeter]);
+        }
+        router.setItinerary({steps: steps});
+    },
+    GH_INSTR_MAP: {
+        "-3": 6, // sharp left
+        "-2": 7, // left	
+        "-1": 8, // slight left                
+        0: 0, // straight
+        1: 1, // slight right
+        2: 2, // right
+        3: 3 // sharp right		
+    }
+});

From 7c13b43f316d76226e0812651ea1026c337a5e03 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Thu, 23 Jan 2014 21:10:11 +0000
Subject: [PATCH 22/88] Integrate marker & geocoding behaviours

---
 app/assets/javascripts/routing.js.erb | 27 +++++++++++++++++++--------
 1 file changed, 19 insertions(+), 8 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 0c11f93a0..ce8ec93e8 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -10,6 +10,7 @@
 	*** translation (including all alerts and presentation)
 	*** export GPX
 	*** URL history (or do we consciously not want to support that?)
+	*** spinner when waiting for result (beneath 'Go' button?)
 
 	*** add YOURS engine
 	*** add GraphHopper engine
@@ -105,7 +106,7 @@ OSM.Routing=function(map,name,jqSearch) {
 		field.value=json[0].display_name;
 		var lat=Number(json[0].lat), lon=Number(json[0].lon);
 		r[field.id]=[lat,lon];
-		r.updateMarkers(field.id);
+		r.updateMarker(field.id);
 		if (r.awaitingGeocode) {
 			r.awaitingGeocode=false;
 			r.requestRoute(true);
@@ -119,7 +120,7 @@ OSM.Routing=function(map,name,jqSearch) {
 		var ll=r.map.mouseEventToLatLng(e.originalEvent);
 		// *** ^^^ this is slightly off - we need to work out the latLng of the tip
 		r.createMarker(ll,id);
-		r[id.replace('marker','route')]=[ll.lat,ll.lng];
+		r.setNumericInput(ll,id);
 		r.requestRoute(true);
 		// update to/from field
 	};
@@ -133,18 +134,28 @@ OSM.Routing=function(map,name,jqSearch) {
 		r[id].on('drag',r.markerDragged);
 		r[id].on('dragend',r.markerDragged);
 	};
-	r.updateMarkers=function(id) {
+	// Update marker from geocoded route input
+	r.updateMarker=function(id) {
+		var m=id.replace('route','marker');
+		if (!r[m]) { r.createMarker(r[id],m); return; }
+		var ll=r[m].getLatLng();
+		if (ll.lat!=r[id][0] || ll.lng!=r[id][1]) {
+			r.createMarker(r[id],m);
+		}
 	};
+	// Marker has been dragged
 	r.markerDragged=function(e) {
-		// marker has been dragged
 		if (e.type=='drag' && !r.chosenEngine.draggable) return;
 		if (e.type=='drag' && r.awaitingRoute) return;
-		var id=e.target.options.name;
-		var ll=e.target.getLatLng();
-		r[id.replace('marker','route')]=[ll.lat,ll.lng];
+		r.setNumericInput(e.target.getLatLng(), e.target.options.name);
 		r.requestRoute(e.type=='dragend');
-		// update to/from field
 	};
+	// Set a route input field to a numeric value
+	r.setNumericInput=function(ll,id) {
+		var routeid=id.replace('marker','route');
+		r[routeid]=[ll.lat,ll.lng];
+		$("[name="+routeid+"]:visible").val(Math.round(ll.lat*10000)/10000+" "+Math.round(ll.lng*10000)/10000);
+	}
 	
 	// Route-fetching UI
 

From 149182f62009012447eadf66dd38aaa1b30090f9 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Thu, 23 Jan 2014 22:29:09 +0000
Subject: [PATCH 23/88] Apparently 'final' is a reserved word in JS...

---
 app/assets/javascripts/routing.js.erb                         | 4 ++--
 app/assets/javascripts/routing_engines/cloudmade_foot.js      | 2 +-
 app/assets/javascripts/routing_engines/graphhopper_bicycle.js | 4 ++--
 app/assets/javascripts/routing_engines/mapquest_bicycle.js    | 2 +-
 app/assets/javascripts/routing_engines/osrm_car.js            | 4 ++--
 5 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index ce8ec93e8..7f18aa472 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -159,10 +159,10 @@ OSM.Routing=function(map,name,jqSearch) {
 	
 	// Route-fetching UI
 
-	r.requestRoute=function(final) {
+	r.requestRoute=function(isFinal) {
 		if (r.route_from && r.route_to) {
 			r.awaitingRoute=true;
-			r.chosenEngine.getRoute(final,[r.route_from,r.route_to]);
+			r.chosenEngine.getRoute(isFinal,[r.route_from,r.route_to]);
 			// then, when the route has been fetched, it'll call the engine's gotRoute function
 		} else if (r.route_from==false || r.route_to==false) {
 			// we're waiting for a Nominatim response before we can request a route
diff --git a/app/assets/javascripts/routing_engines/cloudmade_foot.js b/app/assets/javascripts/routing_engines/cloudmade_foot.js
index 7aa147e5c..5193c6472 100644
--- a/app/assets/javascripts/routing_engines/cloudmade_foot.js
+++ b/app/assets/javascripts/routing_engines/cloudmade_foot.js
@@ -16,7 +16,7 @@ OSM.RoutingEngines.list.push({
 		"TSHR": 4,
 		"TU": 5
 	}, // was half expecting to see TLDR in there
-	getRoute: function(final,points) {
+	getRoute: function(isFinal,points) {
 		var url="http://routes.cloudmade.com/8ee2a50541944fb9bcedded5165f09d9/api/0.3/";
 		var p=[];
 		for (var i=0; i<points.length; i++) {
diff --git a/app/assets/javascripts/routing_engines/graphhopper_bicycle.js b/app/assets/javascripts/routing_engines/graphhopper_bicycle.js
index 39c7bca59..7f7c83c80 100644
--- a/app/assets/javascripts/routing_engines/graphhopper_bicycle.js
+++ b/app/assets/javascripts/routing_engines/graphhopper_bicycle.js
@@ -4,13 +4,13 @@ OSM.RoutingEngines.list.push({
     name: 'Bicycle (GraphHopper)',
     draggable: true,
     _hints: {},
-    getRoute: function(final, points) {
+    getRoute: function(isFinal, points) {
         var url = "http://graphhopper.com/routing/api/route?vehicle=bike&locale=en";
         for (var i = 0; i < points.length; i++) {
             var pair = points[i].join(',');
             url += "&point=" + pair;
         }
-        if (final)
+        if (isFinal)
             url += "&instructions=true";
         this.requestJSONP(url + "&type=jsonp&callback=");
     },
diff --git a/app/assets/javascripts/routing_engines/mapquest_bicycle.js b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
index 2f7642de9..f74ccba15 100644
--- a/app/assets/javascripts/routing_engines/mapquest_bicycle.js
+++ b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
@@ -30,7 +30,7 @@ OSM.RoutingEngines.list.push({
 		17: 8, // left fork
 		18: 1  // straight fork
 	},
-	getRoute: function(final,points) {
+	getRoute: function(isFinal,points) {
 		var url="http://open.mapquestapi.com/directions/v2/route?key=Fmjtd%7Cluur290anu%2Crl%3Do5-908a0y";
 		var from=points[0]; var to=points[points.length-1];
 		url+="&from="+from.join(',');
diff --git a/app/assets/javascripts/routing_engines/osrm_car.js b/app/assets/javascripts/routing_engines/osrm_car.js
index e3eb6b44c..cb80c5615 100644
--- a/app/assets/javascripts/routing_engines/osrm_car.js
+++ b/app/assets/javascripts/routing_engines/osrm_car.js
@@ -6,14 +6,14 @@ OSM.RoutingEngines.list.push({
 	name: 'Car (OSRM)',
 	draggable: true,
 	_hints: {},
-	getRoute: function(final,points) {
+	getRoute: function(isFinal,points) {
 		var url="http://router.project-osrm.org/viaroute?z=14&output=json";
 		for (var i=0; i<points.length; i++) {
 			var pair=points[i].join(',');
 			url+="&loc="+pair;
 			if (this._hints[pair]) url+= "&hint="+this._hints[pair];
 		}
-		if (final) url+="&instructions=true";
+		if (isFinal) url+="&instructions=true";
 		this.requestJSONP(url+"&jsonp=");
 	},
 	gotRoute: function(router,data) {

From 0e6a41c1c9af4f59dfc658ac598119710d1c853e Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Thu, 23 Jan 2014 22:31:44 +0000
Subject: [PATCH 24/88] Repair Go button

---
 app/assets/javascripts/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index fc772a1a8..d668d6bf7 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -327,7 +327,7 @@ $(document).ready(function () {
     e.preventDefault();
     if ($(".query_wrapper.routing").is(":visible")) {
       // Routing
-      OSM.routing.requestRoute();
+      OSM.routing.requestRoute(true);
     } else {
       // Search
       $("header").addClass("closed");

From 33b18455874a92724c8d806e8d91bf6a6cd6d422 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Thu, 23 Jan 2014 22:32:39 +0000
Subject: [PATCH 25/88] Remove a couple of TODOs

---
 app/assets/javascripts/routing.js.erb | 2 --
 1 file changed, 2 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 7f18aa472..26d2a8b39 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -6,14 +6,12 @@
 	https://github.com/apmon/openstreetmap-website/compare/routing2
 	https://github.com/apmon/openstreetmap-website/blob/9755c3ae0a8d0684d43760f91dc864ff42d8477a/app/views/routing/start.js.erb
 
-	*** draggable start/end markers
 	*** translation (including all alerts and presentation)
 	*** export GPX
 	*** URL history (or do we consciously not want to support that?)
 	*** spinner when waiting for result (beneath 'Go' button?)
 
 	*** add YOURS engine
-	*** add GraphHopper engine
 */
 
 var TURN_INSTRUCTIONS=["",

From 3cfcf18a59ecc759a43d24bea8f6be6e374a83bc Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Thu, 23 Jan 2014 22:53:07 +0000
Subject: [PATCH 26/88] Remove some repeated-query funkiness

---
 app/assets/javascripts/routing.js.erb | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 26d2a8b39..b6bf9f4a0 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -218,9 +218,11 @@ OSM.Routing=function(map,name,jqSearch) {
 	
 	r.close=function() {
 		$("#content").addClass("overlay-sidebar");
-		var remove=[r.polyline,r.popup,r.marker_from,r.marker_to];
+		r.route_from=r.route_to=null;
+		$(".query_wrapper.routing input").val("");
+		var remove=['polyline','popup','marker_from','marker_to'];
 		for (var i=0; i<remove.length; i++) {
-			if (remove[i]) map.removeLayer(remove[i]);
+			if (r[remove[i]]) { map.removeLayer(r[remove[i]]); r[remove[i]]=null; }
 		}
 	};
 

From 3eaf58c151ca9c790dcf6d0937dc186c5c790422 Mon Sep 17 00:00:00 2001
From: Kai Krueger <kakrueger@gmail.com>
Date: Sat, 1 Feb 2014 21:10:54 -0700
Subject: [PATCH 27/88] Make more of the javascript routing functions
 internationalizable

---
 app/assets/javascripts/index.js               |  2 +-
 app/assets/javascripts/routing.js.erb         | 42 ++++++++++---------
 .../routing_engines/cloudmade_foot.js         |  5 ++-
 .../routing_engines/graphhopper_bicycle.js    |  4 +-
 .../routing_engines/mapquest_bicycle.js       |  3 +-
 .../javascripts/routing_engines/osrm_car.js   |  4 +-
 app/views/layouts/_search.html.erb            |  4 +-
 config/locales/de.yml                         | 32 ++++++++++++++
 config/locales/en.yml                         | 28 +++++++++++++
 9 files changed, 94 insertions(+), 30 deletions(-)

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index d668d6bf7..8f989deaf 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -349,7 +349,7 @@ $(document).ready(function () {
   });
 
   OSM.routing = OSM.Routing(map,'OSM.routing',$('.query_wrapper.routing'));
-  OSM.routing.chooseEngine('Car (OSRM)');
+  OSM.routing.chooseEngine('javascripts.directions.engines.osrm_car');
 
   $(".get_directions").on("click",function(e) {
     e.preventDefault();
diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index b6bf9f4a0..3c6db9999 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -14,24 +14,7 @@
 	*** add YOURS engine
 */
 
-var TURN_INSTRUCTIONS=["",
-	"Continue on ",				// 1
-	"Slight right onto ",		// 2
-	"Turn right onto ",			// 3
-	"Sharp right onto ",		// 4
-	"U-turn along ",			// 5
-	"Sharp left onto ",			// 6
-	"Turn left onto ",			// 7
-	"Slight left onto ",		// 8
-	"(via point) ",				// 9
-	"Follow ",					// 10
-	"At roundabout take ",		// 11
-	"Leave roundabout - ",		// 12
-	"Stay on roundabout - ",	// 13
-	"Start at end of ",			// 14
-	"Reach destination",		// 15
-	"Go against one-way on ",	// 16
-	"End of one-way on "]		// 17
+var TURN_INSTRUCTIONS=[]
 
 var ROUTING_POLYLINE={
 	color: '#03f',
@@ -48,6 +31,25 @@ OSM.RoutingEngines={
 OSM.Routing=function(map,name,jqSearch) {
 	var r={};
 
+    TURN_INSTRUCTIONS=["",
+	I18n.t('javascripts.directions.instructions.continue_on'),				// 1
+	I18n.t('javascripts.directions.instructions.slight_right'),		// 2
+	I18n.t('javascripts.directions.instructions.turn_right'),			// 3
+	I18n.t('javascripts.directions.instructions.sharp_right'),		// 4
+	I18n.t('javascripts.directions.instructions.uturn'),			// 5
+	I18n.t('javascripts.directions.instructions.sharp_left'),			// 6
+	I18n.t('javascripts.directions.instructions.turn_left'),			// 7
+	I18n.t('javascripts.directions.instructions.slight_left'),		// 8
+	I18n.t('javascripts.directions.instructions.via_point'),				// 9
+	I18n.t('javascripts.directions.instructions.follow'),					// 10
+	I18n.t('javascripts.directions.instructions.roundabout'),		// 11
+	I18n.t('javascripts.directions.instructions.leave_roundabout'),		// 12
+	I18n.t('javascripts.directions.instructions.stay_roundabout'),	// 13
+	I18n.t('javascripts.directions.instructions.start'),			// 14
+	I18n.t('javascripts.directions.instructions.destination'),		// 15
+	I18n.t('javascripts.directions.instructions.against_oneway'),	// 16
+	I18n.t('javascripts.directions.instructions.end_oneway')]		// 17
+
 	r.map=map;				// Leaflet map
 	r.name=name;			// global variable name of this instance (needed for JSONP)
 	r.jqSearch=jqSearch;	// JQuery object for search panel
@@ -184,7 +186,7 @@ OSM.Routing=function(map,name,jqSearch) {
 		// Create base table
 		$("#content").removeClass("overlay-sidebar");
 		$('#sidebar_content').empty();
-		var html='<h2><a class="geolink" href="#" onclick="$(~.close_directions~).click();return false;"><span class="icon close"></span></a>Directions</h2>'.replace(/~/g,"'");
+		var html='<h2><a class="geolink" href="#" onclick="$(~.close_directions~).click();return false;"><span class="icon close"></span></a>' + I18n.t('javascripts.directions.directions') + '</h2>'.replace(/~/g,"'");
 		html+="<table id='turnbyturn' />";
 		$('#sidebar_content').html(html);
 		// Add each row
@@ -242,7 +244,7 @@ OSM.Routing=function(map,name,jqSearch) {
 			};
 			r['gotRoute'+num]=function(data) { r.awaitingRoute=false; list[num].gotRoute(r,data); };
 		}
-		select.append("<option value='"+i+"'>"+list[i].name+"</option>");
+		select.append("<option value='"+i+"'>"+I18n.t(list[i].name)+"</option>");
 	}
 	r.engines=list;
 	r.chosenEngine=list[0];	// default to first engine
diff --git a/app/assets/javascripts/routing_engines/cloudmade_foot.js b/app/assets/javascripts/routing_engines/cloudmade_foot.js
index 5193c6472..5c1ba0e97 100644
--- a/app/assets/javascripts/routing_engines/cloudmade_foot.js
+++ b/app/assets/javascripts/routing_engines/cloudmade_foot.js
@@ -4,7 +4,7 @@
 // http://cloudmade.com/documentation/routing
 
 OSM.RoutingEngines.list.push({
-	name: 'Foot (CloudMade)',
+	name: "javascripts.directions.engines.cloudmade_foot",
 	draggable: false,
 	CM_SPRITE_MAP: {
 		"C": 1,
@@ -25,7 +25,8 @@ OSM.RoutingEngines.list.push({
 		}
 		url+=p.join(',');
 		url+="/foot.js";
-		this.requestJSONP(url+"?callback=");
+        url+="?lang=" + I18n.currentLocale();
+		this.requestJSONP(url+"&callback=");
 	},
 	gotRoute: function(router,data) {
 		router.setPolyline(data.route_geometry);
diff --git a/app/assets/javascripts/routing_engines/graphhopper_bicycle.js b/app/assets/javascripts/routing_engines/graphhopper_bicycle.js
index 7f7c83c80..6245124b1 100644
--- a/app/assets/javascripts/routing_engines/graphhopper_bicycle.js
+++ b/app/assets/javascripts/routing_engines/graphhopper_bicycle.js
@@ -1,11 +1,11 @@
 // GraphHopper bicycle engine
 
 OSM.RoutingEngines.list.push({    
-    name: 'Bicycle (GraphHopper)',
+    name: "javascripts.directions.engines.graphhopper_bike",
     draggable: true,
     _hints: {},
     getRoute: function(isFinal, points) {
-        var url = "http://graphhopper.com/routing/api/route?vehicle=bike&locale=en";
+        var url = "http://graphhopper.com/routing/api/route?vehicle=bike&locale=" + I18n.currentLocale();
         for (var i = 0; i < points.length; i++) {
             var pair = points[i].join(',');
             url += "&point=" + pair;
diff --git a/app/assets/javascripts/routing_engines/mapquest_bicycle.js b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
index f74ccba15..b08096955 100644
--- a/app/assets/javascripts/routing_engines/mapquest_bicycle.js
+++ b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
@@ -6,7 +6,7 @@
 // *** needs to give credit
 
 OSM.RoutingEngines.list.push({
-	name: 'Bicycle (MapQuest Open)',
+	name: "javascripts.directions.engines.mapquest_bike",
 	draggable: false,
 	_hints: {},
 	MQ_SPRITE_MAP: {
@@ -36,6 +36,7 @@ OSM.RoutingEngines.list.push({
 		url+="&from="+from.join(',');
 		url+="&to="+to.join(',');
 		url+="&routeType=bicycle";
+        //url+="&locale=" + I18n.currentLocale(); //Doesn't actually work. MapQuest requires full locale e.g. "de_DE", but I18n only provides language, e.g. "de"
 		url+="&manMaps=false";
 		url+="&shapeFormat=raw&generalize=0";
 		this.requestJSONP(url+"&callback=");
diff --git a/app/assets/javascripts/routing_engines/osrm_car.js b/app/assets/javascripts/routing_engines/osrm_car.js
index cb80c5615..0011b0205 100644
--- a/app/assets/javascripts/routing_engines/osrm_car.js
+++ b/app/assets/javascripts/routing_engines/osrm_car.js
@@ -3,7 +3,7 @@
 // *** need to clear hints at some point
 
 OSM.RoutingEngines.list.push({
-	name: 'Car (OSRM)',
+	name: "javascripts.directions.engines.osrm_car",
 	draggable: true,
 	_hints: {},
 	getRoute: function(isFinal,points) {
@@ -34,7 +34,7 @@ OSM.RoutingEngines.list.push({
 			var instText="<b>"+(i+1)+".</b> ";
 			instText+=TURN_INSTRUCTIONS[instCodes[0]];
 			if (instCodes[1]) { instText+="exit "+instCodes[1]+" "; }
-			if (instCodes[0]!=15) { instText+=s[1] ? "<b>"+s[1]+"</b>" : "(unnamed)"; }
+			if (instCodes[0]!=15) { instText+=s[1] ? "<b>"+s[1]+"</b>" : I18n.t('javascripts.directions.instructions.unnamed'); }
 			steps.push([line[s[3]], s[0].split('-')[0], instText, s[2]]);
 		}
 		if (steps.length) router.setItinerary({ steps: steps });
diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index e1c85f3b7..e9aa76f5a 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -16,9 +16,9 @@
 
   <div class='query_wrapper routing'>
     <%= image_tag "marker-green.png", :class => 'routing_marker', :id => 'marker_from', :draggable => 'true' %>
-    <%= text_field_tag "route_from", params[:from], :placeholder => "From", :onchange=>"OSM.routing.geocode('route_from',event)" %>
+    <%= text_field_tag "route_from", params[:from], :placeholder => t('site.search.from'), :onchange=>"OSM.routing.geocode('route_from',event)" %>
     <%= image_tag "marker-red.png"  , :class => 'routing_marker', :id => 'marker_to'  , :draggable => 'true' %>
-    <%= text_field_tag "route_to"  , params[:to]  , :placeholder => "To"  , :onchange=>"OSM.routing.geocode('route_to'  ,event)" %>
+    <%= text_field_tag "route_to"  , params[:to]  , :placeholder => t('site.search.to')  , :onchange=>"OSM.routing.geocode('route_to'  ,event)" %>
     <select class='routing_engines' name='routing_engines' onchange="OSM.routing.selectEngine(event)"></select>
   </div>
 
diff --git a/config/locales/de.yml b/config/locales/de.yml
index 7d5cfc60e..16bdfbe1a 100644
--- a/config/locales/de.yml
+++ b/config/locales/de.yml
@@ -929,6 +929,32 @@ de:
   javascripts: 
     close: Schließen
     edit_help: Wähle eine höhere Zoomstufe und verschiebe die Karte an einen Ort, den du bearbeiten möchtest, und klicke hier.
+    directions:
+      directions: "Fahranweisungen: "
+      engines:
+        graphhopper_bike: "Fahrrad (GraphHopper)"
+        mapquest_bike: "Fahrrad (MapQuest)"
+        osrm_car: "Auto (OSRM)"
+        cloudmade_foot: "Fuss (Cloudmade)"
+      instructions:
+        continue_on: "Weiter auf "
+        slight_right: "Rechts halten auf "
+        turn_right: "Rechts abbiegen auf "
+        sharp_right: "Hart rechts auf "
+        uturn: "U-turn along "
+        sharp_left: "Hart links auf "
+        turn_left: "Links abbiegen auf "
+        slight_left: "Links halten auf "
+        via_point: "(via point) "
+        follow:  "Folge "
+        roundabout: "Im Kreisverkehr nehme "
+        leave_roundabout: "Verlasse den Kreisverkehr - "
+        stay_roundabout: "Stay on roundabout - "
+        start: "Start at end of "
+        destination: "Ziel erreicht"
+        against_oneway: "Go against one-way on "
+        end_oneway: "Ende der Einbahnstrasse "
+        unnamed: "(unbekannt)"
     key: 
       title: Legende
       tooltip: Legende
@@ -1467,6 +1493,12 @@ de:
       preview: Vorschau
     search: 
       search: Suchen
+      get_directions: "Route berechnen"
+      get_directions_title: "Routenberechnung zwischen zwei Orten"
+      close_directions: "Schliessen der Route"
+      close_directions_title: "Schliessen des Routenmenus"
+      from: "Von"
+      to: "Nach"
       submit_text: Los
       where_am_i: Wo bin ich?
       where_am_i_title: Die momentane Position mit der Suchmaschine anzeigen
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 4bc926f2b..e567a497d 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -1328,6 +1328,8 @@ en:
       get_directions_title: "Find directions between two points"
       close_directions: "Close directions"
       close_directions_title: "Close the directions panel"
+      from: "From"
+      to: "To"
       where_am_i: "Where am I?"
       where_am_i_title: Describe the current location using the search engine
       submit_text: "Go"
@@ -2116,6 +2118,32 @@ en:
         comment_and_resolve: Comment & Resolve
         comment: Comment
     edit_help: Move the map and zoom in on a location you want to edit, then click here.
+    directions:
+      engines:
+        graphhopper_bike: "Bicycle (GraphHopper)"
+        mapquest_bike: "Bicycle (MapQuest)"
+        osrm_car: "Car (OSRM)"
+        cloudmade_foot: "Foot (Cloudmade)"
+      directions: "Directions"
+      instructions:
+        continue_on: "Continue on "
+        slight_right: "Slight right onto "
+        turn_right: "Turn right onto "
+        sharp_right: "Sharp right onto "
+        uturn: "U-turn along "
+        sharp_left: "Sharp left onto "
+        turn_left: "Turn leeeeft onto "
+        slight_left: "Slight left onto "
+        via_point: "(via point) "
+        follow:  "Follow "
+        roundabout: "At roundabout take "
+        leave_roundabout: "Leave roundabout - "
+        stay_roundabout: "Stay on roundabout - "
+        start: "Start at end of "
+        destination: "Reach destination"
+        against_oneway: "Go against one-way on "
+        end_oneway: "End of one-way on "
+        unnamed: "(unnamed)"
   redaction:
     edit:
       description: "Description"

From f383fe279315908311beced6f973bca2ae1a3f7b Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Mon, 3 Feb 2014 18:08:53 +0000
Subject: [PATCH 28/88] Fiiiix siiiiilly direeeeections

---
 config/locales/en.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/config/locales/en.yml b/config/locales/en.yml
index e567a497d..573afa585 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -2132,7 +2132,7 @@ en:
         sharp_right: "Sharp right onto "
         uturn: "U-turn along "
         sharp_left: "Sharp left onto "
-        turn_left: "Turn leeeeft onto "
+        turn_left: "Turn left onto "
         slight_left: "Slight left onto "
         via_point: "(via point) "
         follow:  "Follow "

From acf7cf5738c5daa59e99e09e328ee0bf82e668eb Mon Sep 17 00:00:00 2001
From: Dan Stowell <danstowell@users.sourceforge.net>
Date: Sun, 23 Feb 2014 21:56:39 +0000
Subject: [PATCH 29/88] add a credits line for each routing service

---
 app/assets/javascripts/routing.js.erb                    | 2 ++
 app/assets/javascripts/routing_engines/cloudmade_foot.js | 1 +
 .../javascripts/routing_engines/graphhopper_bicycle.js   | 1 +
 .../javascripts/routing_engines/mapquest_bicycle.js      | 1 +
 app/assets/javascripts/routing_engines/osrm_car.js       | 1 +
 app/assets/stylesheets/common.css.scss                   | 9 +++++++++
 6 files changed, 15 insertions(+)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 3c6db9999..6a8961a7c 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -211,6 +211,8 @@ OSM.Routing=function(map,name,jqSearch) {
 			$('#turnbyturn').append(row);
 			cumulative+=step[3];
 		}
+		$('#sidebar_content').append('<p id="routing_credit">' + r.chosenEngine.creditline + '</p>');
+
 	};
 	r.clickTurn=function(num,latlng) {
 		r.popup=L.popup().setLatLng(latlng).setContent("<p>"+(num+1)+"</p>").openOn(r.map);
diff --git a/app/assets/javascripts/routing_engines/cloudmade_foot.js b/app/assets/javascripts/routing_engines/cloudmade_foot.js
index 5c1ba0e97..bee9e448a 100644
--- a/app/assets/javascripts/routing_engines/cloudmade_foot.js
+++ b/app/assets/javascripts/routing_engines/cloudmade_foot.js
@@ -5,6 +5,7 @@
 
 OSM.RoutingEngines.list.push({
 	name: "javascripts.directions.engines.cloudmade_foot",
+	creditline: 'Directions courtesy of <a href="http://cloudmade.com/products/routing" target="_blank">Cloudmade</a>',
 	draggable: false,
 	CM_SPRITE_MAP: {
 		"C": 1,
diff --git a/app/assets/javascripts/routing_engines/graphhopper_bicycle.js b/app/assets/javascripts/routing_engines/graphhopper_bicycle.js
index 6245124b1..bec855f88 100644
--- a/app/assets/javascripts/routing_engines/graphhopper_bicycle.js
+++ b/app/assets/javascripts/routing_engines/graphhopper_bicycle.js
@@ -2,6 +2,7 @@
 
 OSM.RoutingEngines.list.push({    
     name: "javascripts.directions.engines.graphhopper_bike",
+    creditline: 'Directions courtesy of <a href="http://graphhopper.com/routing/" target="_blank">Graphhopper</a>',
     draggable: true,
     _hints: {},
     getRoute: function(isFinal, points) {
diff --git a/app/assets/javascripts/routing_engines/mapquest_bicycle.js b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
index b08096955..4cff366a6 100644
--- a/app/assets/javascripts/routing_engines/mapquest_bicycle.js
+++ b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
@@ -7,6 +7,7 @@
 
 OSM.RoutingEngines.list.push({
 	name: "javascripts.directions.engines.mapquest_bike",
+	creditline: 'Directions courtesy of <a href="http://www.mapquest.com/" target="_blank">MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png">',
 	draggable: false,
 	_hints: {},
 	MQ_SPRITE_MAP: {
diff --git a/app/assets/javascripts/routing_engines/osrm_car.js b/app/assets/javascripts/routing_engines/osrm_car.js
index 0011b0205..da94adf05 100644
--- a/app/assets/javascripts/routing_engines/osrm_car.js
+++ b/app/assets/javascripts/routing_engines/osrm_car.js
@@ -4,6 +4,7 @@
 
 OSM.RoutingEngines.list.push({
 	name: "javascripts.directions.engines.osrm_car",
+	creditline: 'Directions courtesy of <a href="http://project-osrm.org/" target="_blank">OSRM</a>',
 	draggable: true,
 	_hints: {},
 	getRoute: function(isFinal,points) {
diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index 0f306b6d3..a8fba1943 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -1217,6 +1217,15 @@ tr.turn:hover {
   }
 }
 
+/* Rules for the routing sidebar */
+
+#sidebar_content {
+  #routing_credit {
+    text-align: center;
+    padding: 0.5em;
+  }
+}
+
 /* Rules for edit pages */
 
 .site-edit {

From 205ccf2d51753b6802ca212df6aa3425af40430e Mon Sep 17 00:00:00 2001
From: Dan Stowell <danstowell@users.sourceforge.net>
Date: Sun, 23 Feb 2014 21:58:28 +0000
Subject: [PATCH 30/88] remove the todo that I addressed

---
 app/assets/javascripts/routing_engines/mapquest_bicycle.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/app/assets/javascripts/routing_engines/mapquest_bicycle.js b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
index 4cff366a6..c7995246a 100644
--- a/app/assets/javascripts/routing_engines/mapquest_bicycle.js
+++ b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
@@ -3,8 +3,6 @@
 // http://open.mapquestapi.com/directions/
 // https://github.com/apmon/openstreetmap-website/blob/21edc353a4558006f0ce23f5ec3930be6a7d4c8b/app/controllers/routing_controller.rb#L153
 
-// *** needs to give credit
-
 OSM.RoutingEngines.list.push({
 	name: "javascripts.directions.engines.mapquest_bike",
 	creditline: 'Directions courtesy of <a href="http://www.mapquest.com/" target="_blank">MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png">',

From deea77ab93b4932b4bc48f91562ee31e6e7b54fc Mon Sep 17 00:00:00 2001
From: Dan Stowell <danstowell@users.sourceforge.net>
Date: Sun, 23 Feb 2014 21:40:21 +0000
Subject: [PATCH 31/88] refresh search if showing and user changes provider

---
 app/assets/javascripts/routing.js.erb | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 3c6db9999..4ea30fa00 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -252,6 +252,9 @@ OSM.Routing=function(map,name,jqSearch) {
 	// Choose an engine on dropdown change
 	r.selectEngine=function(e) {
 		r.chosenEngine=r.engines[e.target.selectedIndex];
+		if (r.polyline){ // and if a route is currently showing, must also refresh, else confusion
+			r.requestRoute(true);
+		}
 	};
 	// Choose an engine by name
 	r.chooseEngine=function(name) {

From 628eea2b97d6a0185a17673c48eeb3e35c333493 Mon Sep 17 00:00:00 2001
From: Dan Stowell <danstowell@users.sourceforge.net>
Date: Sat, 8 Mar 2014 09:39:51 +0000
Subject: [PATCH 32/88] jsrouting: zoom to bbox on getting fresh geocoded
 route, but not on drag etc

---
 app/assets/javascripts/index.js       |  2 +-
 app/assets/javascripts/routing.js.erb | 13 ++++++++-----
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index 8f989deaf..fc8e8ff46 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -327,7 +327,7 @@ $(document).ready(function () {
     e.preventDefault();
     if ($(".query_wrapper.routing").is(":visible")) {
       // Routing
-      OSM.routing.requestRoute(true);
+      OSM.routing.requestRoute(true, false);
     } else {
       // Search
       $("header").addClass("closed");
diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index fbec3e7e3..74607ef39 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -109,7 +109,7 @@ OSM.Routing=function(map,name,jqSearch) {
 		r.updateMarker(field.id);
 		if (r.awaitingGeocode) {
 			r.awaitingGeocode=false;
-			r.requestRoute(true);
+			r.requestRoute(true, true);
 		}
 	};
 
@@ -121,7 +121,7 @@ OSM.Routing=function(map,name,jqSearch) {
 		// *** ^^^ this is slightly off - we need to work out the latLng of the tip
 		r.createMarker(ll,id);
 		r.setNumericInput(ll,id);
-		r.requestRoute(true);
+		r.requestRoute(true, false);
 		// update to/from field
 	};
 	r.createMarker=function(latlng,id) {
@@ -148,7 +148,7 @@ OSM.Routing=function(map,name,jqSearch) {
 		if (e.type=='drag' && !r.chosenEngine.draggable) return;
 		if (e.type=='drag' && r.awaitingRoute) return;
 		r.setNumericInput(e.target.getLatLng(), e.target.options.name);
-		r.requestRoute(e.type=='dragend');
+		r.requestRoute(e.type=='dragend', false);
 	};
 	// Set a route input field to a numeric value
 	r.setNumericInput=function(ll,id) {
@@ -159,10 +159,13 @@ OSM.Routing=function(map,name,jqSearch) {
 	
 	// Route-fetching UI
 
-	r.requestRoute=function(isFinal) {
+	r.requestRoute=function(isFinal, updateZoom) {
 		if (r.route_from && r.route_to) {
 			r.awaitingRoute=true;
 			r.chosenEngine.getRoute(isFinal,[r.route_from,r.route_to]);
+			if(updateZoom){
+				r.map.fitBounds(L.latLngBounds([r.route_from, r.route_to]).pad(0.05));
+			}
 			// then, when the route has been fetched, it'll call the engine's gotRoute function
 		} else if (r.route_from==false || r.route_to==false) {
 			// we're waiting for a Nominatim response before we can request a route
@@ -255,7 +258,7 @@ OSM.Routing=function(map,name,jqSearch) {
 	r.selectEngine=function(e) {
 		r.chosenEngine=r.engines[e.target.selectedIndex];
 		if (r.polyline){ // and if a route is currently showing, must also refresh, else confusion
-			r.requestRoute(true);
+			r.requestRoute(true, false);
 		}
 	};
 	// Choose an engine by name

From bf895a0332242df4189b507e647d0aa4ce4a5a04 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Sat, 8 Mar 2014 10:43:29 +0000
Subject: [PATCH 33/88] Reformat string to avoid long line

---
 app/assets/javascripts/routing.js.erb | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 74607ef39..fb03e5bec 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -184,13 +184,13 @@ OSM.Routing=function(map,name,jqSearch) {
 	// Take directions and write them out
 	// data = { steps: array of [latlng, sprite number, instruction text, distance in metres] }
 	// sprite numbers equate to OSRM's route_instructions turn values
-	// *** translations?
 	r.setItinerary=function(data) {
 		// Create base table
 		$("#content").removeClass("overlay-sidebar");
 		$('#sidebar_content').empty();
-		var html='<h2><a class="geolink" href="#" onclick="$(~.close_directions~).click();return false;"><span class="icon close"></span></a>' + I18n.t('javascripts.directions.directions') + '</h2>'.replace(/~/g,"'");
-		html+="<table id='turnbyturn' />";
+		var html=('<h2><a class="geolink" href="#" onclick="$(~.close_directions~).click();return false;">' +
+		          '<span class="icon close"></span></a>' + I18n.t('javascripts.directions.directions') + 
+		          '</h2><table id="turnbyturn" />').replace(/~/g,"'");
 		$('#sidebar_content').html(html);
 		// Add each row
 		var cumulative=0;

From f28676c07d25b803237278c668281a50be9ff605 Mon Sep 17 00:00:00 2001
From: Dan Stowell <danstowell@users.sourceforge.net>
Date: Sat, 8 Mar 2014 10:48:01 +0000
Subject: [PATCH 34/88] fix firefox behaviour when dragging pointer from the
 tray to the map

---
 app/assets/javascripts/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index fc8e8ff46..0a11b4899 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -357,7 +357,7 @@ $(document).ready(function () {
     $(".routing").show();
     $(".query_wrapper.routing [name=route_from]").focus();
     $("#map").on('dragend dragover',function(e) { e.preventDefault(); });
-    $("#map").on('drop',function(e) { OSM.routing.handleDrop(e); });
+    $("#map").on('drop',function(e) { OSM.routing.handleDrop(e); e.preventDefault(); });
     $(".routing_marker").on('dragstart',function(e) {
     e.originalEvent.dataTransfer.effectAllowed = 'move';
       e.originalEvent.dataTransfer.setData('id', this.id);

From 902f1b088743b1983ef5bbb2ac7a3c8f2fadbdf1 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Sat, 8 Mar 2014 11:14:48 +0000
Subject: [PATCH 35/88] Add spinner while awaiting route

---
 app/assets/images/searching-small.gif | Bin 0 -> 1849 bytes
 app/assets/javascripts/routing.js.erb |   8 +++++---
 app/views/layouts/_search.html.erb    |   1 +
 3 files changed, 6 insertions(+), 3 deletions(-)
 create mode 100644 app/assets/images/searching-small.gif

diff --git a/app/assets/images/searching-small.gif b/app/assets/images/searching-small.gif
new file mode 100644
index 0000000000000000000000000000000000000000..06dbc2bc21dddcf0e09b566d5b211aee89570f52
GIT binary patch
literal 1849
zcma*odr(tX9tZHtz31lM+(&Y`A`Ou`NeG&R#DrIfV%?hng21vs6<Qu85kn1y8d4G3
zB9aF}khfHe)haF9qWFOLm|a&8BQx4|+?A=*PIucG?9h(3mO>v>ooRQQFbk7E_K!V(
z{?5!fpZWgIZ%*d6t%i*j24bL}AZUJm9)h6R*;%L4IWse3G#VWaN1#$zSSXcBhlYlH
zJ|D}n{r&w2f+Qp)SS*&n?*G4}{}!h?td_mjU6Kad-rW*QwWYCUk7d^e+sjpZAn6kT
z5rM;`{~_}-wm+L@%+E;JphLm}C3WzQAQD0wBoY|rOTQX{(@pp-WAA8Iw0HKl|15j)
zhGh(SFWu#5zUCw^T!}C~eC}~?{xG-r7ugQC>taC+|L^xr&a%{#cgUOZXIM&v?)k^2
z1i5%0!U00wq)r4vlAwXBA_m5J5WNeuBm-XJQ5pG4GD%vc|K){+TJ{AkHqN@SJKczX
zU}QRd9n*_bf^h9<l-a&pF6v6N#Bvg}^VUOq)@d9+!HhLdY=xcv`e(fnj619`rWK_D
z@Nc;Oh3DY&5mnvcAQ!HXAt+%d5>4)6Ctv{CUfz_;qs#RDuQ$DR%y1&5G-a6rhf*4Y
zl+UOD1*GE{GQ7vv;c-tTIMkz0ovO>9j%b5hpa@a*CBJ#W!0@ndSwF|%hMkdFtXiU)
z`BEp+yhkt8ZY>tg&uyH@%^%K4jDrbA;et&vnnzZ3z22@e6<27z2Vk13kb7OtISyxv
z(XoO-LNQCZe3lfzc%*pNqU<9T+p~teThOEB+~e&U0mC|zS{Q)dJZ)!^1f7L(zg*L>
z*vSW%?dR~@@0(}x6-V^A`~ImD;)NaBUnP8;RH=bS2@pk`wp>>8r&jGjmGPy%1BW}v
zoPo}ca$~bze@efc3kapuEVW1!%teOZT3j2Tw5=hjiAf02d}7dL0oFC%@=RXp5Ow#%
z@a>+AM|YWt$n&e`>sB-32gBcuTi>R>*|8@lp`y6thc7ydyqDsuUn~YzZf|{-R@-3y
zL#wx{Ii}xxL_csiW*LBn0-A$>zp4WOmkf6=il<e?!Bom#crh0CjK%19!^g}+k}2`}
zo0Wr#;Yeg4o8zL_UVrMwWi~>rjlW?-l9+bCd7|i?*b5NTmy<<6NZ0T8$SN@mwdC2f
z6jqK=N@bS@!=YSj%>h0}*4p+%0HbTIrE$w7UMT6+AZZ&DAo*qZAAi(OtNbIfl#Dw^
zJWeiCp~zi#&t6x}m9)O^eR4HiLV3QA<<0>HZ8%$^lrSE94Wb}=+MM^!b>n#5&-JQR
zkr-CEu9C;_F*7DqDisulV6Pmg$nFL0TPn%~*m^-`Z3^BgU(sNpnx%nW(!eV9A&FvI
zHL3X3lw8Wji^6=8KbQDE-e%b?<z*f{V{H_@=6jT_Yqwt4Px-l`rX8awSWLQlCB4?y
z8Y>svdFxxdh$8r97@7$ojeI`6AL8Ob6QC$qh&>ZWVDX1F{0vJnT%%mE;GveKWR%C}
zM&4d;Jf3s9|HAA)yVUPo`Aq;0do#)uHSXi5*QF*)x@MVVHr+cN)uMZ__F|&Ta#p8d
z53TOKtce!PJUuie8UWol-S(`c2nH?UGqJP{!4RR4u$LCfn)q-hj0^f=h(VYy)T6eN
zhRO!ja-aDBTcgeyP(8Ua4IdiOog^*CQa?R(cP#9AgL9`j>EX-6Yf1lzX(!~``M1XC
zNmM<4<6d~wWZ$Xrk0K}UteTrq@LBBk#MsjkK;pbuVhe)NI7(7Pf(l?lxC7=1Z7Pzl
zMbS;nV4NI5_N{1$P)&XC)huOGQ+h^zpYUZfb*1n6>!`#*b3y52LGmi+<4sY5jyD#-
zw&$d}DTguLAfnRtjrM*JfqtHqUu6rQoU=g%1E9xk%;)TDm^2<8n-0<WJO&60lJpcB
zz|giz8_eK&)w%}Sqg)v&GE}nCr43Zw<Ore8gvs;S4CGK;h|cacP<UI~!kj9+qwS#S
zl6p|w-TKWs(PpC6*?H+-QS9z<s<>IhT<bH>sQFaek)MY}>PK4;nBk=ow4pF>vzkO&
gna%Org-kgQCf=+BeMi^RbuY;YE~rTjend;_cdi8t>i_@%

literal 0
HcmV?d00001

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index fb03e5bec..af9ce4fbf 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -9,8 +9,6 @@
 	*** translation (including all alerts and presentation)
 	*** export GPX
 	*** URL history (or do we consciously not want to support that?)
-	*** spinner when waiting for result (beneath 'Go' button?)
-
 	*** add YOURS engine
 */
 
@@ -161,6 +159,7 @@ OSM.Routing=function(map,name,jqSearch) {
 
 	r.requestRoute=function(isFinal, updateZoom) {
 		if (r.route_from && r.route_to) {
+			$(".query_wrapper.routing .spinner").show();
 			r.awaitingRoute=true;
 			r.chosenEngine.getRoute(isFinal,[r.route_from,r.route_to]);
 			if(updateZoom){
@@ -247,7 +246,10 @@ OSM.Routing=function(map,name,jqSearch) {
 				script.src = url+r.name+".gotRoute"+num;
 				document.body.appendChild(script); 
 			};
-			r['gotRoute'+num]=function(data) { r.awaitingRoute=false; list[num].gotRoute(r,data); };
+			r['gotRoute'+num]=function(data) { 
+				r.awaitingRoute=false; list[num].gotRoute(r,data);
+				$(".query_wrapper.routing .spinner").hide();
+			};
 		}
 		select.append("<option value='"+i+"'>"+I18n.t(list[i].name)+"</option>");
 	}
diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index e9aa76f5a..839b3dcec 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -20,6 +20,7 @@
     <%= image_tag "marker-red.png"  , :class => 'routing_marker', :id => 'marker_to'  , :draggable => 'true' %>
     <%= text_field_tag "route_to"  , params[:to]  , :placeholder => t('site.search.to')  , :onchange=>"OSM.routing.geocode('route_to'  ,event)" %>
     <select class='routing_engines' name='routing_engines' onchange="OSM.routing.selectEngine(event)"></select>
+    <%= image_tag "searching-small.gif", :class => 'spinner', :style => "vertical-align: middle; display: none;" %>
   </div>
 
 <% end %>

From 5b6558c0f29013e85c9c398a61872f9dad5a69c5 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Sat, 8 Mar 2014 12:07:54 +0000
Subject: [PATCH 36/88] Improve error-handling

---
 app/assets/javascripts/routing.js.erb         | 20 ++++++++++++++-----
 .../routing_engines/cloudmade_foot.js         |  1 +
 .../routing_engines/graphhopper_bicycle.js    |  2 +-
 .../routing_engines/mapquest_bicycle.js       |  1 +
 .../javascripts/routing_engines/osrm_car.js   |  2 +-
 config/locales/en.yml                         |  3 +++
 6 files changed, 22 insertions(+), 7 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index af9ce4fbf..d1c66e293 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -56,6 +56,7 @@ OSM.Routing=function(map,name,jqSearch) {
 	r.route_to=null;		//  |
 	r.awaitingGeocode=false;// true if the user has requested a route, but we're waiting on a geocode result
 	r.awaitingRoute=false;	// true if we've asked the engine for a route and are waiting to hear back
+	r.dragging=false;		// true if the user is dragging a start/end point
 	r.viaPoints=[];			// not yet used
 
 	r.polyline=null;		// Leaflet polyline object
@@ -97,7 +98,7 @@ OSM.Routing=function(map,name,jqSearch) {
 	
 	r._gotGeocode=function(json,field) {
 		if (json.length==0) {
-			alert("Sorry, couldn't find that place."); 	// *** internationalise
+			alert(I18n.t('javascripts.directions.errors.no_place'));
 			r[field.id]=null;
 			return;
 		}
@@ -143,10 +144,11 @@ OSM.Routing=function(map,name,jqSearch) {
 	};
 	// Marker has been dragged
 	r.markerDragged=function(e) {
-		if (e.type=='drag' && !r.chosenEngine.draggable) return;
-		if (e.type=='drag' && r.awaitingRoute) return;
+		r.dragging=(e.type=='drag');	// true for drag, false for dragend
+		if (r.dragging && !r.chosenEngine.draggable) return;
+		if (r.dragging && r.awaitingRoute) return;
 		r.setNumericInput(e.target.getLatLng(), e.target.options.name);
-		r.requestRoute(e.type=='dragend', false);
+		r.requestRoute(!r.dragging, false);
 	};
 	// Set a route input field to a numeric value
 	r.setNumericInput=function(ll,id) {
@@ -247,8 +249,16 @@ OSM.Routing=function(map,name,jqSearch) {
 				document.body.appendChild(script); 
 			};
 			r['gotRoute'+num]=function(data) { 
-				r.awaitingRoute=false; list[num].gotRoute(r,data);
+				r.awaitingRoute=false;
 				$(".query_wrapper.routing .spinner").hide();
+				if (!list[num].gotRoute(r,data)) {
+					// No route found
+					if (r.polyline) {
+						map.removeLayer(r.polyline);
+						r.polyline=null;
+					}
+					if (!r.dragging) { alert(I18n.t('javascripts.directions.errors.no_route')); }
+				}
 			};
 		}
 		select.append("<option value='"+i+"'>"+I18n.t(list[i].name)+"</option>");
diff --git a/app/assets/javascripts/routing_engines/cloudmade_foot.js b/app/assets/javascripts/routing_engines/cloudmade_foot.js
index bee9e448a..13368d0a2 100644
--- a/app/assets/javascripts/routing_engines/cloudmade_foot.js
+++ b/app/assets/javascripts/routing_engines/cloudmade_foot.js
@@ -28,6 +28,7 @@ OSM.RoutingEngines.list.push({
 		url+="/foot.js";
         url+="?lang=" + I18n.currentLocale();
 		this.requestJSONP(url+"&callback=");
+		return true;
 	},
 	gotRoute: function(router,data) {
 		router.setPolyline(data.route_geometry);
diff --git a/app/assets/javascripts/routing_engines/graphhopper_bicycle.js b/app/assets/javascripts/routing_engines/graphhopper_bicycle.js
index bec855f88..acf089278 100644
--- a/app/assets/javascripts/routing_engines/graphhopper_bicycle.js
+++ b/app/assets/javascripts/routing_engines/graphhopper_bicycle.js
@@ -17,7 +17,6 @@ OSM.RoutingEngines.list.push({
     },
     gotRoute: function(router, data) {
         if (!data.info.routeFound) {
-            alert("Couldn't find route between those two places");
             return false;
         }
         // Draw polyline
@@ -36,6 +35,7 @@ OSM.RoutingEngines.list.push({
             steps.push([{lat: latlng[0], lng: latlng[1]}, instrCode, instrText, distInMeter]);
         }
         router.setItinerary({steps: steps});
+        return true;
     },
     GH_INSTR_MAP: {
         "-3": 6, // sharp left
diff --git a/app/assets/javascripts/routing_engines/mapquest_bicycle.js b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
index c7995246a..5d5ff9ffd 100644
--- a/app/assets/javascripts/routing_engines/mapquest_bicycle.js
+++ b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
@@ -60,5 +60,6 @@ OSM.RoutingEngines.list.push({
 			steps.push([L.latLng(s.startPoint.lat, s.startPoint.lng), d, s.narrative, s.distance*1000]);
 		}
 		router.setItinerary( { steps: steps });
+		return true;
 	}
 });
diff --git a/app/assets/javascripts/routing_engines/osrm_car.js b/app/assets/javascripts/routing_engines/osrm_car.js
index da94adf05..8ff6ba482 100644
--- a/app/assets/javascripts/routing_engines/osrm_car.js
+++ b/app/assets/javascripts/routing_engines/osrm_car.js
@@ -19,7 +19,6 @@ OSM.RoutingEngines.list.push({
 	},
 	gotRoute: function(router,data) {
 		if (data.status==207) {
-			alert("Couldn't find route between those two places");
 			return false;
 		}
 		// Draw polyline
@@ -39,5 +38,6 @@ OSM.RoutingEngines.list.push({
 			steps.push([line[s[3]], s[0].split('-')[0], instText, s[2]]);
 		}
 		if (steps.length) router.setItinerary({ steps: steps });
+		return true;
 	}
 });
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 573afa585..46fe41d10 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -2125,6 +2125,9 @@ en:
         osrm_car: "Car (OSRM)"
         cloudmade_foot: "Foot (Cloudmade)"
       directions: "Directions"
+      errors:
+        no_route: "Couldn't find a route between those two places."
+        no_place: "Sorry - couldn't find that place."
       instructions:
         continue_on: "Continue on "
         slight_right: "Slight right onto "

From 7915a22cafafc1fcbd59d798ac1734ecfd083adc Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Sat, 8 Mar 2014 12:31:06 +0000
Subject: [PATCH 37/88] Use generic GraphHopper engine

---
 app/assets/javascripts/routing.js.erb         |  2 +-
 .../routing_engines/graphhopper.js            | 63 +++++++++++++++++++
 .../routing_engines/graphhopper_bicycle.js    | 49 ---------------
 config/locales/en.yml                         |  3 +-
 4 files changed, 66 insertions(+), 51 deletions(-)
 create mode 100644 app/assets/javascripts/routing_engines/graphhopper.js
 delete mode 100644 app/assets/javascripts/routing_engines/graphhopper_bicycle.js

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index d1c66e293..2a10a9d5e 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -238,7 +238,7 @@ OSM.Routing=function(map,name,jqSearch) {
 
 	// Add all engines
 	var list=OSM.RoutingEngines.list;
-	list.sort(function(a,b) { return a.name>b.name; });
+	list.sort(function(a,b) { return I18n.t(a.name)>I18n.t(b.name); });
 	var select=r.jqSearch.find('select.routing_engines');
 	for (var i=0; i<list.length; i++) {
 		// Set up JSONP callback
diff --git a/app/assets/javascripts/routing_engines/graphhopper.js b/app/assets/javascripts/routing_engines/graphhopper.js
new file mode 100644
index 000000000..9762c0fe4
--- /dev/null
+++ b/app/assets/javascripts/routing_engines/graphhopper.js
@@ -0,0 +1,63 @@
+GraphHopperEngine = function(vehicleName, vehicleParam, locale) {
+    this.vehicleName = vehicleName;
+    this.vehicleParam = vehicleParam;
+    this.locale = locale;
+    if (!locale)
+        this.locale = "en";
+};
+
+GraphHopperEngine.prototype.createConfig = function() {
+    var that = this;
+    return {
+        name: "javascripts.directions.engines.graphhopper_"+this.vehicleName.toLowerCase(),
+        draggable: false,
+        _hints: {},
+        getRoute: function(isFinal, points) {
+            var url = "http://graphhopper.com/routing/api/route?" 
+                    + that.vehicleParam 
+                    + "&locale=" + that.locale;
+            for (var i = 0; i < points.length; i++) {
+                var pair = points[i].join(',');
+                url += "&point=" + pair;
+            }            
+            if (isFinal)
+                url += "&instructions=true";
+            // GraphHopper supports json too
+            this.requestJSONP(url + "&type=jsonp&callback=");
+        },
+        gotRoute: function(router, data) {
+            if (!data.info.routeFound) {
+                return false;
+            }
+            // Draw polyline
+            var line = L.PolylineUtil.decode(data.route.coordinates);
+            router.setPolyline(line);
+            // Assemble instructions
+            var steps = [];
+            var instr = data.route.instructions;
+            for (i = 0; i < instr.descriptions.length; i++) {
+                var indi = instr.indications[i];
+                var instrCode = (i == instr.descriptions.length - 1) ? 15 : this.GH_INSTR_MAP[indi];
+                var instrText = "<b>" + (i + 1) + ".</b> ";
+                instrText += instr.descriptions[i];
+                var latlng = instr.latLngs[i];
+                var distInMeter = instr.distances[i];
+                steps.push([{lat: latlng[0], lng: latlng[1]}, instrCode, instrText, distInMeter]);
+            }
+            router.setItinerary({steps: steps});
+            return true;
+        },
+        GH_INSTR_MAP: {
+            "-3": 6, // sharp left
+            "-2": 7, // left	
+            "-1": 8, // slight left                
+            0: 0, // straight
+            1: 1, // slight right
+            2: 2, // right
+            3: 3 // sharp right		
+        }
+    };
+};
+
+OSM.RoutingEngines.list.push(new GraphHopperEngine("Bicycle", "vehicle=bike").createConfig());
+OSM.RoutingEngines.list.push(new GraphHopperEngine("Foot", "vehicle=foot").createConfig());
diff --git a/app/assets/javascripts/routing_engines/graphhopper_bicycle.js b/app/assets/javascripts/routing_engines/graphhopper_bicycle.js
deleted file mode 100644
index acf089278..000000000
--- a/app/assets/javascripts/routing_engines/graphhopper_bicycle.js
+++ /dev/null
@@ -1,49 +0,0 @@
-// GraphHopper bicycle engine
-
-OSM.RoutingEngines.list.push({    
-    name: "javascripts.directions.engines.graphhopper_bike",
-    creditline: 'Directions courtesy of <a href="http://graphhopper.com/routing/" target="_blank">Graphhopper</a>',
-    draggable: true,
-    _hints: {},
-    getRoute: function(isFinal, points) {
-        var url = "http://graphhopper.com/routing/api/route?vehicle=bike&locale=" + I18n.currentLocale();
-        for (var i = 0; i < points.length; i++) {
-            var pair = points[i].join(',');
-            url += "&point=" + pair;
-        }
-        if (isFinal)
-            url += "&instructions=true";
-        this.requestJSONP(url + "&type=jsonp&callback=");
-    },
-    gotRoute: function(router, data) {
-        if (!data.info.routeFound) {
-            return false;
-        }
-        // Draw polyline
-        var line = L.PolylineUtil.decode(data.route.coordinates);
-        router.setPolyline(line);
-        // Assemble instructions
-        var steps = [];
-        var instr = data.route.instructions;
-        for (i = 0; i < instr.descriptions.length; i++) {
-            var indi = instr.indications[i];
-            var instrCode = (i==instr.descriptions.length-1) ? 15 : this.GH_INSTR_MAP[indi];
-            var instrText = "<b>" + (i + 1) + ".</b> ";
-            instrText += instr.descriptions[i];
-            var latlng = instr.latLngs[i];
-            var distInMeter = instr.distances[i];            
-            steps.push([{lat: latlng[0], lng: latlng[1]}, instrCode, instrText, distInMeter]);
-        }
-        router.setItinerary({steps: steps});
-        return true;
-    },
-    GH_INSTR_MAP: {
-        "-3": 6, // sharp left
-        "-2": 7, // left	
-        "-1": 8, // slight left                
-        0: 0, // straight
-        1: 1, // slight right
-        2: 2, // right
-        3: 3 // sharp right		
-    }
-});
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 46fe41d10..8cb9c9674 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -2120,7 +2120,8 @@ en:
     edit_help: Move the map and zoom in on a location you want to edit, then click here.
     directions:
       engines:
-        graphhopper_bike: "Bicycle (GraphHopper)"
+        graphhopper_bicycle: "Bicycle (GraphHopper)"
+        graphhopper_foot: "Foot (GraphHopper)"
         mapquest_bike: "Bicycle (MapQuest)"
         osrm_car: "Car (OSRM)"
         cloudmade_foot: "Foot (Cloudmade)"

From dd4406ed41653a6b3c2b2adeda1d524358203498 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Sat, 8 Mar 2014 12:35:00 +0000
Subject: [PATCH 38/88] Remove CloudMade foot engine (OSM is probably not an
 "Enterprise Plan" customer ;) )

---
 .../routing_engines/cloudmade_foot.js         | 44 -------------------
 1 file changed, 44 deletions(-)
 delete mode 100644 app/assets/javascripts/routing_engines/cloudmade_foot.js

diff --git a/app/assets/javascripts/routing_engines/cloudmade_foot.js b/app/assets/javascripts/routing_engines/cloudmade_foot.js
deleted file mode 100644
index 13368d0a2..000000000
--- a/app/assets/javascripts/routing_engines/cloudmade_foot.js
+++ /dev/null
@@ -1,44 +0,0 @@
-// CloudMade foot engine
-// *** again, this should be shared from a Cloudmade library somewhere
-// *** this API key is taken from some example code, not for real live use!
-// http://cloudmade.com/documentation/routing
-
-OSM.RoutingEngines.list.push({
-	name: "javascripts.directions.engines.cloudmade_foot",
-	creditline: 'Directions courtesy of <a href="http://cloudmade.com/products/routing" target="_blank">Cloudmade</a>',
-	draggable: false,
-	CM_SPRITE_MAP: {
-		"C": 1,
-		"TL": 7,
-		"TSLL": 8,
-		"TSHL": 6,
-		"TR": 3,
-		"TSLR": 2,
-		"TSHR": 4,
-		"TU": 5
-	}, // was half expecting to see TLDR in there
-	getRoute: function(isFinal,points) {
-		var url="http://routes.cloudmade.com/8ee2a50541944fb9bcedded5165f09d9/api/0.3/";
-		var p=[];
-		for (var i=0; i<points.length; i++) {
-			p.push(points[i][0]);
-			p.push(points[i][1]);
-		}
-		url+=p.join(',');
-		url+="/foot.js";
-        url+="?lang=" + I18n.currentLocale();
-		this.requestJSONP(url+"&callback=");
-		return true;
-	},
-	gotRoute: function(router,data) {
-		router.setPolyline(data.route_geometry);
-		// Assemble instructions
-		var steps=[];
-		for (i=0; i<data.route_instructions.length; i++) {
-			var s=data.route_instructions[i];
-			steps.push([data.route_geometry[s[2]], this.CM_SPRITE_MAP[s[7]], s[0], s[1]]);
-		}
-		router.setItinerary({ steps: steps });
-	}
-});
-

From a997690897b765ec763631c31b9e4ca87b4e530f Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Sat, 8 Mar 2014 13:37:27 +0000
Subject: [PATCH 39/88] Refactor MQ/OSRM engines a la @karussell patch

---
 .../javascripts/routing_engines/mapquest.js   | 81 +++++++++++++++++++
 .../routing_engines/mapquest_bicycle.js       | 65 ---------------
 .../javascripts/routing_engines/osrm.js       | 55 +++++++++++++
 .../javascripts/routing_engines/osrm_car.js   | 43 ----------
 config/locales/en.yml                         |  5 +-
 5 files changed, 139 insertions(+), 110 deletions(-)
 create mode 100644 app/assets/javascripts/routing_engines/mapquest.js
 delete mode 100644 app/assets/javascripts/routing_engines/mapquest_bicycle.js
 create mode 100644 app/assets/javascripts/routing_engines/osrm.js
 delete mode 100644 app/assets/javascripts/routing_engines/osrm_car.js

diff --git a/app/assets/javascripts/routing_engines/mapquest.js b/app/assets/javascripts/routing_engines/mapquest.js
new file mode 100644
index 000000000..f31a84458
--- /dev/null
+++ b/app/assets/javascripts/routing_engines/mapquest.js
@@ -0,0 +1,81 @@
+// see: 
+// http://developer.mapquest.com/web/products/open/directions-service
+// http://open.mapquestapi.com/directions/
+// https://github.com/apmon/openstreetmap-website/blob/21edc353a4558006f0ce23f5ec3930be6a7d4c8b/app/controllers/routing_controller.rb#L153
+
+MapQuestEngine = function(vehicleName, vehicleParam, locale) {
+    this.vehicleName = vehicleName;
+    this.vehicleParam = vehicleParam;
+    this.locale = locale;
+    if (!locale)
+        this.locale = "en";
+};
+
+MapQuestEngine.prototype.createConfig = function() {
+    var that = this;
+    return {
+		name: "javascripts.directions.engines.mapquest_"+this.vehicleName.toLowerCase(),
+		creditline: 'Directions courtesy of <a href="http://www.mapquest.com/" target="_blank">MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png">',
+		draggable: false,
+		_hints: {},
+		MQ_SPRITE_MAP: {
+			0: 1, // straight
+			1: 2, // slight right
+			2: 3, // right
+			3: 4, // sharp right
+			4: 5, // reverse
+			5: 6, // sharp left
+			6: 7, // left
+			7: 8, // slight left
+			8: 5, // right U-turn
+			9: 5, // left U-turn
+			10: 2, // right merge
+			11: 8, // left merge
+			12: 2, // right on-ramp
+			13: 8, // left on-ramp
+			14: 2, // right off-ramp
+			15: 8, // left off-ramp
+			16: 2, // right fork
+			17: 8, // left fork
+			18: 1  // straight fork
+		},
+		getRoute: function(isFinal,points) {
+			var url="http://open.mapquestapi.com/directions/v2/route?key=Fmjtd%7Cluur290anu%2Crl%3Do5-908a0y";
+			var from=points[0]; var to=points[points.length-1];
+			url+="&from="+from.join(',');
+			url+="&to="+to.join(',');
+			url+="&"+that.vehicleParam;
+			//url+="&locale=" + I18n.currentLocale(); //Doesn't actually work. MapQuest requires full locale e.g. "de_DE", but I18n only provides language, e.g. "de"
+			url+="&manMaps=false";
+			url+="&shapeFormat=raw&generalize=0";
+			this.requestJSONP(url+"&callback=");
+		},
+		gotRoute: function(router,data) {
+			// *** what if no route?
+		
+			var poly=[];
+			var shape=data.route.shape.shapePoints;
+			for (var i=0; i<shape.length; i+=2) {
+				poly.push(L.latLng(shape[i],shape[i+1]));
+			}
+			router.setPolyline(poly);
+
+			// data.shape.maneuverIndexes links turns to polyline positions
+			// data.legs[0].maneuvers is list of turns
+			var steps=[];
+			var mq=data.route.legs[0].maneuvers;
+			for (var i=0; i<mq.length; i++) {
+				var s=mq[i];
+				var d=(i==mq.length-1) ? 15: this.MQ_SPRITE_MAP[s.turnType];
+				steps.push([L.latLng(s.startPoint.lat, s.startPoint.lng), d, s.narrative, s.distance*1000]);
+			}
+			router.setItinerary( { steps: steps });
+			return true;
+		}
+	};
+};
+
+OSM.RoutingEngines.list.push(new MapQuestEngine("Bicycle", "routeType=bicycle").createConfig());
+OSM.RoutingEngines.list.push(new MapQuestEngine("Foot", "routeType=pedestrian").createConfig());
+OSM.RoutingEngines.list.push(new MapQuestEngine("Car", "routeType=fastest").createConfig());
+// can be: routeType=fastest|shortest|pedestrian|multimodal|bicycle
diff --git a/app/assets/javascripts/routing_engines/mapquest_bicycle.js b/app/assets/javascripts/routing_engines/mapquest_bicycle.js
deleted file mode 100644
index 5d5ff9ffd..000000000
--- a/app/assets/javascripts/routing_engines/mapquest_bicycle.js
+++ /dev/null
@@ -1,65 +0,0 @@
-// see: 
-// http://developer.mapquest.com/web/products/open/directions-service
-// http://open.mapquestapi.com/directions/
-// https://github.com/apmon/openstreetmap-website/blob/21edc353a4558006f0ce23f5ec3930be6a7d4c8b/app/controllers/routing_controller.rb#L153
-
-OSM.RoutingEngines.list.push({
-	name: "javascripts.directions.engines.mapquest_bike",
-	creditline: 'Directions courtesy of <a href="http://www.mapquest.com/" target="_blank">MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png">',
-	draggable: false,
-	_hints: {},
-	MQ_SPRITE_MAP: {
-		0: 1, // straight
-		1: 2, // slight right
-		2: 3, // right
-		3: 4, // sharp right
-		4: 5, // reverse
-		5: 6, // sharp left
-		6: 7, // left
-		7: 8, // slight left
-		8: 5, // right U-turn
-		9: 5, // left U-turn
-		10: 2, // right merge
-		11: 8, // left merge
-		12: 2, // right on-ramp
-		13: 8, // left on-ramp
-		14: 2, // right off-ramp
-		15: 8, // left off-ramp
-		16: 2, // right fork
-		17: 8, // left fork
-		18: 1  // straight fork
-	},
-	getRoute: function(isFinal,points) {
-		var url="http://open.mapquestapi.com/directions/v2/route?key=Fmjtd%7Cluur290anu%2Crl%3Do5-908a0y";
-		var from=points[0]; var to=points[points.length-1];
-		url+="&from="+from.join(',');
-		url+="&to="+to.join(',');
-		url+="&routeType=bicycle";
-        //url+="&locale=" + I18n.currentLocale(); //Doesn't actually work. MapQuest requires full locale e.g. "de_DE", but I18n only provides language, e.g. "de"
-		url+="&manMaps=false";
-		url+="&shapeFormat=raw&generalize=0";
-		this.requestJSONP(url+"&callback=");
-	},
-	gotRoute: function(router,data) {
-		// *** what if no route?
-		
-		var poly=[];
-		var shape=data.route.shape.shapePoints;
-		for (var i=0; i<shape.length; i+=2) {
-			poly.push(L.latLng(shape[i],shape[i+1]));
-		}
-		router.setPolyline(poly);
-
-		// data.shape.maneuverIndexes links turns to polyline positions
-		// data.legs[0].maneuvers is list of turns
-		var steps=[];
-		var mq=data.route.legs[0].maneuvers;
-		for (var i=0; i<mq.length; i++) {
-			var s=mq[i];
-			var d=(i==mq.length-1) ? 15: this.MQ_SPRITE_MAP[s.turnType];
-			steps.push([L.latLng(s.startPoint.lat, s.startPoint.lng), d, s.narrative, s.distance*1000]);
-		}
-		router.setItinerary( { steps: steps });
-		return true;
-	}
-});
diff --git a/app/assets/javascripts/routing_engines/osrm.js b/app/assets/javascripts/routing_engines/osrm.js
new file mode 100644
index 000000000..4122a0b4d
--- /dev/null
+++ b/app/assets/javascripts/routing_engines/osrm.js
@@ -0,0 +1,55 @@
+// OSRM car engine
+// *** need to clear hints at some point
+
+OSRMEngine = function(vehicleName, baseURL, locale) {
+    this.vehicleName = vehicleName;
+    this.baseURL = baseURL;
+    this.locale = locale;
+    if (!locale)
+        this.locale = "en";
+};
+
+OSRMEngine.prototype.createConfig = function() {
+    var that = this;
+    return {
+		name: "javascripts.directions.engines.osrm_"+this.vehicleName.toLowerCase(),
+		creditline: 'Directions courtesy of <a href="http://project-osrm.org/" target="_blank">OSRM</a>',
+		draggable: true,
+		_hints: {},
+		getRoute: function(isFinal,points) {
+			var url=that.baseURL+"?z=14&output=json";
+			for (var i=0; i<points.length; i++) {
+				var pair=points[i].join(',');
+				url+="&loc="+pair;
+				if (this._hints[pair]) url+= "&hint="+this._hints[pair];
+			}
+			if (isFinal) url+="&instructions=true";
+			this.requestJSONP(url+"&jsonp=");
+		},
+		gotRoute: function(router,data) {
+			if (data.status==207) {
+				return false;
+			}
+			// Draw polyline
+			var line=L.PolylineUtil.decode(data.route_geometry);
+			for (i=0; i<line.length; i++) { line[i].lat/=10; line[i].lng/=10; }
+			router.setPolyline(line);
+			// *** store hints
+			// Assemble instructions
+			var steps=[];
+			for (i=0; i<data.route_instructions.length; i++) {
+				var s=data.route_instructions[i];
+				var instCodes=s[0].split('-');
+				var instText="<b>"+(i+1)+".</b> ";
+				instText+=TURN_INSTRUCTIONS[instCodes[0]];
+				if (instCodes[1]) { instText+="exit "+instCodes[1]+" "; }
+				if (instCodes[0]!=15) { instText+=s[1] ? "<b>"+s[1]+"</b>" : I18n.t('javascripts.directions.instructions.unnamed'); }
+				steps.push([line[s[3]], s[0].split('-')[0], instText, s[2]]);
+			}
+			if (steps.length) router.setItinerary({ steps: steps });
+			return true;
+		}
+	};
+};
+
+OSM.RoutingEngines.list.push(new OSRMEngine("Car", "http://router.project-osrm.org/viaroute").createConfig());
diff --git a/app/assets/javascripts/routing_engines/osrm_car.js b/app/assets/javascripts/routing_engines/osrm_car.js
deleted file mode 100644
index 8ff6ba482..000000000
--- a/app/assets/javascripts/routing_engines/osrm_car.js
+++ /dev/null
@@ -1,43 +0,0 @@
-// OSRM car engine
-// *** this should all be shared from an OSRM library somewhere
-// *** need to clear hints at some point
-
-OSM.RoutingEngines.list.push({
-	name: "javascripts.directions.engines.osrm_car",
-	creditline: 'Directions courtesy of <a href="http://project-osrm.org/" target="_blank">OSRM</a>',
-	draggable: true,
-	_hints: {},
-	getRoute: function(isFinal,points) {
-		var url="http://router.project-osrm.org/viaroute?z=14&output=json";
-		for (var i=0; i<points.length; i++) {
-			var pair=points[i].join(',');
-			url+="&loc="+pair;
-			if (this._hints[pair]) url+= "&hint="+this._hints[pair];
-		}
-		if (isFinal) url+="&instructions=true";
-		this.requestJSONP(url+"&jsonp=");
-	},
-	gotRoute: function(router,data) {
-		if (data.status==207) {
-			return false;
-		}
-		// Draw polyline
-		var line=L.PolylineUtil.decode(data.route_geometry);
-		for (i=0; i<line.length; i++) { line[i].lat/=10; line[i].lng/=10; }
-		router.setPolyline(line);
-		// *** store hints
-		// Assemble instructions
-		var steps=[];
-		for (i=0; i<data.route_instructions.length; i++) {
-			var s=data.route_instructions[i];
-			var instCodes=s[0].split('-');
-			var instText="<b>"+(i+1)+".</b> ";
-			instText+=TURN_INSTRUCTIONS[instCodes[0]];
-			if (instCodes[1]) { instText+="exit "+instCodes[1]+" "; }
-			if (instCodes[0]!=15) { instText+=s[1] ? "<b>"+s[1]+"</b>" : I18n.t('javascripts.directions.instructions.unnamed'); }
-			steps.push([line[s[3]], s[0].split('-')[0], instText, s[2]]);
-		}
-		if (steps.length) router.setItinerary({ steps: steps });
-		return true;
-	}
-});
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 8cb9c9674..e5bb7f3f0 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -2122,9 +2122,10 @@ en:
       engines:
         graphhopper_bicycle: "Bicycle (GraphHopper)"
         graphhopper_foot: "Foot (GraphHopper)"
-        mapquest_bike: "Bicycle (MapQuest)"
+        mapquest_bicycle: "Bicycle (MapQuest)"
+        mapquest_car: "Car (MapQuest)"
+        mapquest_foot: "Foot (MapQuest)"
         osrm_car: "Car (OSRM)"
-        cloudmade_foot: "Foot (Cloudmade)"
       directions: "Directions"
       errors:
         no_route: "Couldn't find a route between those two places."

From 2f0794738c022f060a07d45f6bed3ea68ea4d166 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Sat, 8 Mar 2014 14:03:08 +0000
Subject: [PATCH 40/88] Add CORS for engines that support it (Do we need a fix
 for IE8/9? -
 https://github.com/MoonScript/jQuery-ajaxTransport-XDomainRequest -
 https://github.com/jaubourg/ajaxHooks/blob/master/src/xdr.js )

---
 app/assets/javascripts/routing.js.erb              | 3 +++
 app/assets/javascripts/routing_engines/mapquest.js | 2 +-
 app/assets/javascripts/routing_engines/osrm.js     | 2 +-
 3 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 2a10a9d5e..204606005 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -248,6 +248,9 @@ OSM.Routing=function(map,name,jqSearch) {
 				script.src = url+r.name+".gotRoute"+num;
 				document.body.appendChild(script); 
 			};
+			list[num].requestCORS=function(url) {
+				$.ajax({ url: url, method: "GET", data: {}, dataType: 'json', success: r['gotRoute'+num] });
+			};
 			r['gotRoute'+num]=function(data) { 
 				r.awaitingRoute=false;
 				$(".query_wrapper.routing .spinner").hide();
diff --git a/app/assets/javascripts/routing_engines/mapquest.js b/app/assets/javascripts/routing_engines/mapquest.js
index f31a84458..598614c29 100644
--- a/app/assets/javascripts/routing_engines/mapquest.js
+++ b/app/assets/javascripts/routing_engines/mapquest.js
@@ -48,7 +48,7 @@ MapQuestEngine.prototype.createConfig = function() {
 			//url+="&locale=" + I18n.currentLocale(); //Doesn't actually work. MapQuest requires full locale e.g. "de_DE", but I18n only provides language, e.g. "de"
 			url+="&manMaps=false";
 			url+="&shapeFormat=raw&generalize=0";
-			this.requestJSONP(url+"&callback=");
+			this.requestCORS(url);
 		},
 		gotRoute: function(router,data) {
 			// *** what if no route?
diff --git a/app/assets/javascripts/routing_engines/osrm.js b/app/assets/javascripts/routing_engines/osrm.js
index 4122a0b4d..fde871019 100644
--- a/app/assets/javascripts/routing_engines/osrm.js
+++ b/app/assets/javascripts/routing_engines/osrm.js
@@ -24,7 +24,7 @@ OSRMEngine.prototype.createConfig = function() {
 				if (this._hints[pair]) url+= "&hint="+this._hints[pair];
 			}
 			if (isFinal) url+="&instructions=true";
-			this.requestJSONP(url+"&jsonp=");
+			this.requestCORS(url);
 		},
 		gotRoute: function(router,data) {
 			if (data.status==207) {

From 15904542a6694248c08cbcb06739e4788bf59f2a Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Sat, 8 Mar 2014 14:14:43 +0000
Subject: [PATCH 41/88] Pass on routing failures from MapQuest

---
 app/assets/javascripts/routing_engines/mapquest.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/javascripts/routing_engines/mapquest.js b/app/assets/javascripts/routing_engines/mapquest.js
index 598614c29..bd580da3e 100644
--- a/app/assets/javascripts/routing_engines/mapquest.js
+++ b/app/assets/javascripts/routing_engines/mapquest.js
@@ -51,7 +51,7 @@ MapQuestEngine.prototype.createConfig = function() {
 			this.requestCORS(url);
 		},
 		gotRoute: function(router,data) {
-			// *** what if no route?
+			if (data.info.statuscode!=0) return false;
 		
 			var poly=[];
 			var shape=data.route.shape.shapePoints;

From 9a05a7ba490cbf2ed7fdc50ef5ae203dc5cbfd18 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Sat, 8 Mar 2014 15:17:22 +0000
Subject: [PATCH 42/88] Put marker at exact position user dragged it to

---
 app/assets/javascripts/index.js       | 4 +++-
 app/assets/javascripts/routing.js.erb | 9 ++++++---
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index 0a11b4899..178ed7611 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -359,8 +359,10 @@ $(document).ready(function () {
     $("#map").on('dragend dragover',function(e) { e.preventDefault(); });
     $("#map").on('drop',function(e) { OSM.routing.handleDrop(e); e.preventDefault(); });
     $(".routing_marker").on('dragstart',function(e) {
-    e.originalEvent.dataTransfer.effectAllowed = 'move';
+      e.originalEvent.dataTransfer.effectAllowed = 'move';
       e.originalEvent.dataTransfer.setData('id', this.id);
+      e.originalEvent.dataTransfer.setData('offsetX', e.originalEvent.target.width/2 - (e.originalEvent.x-e.target.x));
+      e.originalEvent.dataTransfer.setData('offsetY', e.originalEvent.target.height  - (e.originalEvent.y-e.target.y));
     });
   });
 
diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 204606005..c774928b9 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -115,9 +115,12 @@ OSM.Routing=function(map,name,jqSearch) {
 	// Drag and drop markers
 	
 	r.handleDrop=function(e) {
-		var id=e.originalEvent.dataTransfer.getData('id');
-		var ll=r.map.mouseEventToLatLng(e.originalEvent);
-		// *** ^^^ this is slightly off - we need to work out the latLng of the tip
+		var oe=e.originalEvent;
+		var id=oe.dataTransfer.getData('id');
+		var pt=L.DomEvent.getMousePosition(oe,map.getContainer());	// co-ordinates of the mouse pointer at present
+		pt.x+=Number(oe.dataTransfer.getData('offsetX'));
+		pt.y+=Number(oe.dataTransfer.getData('offsetY'));
+		var ll=map.containerPointToLatLng(pt);
 		r.createMarker(ll,id);
 		r.setNumericInput(ll,id);
 		r.requestRoute(true, false);

From 3ef8024b1d33f0de6227a26967ba78ef85672a94 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Sat, 8 Mar 2014 16:14:14 +0000
Subject: [PATCH 43/88] Add distance/time summary

---
 app/assets/javascripts/routing.js.erb              | 14 +++++++++++++-
 .../javascripts/routing_engines/graphhopper.js     |  2 +-
 app/assets/javascripts/routing_engines/mapquest.js |  4 ++--
 app/assets/javascripts/routing_engines/osrm.js     |  2 +-
 app/assets/stylesheets/common.css.scss             |  4 ++++
 config/locales/en.yml                              |  2 ++
 6 files changed, 23 insertions(+), 5 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index c774928b9..42373ef9d 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -194,7 +194,10 @@ OSM.Routing=function(map,name,jqSearch) {
 		$('#sidebar_content').empty();
 		var html=('<h2><a class="geolink" href="#" onclick="$(~.close_directions~).click();return false;">' +
 		          '<span class="icon close"></span></a>' + I18n.t('javascripts.directions.directions') + 
-		          '</h2><table id="turnbyturn" />').replace(/~/g,"'");
+		          '</h2><p id="routing_summary">' + 
+		          I18n.t('javascripts.directions.distance') + ': ' + r.formatDistance(data.distance)+ '. ' +
+		          I18n.t('javascripts.directions.time'    ) + ': ' + r.formatTime(data.time) + '.</p>' +
+		          '<table id="turnbyturn" />').replace(/~/g,"'");
 		$('#sidebar_content').html(html);
 		// Add each row
 		var cumulative=0;
@@ -224,6 +227,15 @@ OSM.Routing=function(map,name,jqSearch) {
 	r.clickTurn=function(num,latlng) {
 		r.popup=L.popup().setLatLng(latlng).setContent("<p>"+(num+1)+"</p>").openOn(r.map);
 	};
+	r.formatDistance=function(m) {
+		if      (m < 1000 ) { return Math.round(m) + "m"; }
+		else if (m < 10000) { return (m/1000.0).toFixed(1) + "km"; }
+		else                { return Math.round(m / 1000)  + "km"; }
+	};
+	r.formatTime=function(s) {
+		var d=new Date(s*1000); var h=d.getHours(); var m=d.getMinutes();
+		return h+":"+(m<10 ? '0' : '')+m;
+	};
 
 	// Close all routing UI
 	
diff --git a/app/assets/javascripts/routing_engines/graphhopper.js b/app/assets/javascripts/routing_engines/graphhopper.js
index 9762c0fe4..5c10433c2 100644
--- a/app/assets/javascripts/routing_engines/graphhopper.js
+++ b/app/assets/javascripts/routing_engines/graphhopper.js
@@ -44,7 +44,7 @@ GraphHopperEngine.prototype.createConfig = function() {
                 var distInMeter = instr.distances[i];
                 steps.push([{lat: latlng[0], lng: latlng[1]}, instrCode, instrText, distInMeter]);
             }
-            router.setItinerary({steps: steps});
+            router.setItinerary({ steps: steps, distance: data.route.distance, time: data.route['time']/1000 });
             return true;
         },
         GH_INSTR_MAP: {
diff --git a/app/assets/javascripts/routing_engines/mapquest.js b/app/assets/javascripts/routing_engines/mapquest.js
index bd580da3e..3e6e0c3fc 100644
--- a/app/assets/javascripts/routing_engines/mapquest.js
+++ b/app/assets/javascripts/routing_engines/mapquest.js
@@ -47,7 +47,7 @@ MapQuestEngine.prototype.createConfig = function() {
 			url+="&"+that.vehicleParam;
 			//url+="&locale=" + I18n.currentLocale(); //Doesn't actually work. MapQuest requires full locale e.g. "de_DE", but I18n only provides language, e.g. "de"
 			url+="&manMaps=false";
-			url+="&shapeFormat=raw&generalize=0";
+			url+="&shapeFormat=raw&generalize=0&unit=k";
 			this.requestCORS(url);
 		},
 		gotRoute: function(router,data) {
@@ -69,7 +69,7 @@ MapQuestEngine.prototype.createConfig = function() {
 				var d=(i==mq.length-1) ? 15: this.MQ_SPRITE_MAP[s.turnType];
 				steps.push([L.latLng(s.startPoint.lat, s.startPoint.lng), d, s.narrative, s.distance*1000]);
 			}
-			router.setItinerary( { steps: steps });
+			router.setItinerary( { steps: steps, distance: data.route.distance*1000, time: data.route['time'] });
 			return true;
 		}
 	};
diff --git a/app/assets/javascripts/routing_engines/osrm.js b/app/assets/javascripts/routing_engines/osrm.js
index fde871019..041f456f0 100644
--- a/app/assets/javascripts/routing_engines/osrm.js
+++ b/app/assets/javascripts/routing_engines/osrm.js
@@ -46,7 +46,7 @@ OSRMEngine.prototype.createConfig = function() {
 				if (instCodes[0]!=15) { instText+=s[1] ? "<b>"+s[1]+"</b>" : I18n.t('javascripts.directions.instructions.unnamed'); }
 				steps.push([line[s[3]], s[0].split('-')[0], instText, s[2]]);
 			}
-			if (steps.length) router.setItinerary({ steps: steps });
+			if (steps.length) router.setItinerary({ steps: steps, distance: data.route_summary.total_distance, time: data.route_summary.total_time });
 			return true;
 		}
 	};
diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index a8fba1943..4eefddbe7 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -639,6 +639,10 @@ nav.secondary {
       font-size: 13px;
     }
 
+    p {
+      padding: 0 $lineheight $lineheight/4;
+    }
+
     .icon.close {
       float: right;
       cursor: pointer;
diff --git a/config/locales/en.yml b/config/locales/en.yml
index e5bb7f3f0..bb3f542b7 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -2127,6 +2127,7 @@ en:
         mapquest_foot: "Foot (MapQuest)"
         osrm_car: "Car (OSRM)"
       directions: "Directions"
+      distance: "Distance"
       errors:
         no_route: "Couldn't find a route between those two places."
         no_place: "Sorry - couldn't find that place."
@@ -2149,6 +2150,7 @@ en:
         against_oneway: "Go against one-way on "
         end_oneway: "End of one-way on "
         unnamed: "(unnamed)"
+      time: "Time"
   redaction:
     edit:
       description: "Description"

From 926c7b56a87324fec24d923f1fb52453206e434f Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Sat, 8 Mar 2014 16:31:54 +0000
Subject: [PATCH 44/88] Zoom to fit when submitting form

---
 app/assets/javascripts/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index 178ed7611..f07f4331d 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -327,7 +327,7 @@ $(document).ready(function () {
     e.preventDefault();
     if ($(".query_wrapper.routing").is(":visible")) {
       // Routing
-      OSM.routing.requestRoute(true, false);
+      OSM.routing.requestRoute(true, true);
     } else {
       // Search
       $("header").addClass("closed");

From 5c0e96e0e0e99b3469c286f4bf77d4d0abf47c79 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Sat, 8 Mar 2014 16:39:51 +0000
Subject: [PATCH 45/88] Convert tabs to spaces (because I'll be lynched
 otherwise, mutter grumble)

---
 app/assets/javascripts/routing.js.erb         | 529 +++++++++---------
 .../javascripts/routing_engines/mapquest.js   | 118 ++--
 .../javascripts/routing_engines/osrm.js       |  77 ++-
 3 files changed, 354 insertions(+), 370 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 42373ef9d..d62e94f0c 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -1,305 +1,290 @@
 /*
-	osm.org routing interface
-	
-	See also:
-	https://github.com/apmon/openstreetmap-website/tree/routing2
-	https://github.com/apmon/openstreetmap-website/compare/routing2
-	https://github.com/apmon/openstreetmap-website/blob/9755c3ae0a8d0684d43760f91dc864ff42d8477a/app/views/routing/start.js.erb
-
-	*** translation (including all alerts and presentation)
-	*** export GPX
-	*** URL history (or do we consciously not want to support that?)
-	*** add YOURS engine
+    osm.org routing interface
 */
 
 var TURN_INSTRUCTIONS=[]
 
 var ROUTING_POLYLINE={
-	color: '#03f',
-	opacity: 0.3,
-	weight: 10
+    color: '#03f',
+    opacity: 0.3,
+    weight: 10
 };
 
 
 OSM.RoutingEngines={
-	list: []
-	// common functions and constants, e.g. OSRM parser, can go here
+    list: []
 };
 
 OSM.Routing=function(map,name,jqSearch) {
-	var r={};
+    var r={};
 
     TURN_INSTRUCTIONS=["",
-	I18n.t('javascripts.directions.instructions.continue_on'),				// 1
-	I18n.t('javascripts.directions.instructions.slight_right'),		// 2
-	I18n.t('javascripts.directions.instructions.turn_right'),			// 3
-	I18n.t('javascripts.directions.instructions.sharp_right'),		// 4
-	I18n.t('javascripts.directions.instructions.uturn'),			// 5
-	I18n.t('javascripts.directions.instructions.sharp_left'),			// 6
-	I18n.t('javascripts.directions.instructions.turn_left'),			// 7
-	I18n.t('javascripts.directions.instructions.slight_left'),		// 8
-	I18n.t('javascripts.directions.instructions.via_point'),				// 9
-	I18n.t('javascripts.directions.instructions.follow'),					// 10
-	I18n.t('javascripts.directions.instructions.roundabout'),		// 11
-	I18n.t('javascripts.directions.instructions.leave_roundabout'),		// 12
-	I18n.t('javascripts.directions.instructions.stay_roundabout'),	// 13
-	I18n.t('javascripts.directions.instructions.start'),			// 14
-	I18n.t('javascripts.directions.instructions.destination'),		// 15
-	I18n.t('javascripts.directions.instructions.against_oneway'),	// 16
-	I18n.t('javascripts.directions.instructions.end_oneway')]		// 17
+    I18n.t('javascripts.directions.instructions.continue_on'),      // 1
+    I18n.t('javascripts.directions.instructions.slight_right'),     // 2
+    I18n.t('javascripts.directions.instructions.turn_right'),       // 3
+    I18n.t('javascripts.directions.instructions.sharp_right'),      // 4
+    I18n.t('javascripts.directions.instructions.uturn'),            // 5
+    I18n.t('javascripts.directions.instructions.sharp_left'),       // 6
+    I18n.t('javascripts.directions.instructions.turn_left'),        // 7
+    I18n.t('javascripts.directions.instructions.slight_left'),      // 8
+    I18n.t('javascripts.directions.instructions.via_point'),        // 9
+    I18n.t('javascripts.directions.instructions.follow'),           // 10
+    I18n.t('javascripts.directions.instructions.roundabout'),       // 11
+    I18n.t('javascripts.directions.instructions.leave_roundabout'), // 12
+    I18n.t('javascripts.directions.instructions.stay_roundabout'),  // 13
+    I18n.t('javascripts.directions.instructions.start'),            // 14
+    I18n.t('javascripts.directions.instructions.destination'),      // 15
+    I18n.t('javascripts.directions.instructions.against_oneway'),   // 16
+    I18n.t('javascripts.directions.instructions.end_oneway')]       // 17
 
-	r.map=map;				// Leaflet map
-	r.name=name;			// global variable name of this instance (needed for JSONP)
-	r.jqSearch=jqSearch;	// JQuery object for search panel
+    r.map=map;              // Leaflet map
+    r.name=name;            // global variable name of this instance (needed for JSONP)
+    r.jqSearch=jqSearch;    // JQuery object for search panel
 
-	r.route_from=null;		// null=unset, false=awaiting response, [lat,lon]=geocoded
-	r.route_to=null;		//  |
-	r.awaitingGeocode=false;// true if the user has requested a route, but we're waiting on a geocode result
-	r.awaitingRoute=false;	// true if we've asked the engine for a route and are waiting to hear back
-	r.dragging=false;		// true if the user is dragging a start/end point
-	r.viaPoints=[];			// not yet used
+    r.route_from=null;      // null=unset, false=awaiting response, [lat,lon]=geocoded
+    r.route_to=null;        //  |
+    r.awaitingGeocode=false;// true if the user has requested a route, but we're waiting on a geocode result
+    r.awaitingRoute=false;  // true if we've asked the engine for a route and are waiting to hear back
+    r.dragging=false;       // true if the user is dragging a start/end point
+    r.viaPoints=[];         // not yet used
 
-	r.polyline=null;		// Leaflet polyline object
-	r.popup=null;			// Leaflet popup object
-	r.marker_from=null;		// Leaflet from marker
-	r.marker_to=null;		// Leaflet to marker
+    r.polyline=null;        // Leaflet polyline object
+    r.popup=null;           // Leaflet popup object
+    r.marker_from=null;     // Leaflet from marker
+    r.marker_to=null;       // Leaflet to marker
 
-	r.chosenEngine=null;	// currently selected routing engine
+    r.chosenEngine=null;    // currently selected routing engine
 
-	var icon_from = L.icon({
-		iconUrl: <%= asset_path('marker-green.png').to_json %>,
-		iconSize: [25, 41],
-		iconAnchor: [12, 41],
-		popupAnchor: [1, -34],
-		shadowUrl: <%= asset_path('images/marker-shadow.png').to_json %>,
-		shadowSize: [41, 41]
-	});
-	var icon_to = L.icon({
-		iconUrl: <%= asset_path('marker-red.png').to_json %>,
-		iconSize: [25, 41],
-		iconAnchor: [12, 41],
-		popupAnchor: [1, -34],
-		shadowUrl: <%= asset_path('images/marker-shadow.png').to_json %>,
-		shadowSize: [41, 41]
-	});
+    var icon_from = L.icon({
+        iconUrl: <%= asset_path('marker-green.png').to_json %>,
+        iconSize: [25, 41],
+        iconAnchor: [12, 41],
+        popupAnchor: [1, -34],
+        shadowUrl: <%= asset_path('images/marker-shadow.png').to_json %>,
+        shadowSize: [41, 41]
+    });
+    var icon_to = L.icon({
+        iconUrl: <%= asset_path('marker-red.png').to_json %>,
+        iconSize: [25, 41],
+        iconAnchor: [12, 41],
+        popupAnchor: [1, -34],
+        shadowUrl: <%= asset_path('images/marker-shadow.png').to_json %>,
+        shadowSize: [41, 41]
+    });
 
-	// Geocoding
+    // Geocoding
 
-	r.geocode=function(id,event) { var _this=this;
-		var field=event.target;
-		var v=event.target.value;
-		// *** do something if v==''
-		var querystring = '<%= NOMINATIM_URL %>search?q=' + encodeURIComponent(v) + '&format=json';
-		// *** &accept-language=<%#= request.user_preferred_languages.join(',') %>
-		// *** prefer current viewport
-		r[field.id]=false;
-		$.getJSON(querystring, function(json) { _this._gotGeocode(json,field); });
-	};
-	
-	r._gotGeocode=function(json,field) {
-		if (json.length==0) {
-			alert(I18n.t('javascripts.directions.errors.no_place'));
-			r[field.id]=null;
-			return;
-		}
-		field.value=json[0].display_name;
-		var lat=Number(json[0].lat), lon=Number(json[0].lon);
-		r[field.id]=[lat,lon];
-		r.updateMarker(field.id);
-		if (r.awaitingGeocode) {
-			r.awaitingGeocode=false;
-			r.requestRoute(true, true);
-		}
-	};
+    r.geocode=function(id,event) { var _this=this;
+        var field=event.target;
+        var v=event.target.value;
+        var querystring = '<%= NOMINATIM_URL %>search?q=' + encodeURIComponent(v) + '&format=json';
+        // *** &accept-language=<%#= request.user_preferred_languages.join(',') %>
+        r[field.id]=false;
+        $.getJSON(querystring, function(json) { _this._gotGeocode(json,field); });
+    };
+    
+    r._gotGeocode=function(json,field) {
+        if (json.length==0) {
+            alert(I18n.t('javascripts.directions.errors.no_place'));
+            r[field.id]=null;
+            return;
+        }
+        field.value=json[0].display_name;
+        var lat=Number(json[0].lat), lon=Number(json[0].lon);
+        r[field.id]=[lat,lon];
+        r.updateMarker(field.id);
+        if (r.awaitingGeocode) {
+            r.awaitingGeocode=false;
+            r.requestRoute(true, true);
+        }
+    };
 
-	// Drag and drop markers
-	
-	r.handleDrop=function(e) {
-		var oe=e.originalEvent;
-		var id=oe.dataTransfer.getData('id');
-		var pt=L.DomEvent.getMousePosition(oe,map.getContainer());	// co-ordinates of the mouse pointer at present
-		pt.x+=Number(oe.dataTransfer.getData('offsetX'));
-		pt.y+=Number(oe.dataTransfer.getData('offsetY'));
-		var ll=map.containerPointToLatLng(pt);
-		r.createMarker(ll,id);
-		r.setNumericInput(ll,id);
-		r.requestRoute(true, false);
-		// update to/from field
-	};
-	r.createMarker=function(latlng,id) {
-		if (r[id]) r.map.removeLayer(r[id]);
-		r[id]=L.marker(latlng, {
-			icon: id=='marker_from' ? icon_from : icon_to,
-			draggable: true,
-			name: id
-		}).addTo(r.map);
-		r[id].on('drag',r.markerDragged);
-		r[id].on('dragend',r.markerDragged);
-	};
-	// Update marker from geocoded route input
-	r.updateMarker=function(id) {
-		var m=id.replace('route','marker');
-		if (!r[m]) { r.createMarker(r[id],m); return; }
-		var ll=r[m].getLatLng();
-		if (ll.lat!=r[id][0] || ll.lng!=r[id][1]) {
-			r.createMarker(r[id],m);
-		}
-	};
-	// Marker has been dragged
-	r.markerDragged=function(e) {
-		r.dragging=(e.type=='drag');	// true for drag, false for dragend
-		if (r.dragging && !r.chosenEngine.draggable) return;
-		if (r.dragging && r.awaitingRoute) return;
-		r.setNumericInput(e.target.getLatLng(), e.target.options.name);
-		r.requestRoute(!r.dragging, false);
-	};
-	// Set a route input field to a numeric value
-	r.setNumericInput=function(ll,id) {
-		var routeid=id.replace('marker','route');
-		r[routeid]=[ll.lat,ll.lng];
-		$("[name="+routeid+"]:visible").val(Math.round(ll.lat*10000)/10000+" "+Math.round(ll.lng*10000)/10000);
-	}
-	
-	// Route-fetching UI
+    // Drag and drop markers
+    
+    r.handleDrop=function(e) {
+        var oe=e.originalEvent;
+        var id=oe.dataTransfer.getData('id');
+        var pt=L.DomEvent.getMousePosition(oe,map.getContainer());  // co-ordinates of the mouse pointer at present
+        pt.x+=Number(oe.dataTransfer.getData('offsetX'));
+        pt.y+=Number(oe.dataTransfer.getData('offsetY'));
+        var ll=map.containerPointToLatLng(pt);
+        r.createMarker(ll,id);
+        r.setNumericInput(ll,id);
+        r.requestRoute(true, false);
+        // update to/from field
+    };
+    r.createMarker=function(latlng,id) {
+        if (r[id]) r.map.removeLayer(r[id]);
+        r[id]=L.marker(latlng, {
+            icon: id=='marker_from' ? icon_from : icon_to,
+            draggable: true,
+            name: id
+        }).addTo(r.map);
+        r[id].on('drag',r.markerDragged);
+        r[id].on('dragend',r.markerDragged);
+    };
+    // Update marker from geocoded route input
+    r.updateMarker=function(id) {
+        var m=id.replace('route','marker');
+        if (!r[m]) { r.createMarker(r[id],m); return; }
+        var ll=r[m].getLatLng();
+        if (ll.lat!=r[id][0] || ll.lng!=r[id][1]) {
+            r.createMarker(r[id],m);
+        }
+    };
+    // Marker has been dragged
+    r.markerDragged=function(e) {
+        r.dragging=(e.type=='drag');    // true for drag, false for dragend
+        if (r.dragging && !r.chosenEngine.draggable) return;
+        if (r.dragging && r.awaitingRoute) return;
+        r.setNumericInput(e.target.getLatLng(), e.target.options.name);
+        r.requestRoute(!r.dragging, false);
+    };
+    // Set a route input field to a numeric value
+    r.setNumericInput=function(ll,id) {
+        var routeid=id.replace('marker','route');
+        r[routeid]=[ll.lat,ll.lng];
+        $("[name="+routeid+"]:visible").val(Math.round(ll.lat*10000)/10000+" "+Math.round(ll.lng*10000)/10000);
+    }
+    
+    // Route-fetching UI
 
-	r.requestRoute=function(isFinal, updateZoom) {
-		if (r.route_from && r.route_to) {
-			$(".query_wrapper.routing .spinner").show();
-			r.awaitingRoute=true;
-			r.chosenEngine.getRoute(isFinal,[r.route_from,r.route_to]);
-			if(updateZoom){
-				r.map.fitBounds(L.latLngBounds([r.route_from, r.route_to]).pad(0.05));
-			}
-			// then, when the route has been fetched, it'll call the engine's gotRoute function
-		} else if (r.route_from==false || r.route_to==false) {
-			// we're waiting for a Nominatim response before we can request a route
-			r.awaitingGeocode=true;
-		}
-	};
+    r.requestRoute=function(isFinal, updateZoom) {
+        if (r.route_from && r.route_to) {
+            $(".query_wrapper.routing .spinner").show();
+            r.awaitingRoute=true;
+            r.chosenEngine.getRoute(isFinal,[r.route_from,r.route_to]);
+            if(updateZoom){
+                r.map.fitBounds(L.latLngBounds([r.route_from, r.route_to]).pad(0.05));
+            }
+            // then, when the route has been fetched, it'll call the engine's gotRoute function
+        } else if (r.route_from==false || r.route_to==false) {
+            // we're waiting for a Nominatim response before we can request a route
+            r.awaitingGeocode=true;
+        }
+    };
 
-	// Take an array of Leaflet LatLngs and draw it as a polyline
-	r.setPolyline=function(line) {
-		if (r.polyline) map.removeLayer(r.polyline);
-		r.polyline=L.polyline(line, ROUTING_POLYLINE).addTo(r.map);
-		// r.map.fitBounds(r.polyline.getBounds());
-		// *** ^^^ we only want to do this for geocode-originated routes
-	};
+    // Take an array of Leaflet LatLngs and draw it as a polyline
+    r.setPolyline=function(line) {
+        if (r.polyline) map.removeLayer(r.polyline);
+        r.polyline=L.polyline(line, ROUTING_POLYLINE).addTo(r.map);
+    };
 
-	// Take directions and write them out
-	// data = { steps: array of [latlng, sprite number, instruction text, distance in metres] }
-	// sprite numbers equate to OSRM's route_instructions turn values
-	r.setItinerary=function(data) {
-		// Create base table
-		$("#content").removeClass("overlay-sidebar");
-		$('#sidebar_content').empty();
-		var html=('<h2><a class="geolink" href="#" onclick="$(~.close_directions~).click();return false;">' +
-		          '<span class="icon close"></span></a>' + I18n.t('javascripts.directions.directions') + 
-		          '</h2><p id="routing_summary">' + 
-		          I18n.t('javascripts.directions.distance') + ': ' + r.formatDistance(data.distance)+ '. ' +
-		          I18n.t('javascripts.directions.time'    ) + ': ' + r.formatTime(data.time) + '.</p>' +
-		          '<table id="turnbyturn" />').replace(/~/g,"'");
-		$('#sidebar_content').html(html);
-		// Add each row
-		var cumulative=0;
-		for (var i=0; i<data.steps.length; i++) {
-			var step=data.steps[i];
-			// Distance
-			var dist=step[3];
-			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"+step[1]+"'> ");
-			row.append("<td class='instruction'>"+step[2]);
-			row.append("<td class='distance'>"+dist);
-			with ({ num: i, ll: step[0] }) {
-				row.on('click',function(e) { r.clickTurn(num, ll); });
-			};
-			$('#turnbyturn').append(row);
-			cumulative+=step[3];
-		}
-		$('#sidebar_content').append('<p id="routing_credit">' + r.chosenEngine.creditline + '</p>');
+    // Take directions and write them out
+    // data = { steps: array of [latlng, sprite number, instruction text, distance in metres] }
+    // sprite numbers equate to OSRM's route_instructions turn values
+    r.setItinerary=function(data) {
+        // Create base table
+        $("#content").removeClass("overlay-sidebar");
+        $('#sidebar_content').empty();
+        var html=('<h2><a class="geolink" href="#" onclick="$(~.close_directions~).click();return false;">' +
+                  '<span class="icon close"></span></a>' + I18n.t('javascripts.directions.directions') + 
+                  '</h2><p id="routing_summary">' + 
+                  I18n.t('javascripts.directions.distance') + ': ' + r.formatDistance(data.distance)+ '. ' +
+                  I18n.t('javascripts.directions.time'    ) + ': ' + r.formatTime(data.time) + '.</p>' +
+                  '<table id="turnbyturn" />').replace(/~/g,"'");
+        $('#sidebar_content').html(html);
+        // Add each row
+        var cumulative=0;
+        for (var i=0; i<data.steps.length; i++) {
+            var step=data.steps[i];
+            // Distance
+            var dist=step[3];
+            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"+step[1]+"'> ");
+            row.append("<td class='instruction'>"+step[2]);
+            row.append("<td class='distance'>"+dist);
+            with ({ num: i, ll: step[0] }) {
+                row.on('click',function(e) { r.clickTurn(num, ll); });
+            };
+            $('#turnbyturn').append(row);
+            cumulative+=step[3];
+        }
+        $('#sidebar_content').append('<p id="routing_credit">' + r.chosenEngine.creditline + '</p>');
 
-	};
-	r.clickTurn=function(num,latlng) {
-		r.popup=L.popup().setLatLng(latlng).setContent("<p>"+(num+1)+"</p>").openOn(r.map);
-	};
-	r.formatDistance=function(m) {
-		if      (m < 1000 ) { return Math.round(m) + "m"; }
-		else if (m < 10000) { return (m/1000.0).toFixed(1) + "km"; }
-		else                { return Math.round(m / 1000)  + "km"; }
-	};
-	r.formatTime=function(s) {
-		var d=new Date(s*1000); var h=d.getHours(); var m=d.getMinutes();
-		return h+":"+(m<10 ? '0' : '')+m;
-	};
+    };
+    r.clickTurn=function(num,latlng) {
+        r.popup=L.popup().setLatLng(latlng).setContent("<p>"+(num+1)+"</p>").openOn(r.map);
+    };
+    r.formatDistance=function(m) {
+        if      (m < 1000 ) { return Math.round(m) + "m"; }
+        else if (m < 10000) { return (m/1000.0).toFixed(1) + "km"; }
+        else                { return Math.round(m / 1000)  + "km"; }
+    };
+    r.formatTime=function(s) {
+        var d=new Date(s*1000); var h=d.getHours(); var m=d.getMinutes();
+        return h+":"+(m<10 ? '0' : '')+m;
+    };
 
-	// Close all routing UI
-	
-	r.close=function() {
-		$("#content").addClass("overlay-sidebar");
-		r.route_from=r.route_to=null;
-		$(".query_wrapper.routing input").val("");
-		var remove=['polyline','popup','marker_from','marker_to'];
-		for (var i=0; i<remove.length; i++) {
-			if (r[remove[i]]) { map.removeLayer(r[remove[i]]); r[remove[i]]=null; }
-		}
-	};
+    // Close all routing UI
+    
+    r.close=function() {
+        $("#content").addClass("overlay-sidebar");
+        r.route_from=r.route_to=null;
+        $(".query_wrapper.routing input").val("");
+        var remove=['polyline','popup','marker_from','marker_to'];
+        for (var i=0; i<remove.length; i++) {
+            if (r[remove[i]]) { map.removeLayer(r[remove[i]]); r[remove[i]]=null; }
+        }
+    };
 
-	// Routing engine handling
+    // Routing engine handling
 
-	// Add all engines
-	var list=OSM.RoutingEngines.list;
-	list.sort(function(a,b) { return I18n.t(a.name)>I18n.t(b.name); });
-	var select=r.jqSearch.find('select.routing_engines');
-	for (var i=0; i<list.length; i++) {
-		// Set up JSONP callback
-		with ({num: i}) {
-			list[num].requestJSONP=function(url) {
-				var script = document.createElement('script');
-				script.src = url+r.name+".gotRoute"+num;
-				document.body.appendChild(script); 
-			};
-			list[num].requestCORS=function(url) {
-				$.ajax({ url: url, method: "GET", data: {}, dataType: 'json', success: r['gotRoute'+num] });
-			};
-			r['gotRoute'+num]=function(data) { 
-				r.awaitingRoute=false;
-				$(".query_wrapper.routing .spinner").hide();
-				if (!list[num].gotRoute(r,data)) {
-					// No route found
-					if (r.polyline) {
-						map.removeLayer(r.polyline);
-						r.polyline=null;
-					}
-					if (!r.dragging) { alert(I18n.t('javascripts.directions.errors.no_route')); }
-				}
-			};
-		}
-		select.append("<option value='"+i+"'>"+I18n.t(list[i].name)+"</option>");
-	}
-	r.engines=list;
-	r.chosenEngine=list[0];	// default to first engine
+    // Add all engines
+    var list=OSM.RoutingEngines.list;
+    list.sort(function(a,b) { return I18n.t(a.name)>I18n.t(b.name); });
+    var select=r.jqSearch.find('select.routing_engines');
+    for (var i=0; i<list.length; i++) {
+        // Set up JSONP callback
+        with ({num: i}) {
+            list[num].requestJSONP=function(url) {
+                var script = document.createElement('script');
+                script.src = url+r.name+".gotRoute"+num;
+                document.body.appendChild(script); 
+            };
+            list[num].requestCORS=function(url) {
+                $.ajax({ url: url, method: "GET", data: {}, dataType: 'json', success: r['gotRoute'+num] });
+            };
+            r['gotRoute'+num]=function(data) { 
+                r.awaitingRoute=false;
+                $(".query_wrapper.routing .spinner").hide();
+                if (!list[num].gotRoute(r,data)) {
+                    // No route found
+                    if (r.polyline) {
+                        map.removeLayer(r.polyline);
+                        r.polyline=null;
+                    }
+                    if (!r.dragging) { alert(I18n.t('javascripts.directions.errors.no_route')); }
+                }
+            };
+        }
+        select.append("<option value='"+i+"'>"+I18n.t(list[i].name)+"</option>");
+    }
+    r.engines=list;
+    r.chosenEngine=list[0]; // default to first engine
 
-	// Choose an engine on dropdown change
-	r.selectEngine=function(e) {
-		r.chosenEngine=r.engines[e.target.selectedIndex];
-		if (r.polyline){ // and if a route is currently showing, must also refresh, else confusion
-			r.requestRoute(true, false);
-		}
-	};
-	// Choose an engine by name
-	r.chooseEngine=function(name) {
-		for (var i=0; i<r.engines.length; i++) {
-			if (r.engines[i].name==name) {
-				r.chosenEngine=r.engines[i];
-				r.jqSearch.find('select.routing_engines').val(i);
-			}
-		}
-	};
+    // Choose an engine on dropdown change
+    r.selectEngine=function(e) {
+        r.chosenEngine=r.engines[e.target.selectedIndex];
+        if (r.polyline){ // and if a route is currently showing, must also refresh, else confusion
+            r.requestRoute(true, false);
+        }
+    };
+    // Choose an engine by name
+    r.chooseEngine=function(name) {
+        for (var i=0; i<r.engines.length; i++) {
+            if (r.engines[i].name==name) {
+                r.chosenEngine=r.engines[i];
+                r.jqSearch.find('select.routing_engines').val(i);
+            }
+        }
+    };
 
-	return r;
+    return r;
 };
diff --git a/app/assets/javascripts/routing_engines/mapquest.js b/app/assets/javascripts/routing_engines/mapquest.js
index 3e6e0c3fc..eb92893b3 100644
--- a/app/assets/javascripts/routing_engines/mapquest.js
+++ b/app/assets/javascripts/routing_engines/mapquest.js
@@ -1,4 +1,4 @@
-// see: 
+// For docs, see:
 // http://developer.mapquest.com/web/products/open/directions-service
 // http://open.mapquestapi.com/directions/
 // https://github.com/apmon/openstreetmap-website/blob/21edc353a4558006f0ce23f5ec3930be6a7d4c8b/app/controllers/routing_controller.rb#L153
@@ -14,65 +14,65 @@ MapQuestEngine = function(vehicleName, vehicleParam, locale) {
 MapQuestEngine.prototype.createConfig = function() {
     var that = this;
     return {
-		name: "javascripts.directions.engines.mapquest_"+this.vehicleName.toLowerCase(),
-		creditline: 'Directions courtesy of <a href="http://www.mapquest.com/" target="_blank">MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png">',
-		draggable: false,
-		_hints: {},
-		MQ_SPRITE_MAP: {
-			0: 1, // straight
-			1: 2, // slight right
-			2: 3, // right
-			3: 4, // sharp right
-			4: 5, // reverse
-			5: 6, // sharp left
-			6: 7, // left
-			7: 8, // slight left
-			8: 5, // right U-turn
-			9: 5, // left U-turn
-			10: 2, // right merge
-			11: 8, // left merge
-			12: 2, // right on-ramp
-			13: 8, // left on-ramp
-			14: 2, // right off-ramp
-			15: 8, // left off-ramp
-			16: 2, // right fork
-			17: 8, // left fork
-			18: 1  // straight fork
-		},
-		getRoute: function(isFinal,points) {
-			var url="http://open.mapquestapi.com/directions/v2/route?key=Fmjtd%7Cluur290anu%2Crl%3Do5-908a0y";
-			var from=points[0]; var to=points[points.length-1];
-			url+="&from="+from.join(',');
-			url+="&to="+to.join(',');
-			url+="&"+that.vehicleParam;
-			//url+="&locale=" + I18n.currentLocale(); //Doesn't actually work. MapQuest requires full locale e.g. "de_DE", but I18n only provides language, e.g. "de"
-			url+="&manMaps=false";
-			url+="&shapeFormat=raw&generalize=0&unit=k";
-			this.requestCORS(url);
-		},
-		gotRoute: function(router,data) {
-			if (data.info.statuscode!=0) return false;
-		
-			var poly=[];
-			var shape=data.route.shape.shapePoints;
-			for (var i=0; i<shape.length; i+=2) {
-				poly.push(L.latLng(shape[i],shape[i+1]));
-			}
-			router.setPolyline(poly);
+        name: "javascripts.directions.engines.mapquest_"+this.vehicleName.toLowerCase(),
+        creditline: 'Directions courtesy of <a href="http://www.mapquest.com/" target="_blank">MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png">',
+        draggable: false,
+        _hints: {},
+        MQ_SPRITE_MAP: {
+            0: 1, // straight
+            1: 2, // slight right
+            2: 3, // right
+            3: 4, // sharp right
+            4: 5, // reverse
+            5: 6, // sharp left
+            6: 7, // left
+            7: 8, // slight left
+            8: 5, // right U-turn
+            9: 5, // left U-turn
+            10: 2, // right merge
+            11: 8, // left merge
+            12: 2, // right on-ramp
+            13: 8, // left on-ramp
+            14: 2, // right off-ramp
+            15: 8, // left off-ramp
+            16: 2, // right fork
+            17: 8, // left fork
+            18: 1  // straight fork
+        },
+        getRoute: function(isFinal,points) {
+            var url="http://open.mapquestapi.com/directions/v2/route?key=Fmjtd%7Cluur290anu%2Crl%3Do5-908a0y";
+            var from=points[0]; var to=points[points.length-1];
+            url+="&from="+from.join(',');
+            url+="&to="+to.join(',');
+            url+="&"+that.vehicleParam;
+            //url+="&locale=" + I18n.currentLocale(); //Doesn't actually work. MapQuest requires full locale e.g. "de_DE", but I18n only provides language, e.g. "de"
+            url+="&manMaps=false";
+            url+="&shapeFormat=raw&generalize=0&unit=k";
+            this.requestCORS(url);
+        },
+        gotRoute: function(router,data) {
+            if (data.info.statuscode!=0) return false;
+        
+            var poly=[];
+            var shape=data.route.shape.shapePoints;
+            for (var i=0; i<shape.length; i+=2) {
+                poly.push(L.latLng(shape[i],shape[i+1]));
+            }
+            router.setPolyline(poly);
 
-			// data.shape.maneuverIndexes links turns to polyline positions
-			// data.legs[0].maneuvers is list of turns
-			var steps=[];
-			var mq=data.route.legs[0].maneuvers;
-			for (var i=0; i<mq.length; i++) {
-				var s=mq[i];
-				var d=(i==mq.length-1) ? 15: this.MQ_SPRITE_MAP[s.turnType];
-				steps.push([L.latLng(s.startPoint.lat, s.startPoint.lng), d, s.narrative, s.distance*1000]);
-			}
-			router.setItinerary( { steps: steps, distance: data.route.distance*1000, time: data.route['time'] });
-			return true;
-		}
-	};
+            // data.shape.maneuverIndexes links turns to polyline positions
+            // data.legs[0].maneuvers is list of turns
+            var steps=[];
+            var mq=data.route.legs[0].maneuvers;
+            for (var i=0; i<mq.length; i++) {
+                var s=mq[i];
+                var d=(i==mq.length-1) ? 15: this.MQ_SPRITE_MAP[s.turnType];
+                steps.push([L.latLng(s.startPoint.lat, s.startPoint.lng), d, s.narrative, s.distance*1000]);
+            }
+            router.setItinerary( { steps: steps, distance: data.route.distance*1000, time: data.route['time'] });
+            return true;
+        }
+    };
 };
 
 OSM.RoutingEngines.list.push(new MapQuestEngine("Bicycle", "routeType=bicycle").createConfig());
diff --git a/app/assets/javascripts/routing_engines/osrm.js b/app/assets/javascripts/routing_engines/osrm.js
index 041f456f0..d6f3535b4 100644
--- a/app/assets/javascripts/routing_engines/osrm.js
+++ b/app/assets/javascripts/routing_engines/osrm.js
@@ -1,5 +1,5 @@
 // OSRM car engine
-// *** need to clear hints at some point
+// Doesn't yet support hints
 
 OSRMEngine = function(vehicleName, baseURL, locale) {
     this.vehicleName = vehicleName;
@@ -12,44 +12,43 @@ OSRMEngine = function(vehicleName, baseURL, locale) {
 OSRMEngine.prototype.createConfig = function() {
     var that = this;
     return {
-		name: "javascripts.directions.engines.osrm_"+this.vehicleName.toLowerCase(),
-		creditline: 'Directions courtesy of <a href="http://project-osrm.org/" target="_blank">OSRM</a>',
-		draggable: true,
-		_hints: {},
-		getRoute: function(isFinal,points) {
-			var url=that.baseURL+"?z=14&output=json";
-			for (var i=0; i<points.length; i++) {
-				var pair=points[i].join(',');
-				url+="&loc="+pair;
-				if (this._hints[pair]) url+= "&hint="+this._hints[pair];
-			}
-			if (isFinal) url+="&instructions=true";
-			this.requestCORS(url);
-		},
-		gotRoute: function(router,data) {
-			if (data.status==207) {
-				return false;
-			}
-			// Draw polyline
-			var line=L.PolylineUtil.decode(data.route_geometry);
-			for (i=0; i<line.length; i++) { line[i].lat/=10; line[i].lng/=10; }
-			router.setPolyline(line);
-			// *** store hints
-			// Assemble instructions
-			var steps=[];
-			for (i=0; i<data.route_instructions.length; i++) {
-				var s=data.route_instructions[i];
-				var instCodes=s[0].split('-');
-				var instText="<b>"+(i+1)+".</b> ";
-				instText+=TURN_INSTRUCTIONS[instCodes[0]];
-				if (instCodes[1]) { instText+="exit "+instCodes[1]+" "; }
-				if (instCodes[0]!=15) { instText+=s[1] ? "<b>"+s[1]+"</b>" : I18n.t('javascripts.directions.instructions.unnamed'); }
-				steps.push([line[s[3]], s[0].split('-')[0], instText, s[2]]);
-			}
-			if (steps.length) router.setItinerary({ steps: steps, distance: data.route_summary.total_distance, time: data.route_summary.total_time });
-			return true;
-		}
-	};
+        name: "javascripts.directions.engines.osrm_"+this.vehicleName.toLowerCase(),
+        creditline: 'Directions courtesy of <a href="http://project-osrm.org/" target="_blank">OSRM</a>',
+        draggable: true,
+        _hints: {},
+        getRoute: function(isFinal,points) {
+            var url=that.baseURL+"?z=14&output=json";
+            for (var i=0; i<points.length; i++) {
+                var pair=points[i].join(',');
+                url+="&loc="+pair;
+                if (this._hints[pair]) url+= "&hint="+this._hints[pair];
+            }
+            if (isFinal) url+="&instructions=true";
+            this.requestCORS(url);
+        },
+        gotRoute: function(router,data) {
+            if (data.status==207) {
+                return false;
+            }
+            // Draw polyline
+            var line=L.PolylineUtil.decode(data.route_geometry);
+            for (i=0; i<line.length; i++) { line[i].lat/=10; line[i].lng/=10; }
+            router.setPolyline(line);
+            // Assemble instructions
+            var steps=[];
+            for (i=0; i<data.route_instructions.length; i++) {
+                var s=data.route_instructions[i];
+                var instCodes=s[0].split('-');
+                var instText="<b>"+(i+1)+".</b> ";
+                instText+=TURN_INSTRUCTIONS[instCodes[0]];
+                if (instCodes[1]) { instText+="exit "+instCodes[1]+" "; }
+                if (instCodes[0]!=15) { instText+=s[1] ? "<b>"+s[1]+"</b>" : I18n.t('javascripts.directions.instructions.unnamed'); }
+                steps.push([line[s[3]], s[0].split('-')[0], instText, s[2]]);
+            }
+            if (steps.length) router.setItinerary({ steps: steps, distance: data.route_summary.total_distance, time: data.route_summary.total_time });
+            return true;
+        }
+    };
 };
 
 OSM.RoutingEngines.list.push(new OSRMEngine("Car", "http://router.project-osrm.org/viaroute").createConfig());

From 15f0367e7fb8bf78059759414d7ec0d3dcceb42a Mon Sep 17 00:00:00 2001
From: Dan Stowell <danstowell@users.sourceforge.net>
Date: Sun, 9 Mar 2014 09:37:42 +0000
Subject: [PATCH 46/88] jsrouting: mouseover an instruction, highlight the
 route segment

---
 app/assets/javascripts/routing.js.erb         | 18 ++++++++++++++--
 .../routing_engines/graphhopper.js            |  2 +-
 .../javascripts/routing_engines/mapquest.js   | 21 +++++++++++++++----
 .../javascripts/routing_engines/osrm.js       |  8 ++++++-
 4 files changed, 41 insertions(+), 8 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index d62e94f0c..7bb27f72b 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -10,6 +10,12 @@ var ROUTING_POLYLINE={
     weight: 10
 };
 
+var ROUTING_POLYLINE_HIGHLIGHT={
+    color: '#ff0',
+    opacity: 0.5,
+    weight: 12
+};
+
 
 OSM.RoutingEngines={
     list: []
@@ -171,7 +177,7 @@ OSM.Routing=function(map,name,jqSearch) {
     };
 
     // Take directions and write them out
-    // data = { steps: array of [latlng, sprite number, instruction text, distance in metres] }
+    // data = { steps: array of [latlng, sprite number, instruction text, distance in metres, highlightPolyline] }
     // sprite numbers equate to OSRM's route_instructions turn values
     r.setItinerary=function(data) {
         // Create base table
@@ -200,8 +206,9 @@ OSM.Routing=function(map,name,jqSearch) {
             row.append("<td class='direction i"+step[1]+"'> ");
             row.append("<td class='instruction'>"+step[2]);
             row.append("<td class='distance'>"+dist);
-            with ({ num: i, ll: step[0] }) {
+            with ({ num: i, ll: step[0], lineseg: step[4] }) {
                 row.on('click',function(e) { r.clickTurn(num, ll); });
+                row.hover(function(e){r.highlightSegment(lineseg);}, function(e){r.unhighlightSegment();});
             };
             $('#turnbyturn').append(row);
             cumulative+=step[3];
@@ -212,6 +219,13 @@ OSM.Routing=function(map,name,jqSearch) {
     r.clickTurn=function(num,latlng) {
         r.popup=L.popup().setLatLng(latlng).setContent("<p>"+(num+1)+"</p>").openOn(r.map);
     };
+    r.highlightSegment=function(lineseg){
+        if (r.highlighted) map.removeLayer(r.highlighted);
+        r.highlighted=L.polyline(lineseg, ROUTING_POLYLINE_HIGHLIGHT).addTo(r.map);
+    }
+    r.unhighlightSegment=function(){
+        if (r.highlighted) map.removeLayer(r.highlighted);
+    }
     r.formatDistance=function(m) {
         if      (m < 1000 ) { return Math.round(m) + "m"; }
         else if (m < 10000) { return (m/1000.0).toFixed(1) + "km"; }
diff --git a/app/assets/javascripts/routing_engines/graphhopper.js b/app/assets/javascripts/routing_engines/graphhopper.js
index 5c10433c2..5e14ea0df 100644
--- a/app/assets/javascripts/routing_engines/graphhopper.js
+++ b/app/assets/javascripts/routing_engines/graphhopper.js
@@ -42,7 +42,7 @@ GraphHopperEngine.prototype.createConfig = function() {
                 instrText += instr.descriptions[i];
                 var latlng = instr.latLngs[i];
                 var distInMeter = instr.distances[i];
-                steps.push([{lat: latlng[0], lng: latlng[1]}, instrCode, instrText, distInMeter]);
+                steps.push([{lat: latlng[0], lng: latlng[1]}, instrCode, instrText, distInMeter, []]); // TODO does graphhopper map instructions onto line indices?
             }
             router.setItinerary({ steps: steps, distance: data.route.distance, time: data.route['time']/1000 });
             return true;
diff --git a/app/assets/javascripts/routing_engines/mapquest.js b/app/assets/javascripts/routing_engines/mapquest.js
index eb92893b3..fd17e5942 100644
--- a/app/assets/javascripts/routing_engines/mapquest.js
+++ b/app/assets/javascripts/routing_engines/mapquest.js
@@ -60,14 +60,27 @@ MapQuestEngine.prototype.createConfig = function() {
             }
             router.setPolyline(poly);
 
-            // data.shape.maneuverIndexes links turns to polyline positions
-            // data.legs[0].maneuvers is list of turns
+            // data.route.shape.maneuverIndexes links turns to polyline positions
+            // data.route.legs[0].maneuvers is list of turns
             var steps=[];
             var mq=data.route.legs[0].maneuvers;
             for (var i=0; i<mq.length; i++) {
                 var s=mq[i];
-                var d=(i==mq.length-1) ? 15: this.MQ_SPRITE_MAP[s.turnType];
-                steps.push([L.latLng(s.startPoint.lat, s.startPoint.lng), d, s.narrative, s.distance*1000]);
+                var d;
+                var linesegstart, linesegend, lineseg;
+                linesegstart = data.route.shape.maneuverIndexes[i];
+                if (i==mq.length-1) {
+                    d = 15;
+                    linesegend = linesegstart + 1;
+                } else {
+                    d = this.MQ_SPRITE_MAP[s.turnType];
+                    linesegend = data.route.shape.maneuverIndexes[i+1] + 1;
+                }
+                lineseg = [];
+                for (var j=linesegstart; j<linesegend; j++) {
+                    lineseg.push(L.latLng(data.route.shape.shapePoints[j*2], data.route.shape.shapePoints[j*2+1]));
+                }
+                steps.push([L.latLng(s.startPoint.lat, s.startPoint.lng), d, s.narrative, s.distance*1000, lineseg]);
             }
             router.setItinerary( { steps: steps, distance: data.route.distance*1000, time: data.route['time'] });
             return true;
diff --git a/app/assets/javascripts/routing_engines/osrm.js b/app/assets/javascripts/routing_engines/osrm.js
index d6f3535b4..5808fb7ee 100644
--- a/app/assets/javascripts/routing_engines/osrm.js
+++ b/app/assets/javascripts/routing_engines/osrm.js
@@ -38,12 +38,18 @@ OSRMEngine.prototype.createConfig = function() {
             var steps=[];
             for (i=0; i<data.route_instructions.length; i++) {
                 var s=data.route_instructions[i];
+                var linesegend;
                 var instCodes=s[0].split('-');
                 var instText="<b>"+(i+1)+".</b> ";
                 instText+=TURN_INSTRUCTIONS[instCodes[0]];
                 if (instCodes[1]) { instText+="exit "+instCodes[1]+" "; }
                 if (instCodes[0]!=15) { instText+=s[1] ? "<b>"+s[1]+"</b>" : I18n.t('javascripts.directions.instructions.unnamed'); }
-                steps.push([line[s[3]], s[0].split('-')[0], instText, s[2]]);
+                if ((i+1)<data.route_instructions.length) {
+                    linesegend = data.route_instructions[i+1][3] + 1;
+                } else {
+                    linesegend = s[3] + 1;
+                }
+                steps.push([line[s[3]], s[0].split('-')[0], instText, s[2], line.slice(s[3], linesegend)]);
             }
             if (steps.length) router.setItinerary({ steps: steps, distance: data.route_summary.total_distance, time: data.route_summary.total_time });
             return true;

From 42c1dec8f0f53b457e9512bcc24f26cad9df9916 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Sun, 9 Mar 2014 12:05:37 +0000
Subject: [PATCH 47/88] Resolve conflict

---
 app/assets/javascripts/routing.js.erb | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 7bb27f72b..42e4ba2bc 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -206,8 +206,8 @@ OSM.Routing=function(map,name,jqSearch) {
             row.append("<td class='direction i"+step[1]+"'> ");
             row.append("<td class='instruction'>"+step[2]);
             row.append("<td class='distance'>"+dist);
-            with ({ num: i, ll: step[0], lineseg: step[4] }) {
-                row.on('click',function(e) { r.clickTurn(num, ll); });
+            with ({ instruction: step[2], ll: step[0], lineseg: step[4] }) {
+                row.on('click',function(e) { r.clickTurn(instruction, ll); });
                 row.hover(function(e){r.highlightSegment(lineseg);}, function(e){r.unhighlightSegment();});
             };
             $('#turnbyturn').append(row);
@@ -216,8 +216,8 @@ OSM.Routing=function(map,name,jqSearch) {
         $('#sidebar_content').append('<p id="routing_credit">' + r.chosenEngine.creditline + '</p>');
 
     };
-    r.clickTurn=function(num,latlng) {
-        r.popup=L.popup().setLatLng(latlng).setContent("<p>"+(num+1)+"</p>").openOn(r.map);
+    r.clickTurn=function(instruction,latlng) {
+        r.popup=L.popup().setLatLng(latlng).setContent("<p>"+instruction+"</p>").openOn(r.map);
     };
     r.highlightSegment=function(lineseg){
         if (r.highlighted) map.removeLayer(r.highlighted);

From bc67479bccbd09b6f6279224e549d5142fc800a0 Mon Sep 17 00:00:00 2001
From: Dan Stowell <danstowell@users.sourceforge.net>
Date: Sun, 9 Mar 2014 15:06:08 +0000
Subject: [PATCH 48/88] jsrouting: clear search boxes on page unload

---
 app/assets/javascripts/router.js | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/app/assets/javascripts/router.js b/app/assets/javascripts/router.js
index 9657549b1..05e47c356 100644
--- a/app/assets/javascripts/router.js
+++ b/app/assets/javascripts/router.js
@@ -174,6 +174,9 @@ OSM.Router = function(map, rts) {
 
   map.on('moveend baselayerchange overlaylayerchange', router.updateHash);
   $(window).on('hashchange', router.hashUpdated);
+  $(window).on('unload', function(e) {
+      $(".query_wrapper.routing input").val("");
+  });
 
   return router;
 };

From 608ec07b1f356ac8f9e857d1a31b9eb94a2c79ab Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Sun, 9 Mar 2014 20:27:22 +0000
Subject: [PATCH 49/88] Refer to the id for the distance/time summary
 (otherwise it fouls up the welcome message spacing)

---
 app/assets/stylesheets/common.css.scss | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index 51f3c7e93..b94f30c6d 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -635,10 +635,6 @@ nav.secondary {
       font-size: 13px;
     }
 
-    p {
-      padding: 0 $lineheight $lineheight/4;
-    }
-
     .icon.close {
       float: right;
       cursor: pointer;
@@ -1009,6 +1005,10 @@ td.direction {
 td.direction.i#{$i}  { background-position: #{($i)*-20+20}px 0px; }
 }
 
+p#routing_summary {
+    padding: 0 $lineheight $lineheight/4;
+}
+
 td.instruction, td.distance {
     padding-top: 0;
     border-bottom: 1px solid #DDD;

From 888db7a3b45a789b7e67e602a0002200a8219e18 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Sun, 9 Mar 2014 21:29:48 +0000
Subject: [PATCH 50/88] Firefox-friendly calculation of dragstart offset
 (personally I am not feeling very Firefox-friendly right now)

---
 app/assets/javascripts/index.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index e5f6fe478..2b5f23ef1 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -361,8 +361,10 @@ $(document).ready(function () {
     $(".routing_marker").on('dragstart',function(e) {
       e.originalEvent.dataTransfer.effectAllowed = 'move';
       e.originalEvent.dataTransfer.setData('id', this.id);
-      e.originalEvent.dataTransfer.setData('offsetX', e.originalEvent.target.width/2 - (e.originalEvent.x-e.target.x));
-      e.originalEvent.dataTransfer.setData('offsetY', e.originalEvent.target.height  - (e.originalEvent.y-e.target.y));
+      var xo=e.originalEvent.clientX - $(e.target).offset().left;
+      var yo=e.originalEvent.clientY - $(e.target).offset().top;
+      e.originalEvent.dataTransfer.setData('offsetX', e.originalEvent.target.width/2 - xo);
+      e.originalEvent.dataTransfer.setData('offsetY', e.originalEvent.target.height  - yo);
     });
   });
 

From 9d8ab7dbd11f9fff0faf82b948bf1a07e86aa5b7 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Mon, 10 Mar 2014 16:55:01 +0000
Subject: [PATCH 51/88] From->To->Go order as per @samanpwbb's comment

---
 app/assets/javascripts/index.js        | 2 ++
 app/assets/stylesheets/common.css.scss | 4 ++++
 2 files changed, 6 insertions(+)

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index 2b5f23ef1..52b8b4c23 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -355,6 +355,7 @@ $(document).ready(function () {
     e.preventDefault();
     $(".search").hide();
     $(".routing").show();
+    $(".search_form input[type='submit']").addClass("routing_submit");
     $(".query_wrapper.routing [name=route_from]").focus();
     $("#map").on('dragend dragover',function(e) { e.preventDefault(); });
     $("#map").on('drop',function(e) { OSM.routing.handleDrop(e); e.preventDefault(); });
@@ -372,6 +373,7 @@ $(document).ready(function () {
     e.preventDefault();
     $(".search").show();
     $(".routing").hide();
+    $(".search_form input[type='submit']").removeClass("routing_submit");
     OSM.routing.close();
     $("#map").off('dragend drop dragover');
     $(".routing_marker").off('dragstart');
diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index b94f30c6d..5a26d12f3 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -1005,6 +1005,10 @@ td.direction {
 td.direction.i#{$i}  { background-position: #{($i)*-20+20}px 0px; }
 }
 
+.routing_submit {
+    margin-top: 30px !important;
+}
+
 p#routing_summary {
     padding: 0 $lineheight $lineheight/4;
 }

From 23ffdadb565be5ccc4ae9fad9647bdf0fa9b8683 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Mon, 10 Mar 2014 18:02:28 +0000
Subject: [PATCH 52/88] Don't show http-only routers to users on https

---
 app/assets/javascripts/routing.js.erb                 | 5 ++++-
 app/assets/javascripts/routing_engines/graphhopper.js | 4 ++--
 app/assets/javascripts/routing_engines/mapquest.js    | 8 ++++----
 app/assets/javascripts/routing_engines/osrm.js        | 2 +-
 4 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 42e4ba2bc..84bf17832 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -18,7 +18,10 @@ var ROUTING_POLYLINE_HIGHLIGHT={
 
 
 OSM.RoutingEngines={
-    list: []
+    list: [],
+    add: function(supportsHTTPS,engine) {
+        if (document.location.protocol=="http:" || supportsHTTPS) this.list.push(engine);
+    }
 };
 
 OSM.Routing=function(map,name,jqSearch) {
diff --git a/app/assets/javascripts/routing_engines/graphhopper.js b/app/assets/javascripts/routing_engines/graphhopper.js
index 5e14ea0df..6d83e26e2 100644
--- a/app/assets/javascripts/routing_engines/graphhopper.js
+++ b/app/assets/javascripts/routing_engines/graphhopper.js
@@ -59,5 +59,5 @@ GraphHopperEngine.prototype.createConfig = function() {
     };
 };
 
-OSM.RoutingEngines.list.push(new GraphHopperEngine("Bicycle", "vehicle=bike").createConfig());
-OSM.RoutingEngines.list.push(new GraphHopperEngine("Foot", "vehicle=foot").createConfig());
+OSM.RoutingEngines.add(false, new GraphHopperEngine("Bicycle", "vehicle=bike").createConfig());
+OSM.RoutingEngines.add(false, new GraphHopperEngine("Foot", "vehicle=foot").createConfig());
diff --git a/app/assets/javascripts/routing_engines/mapquest.js b/app/assets/javascripts/routing_engines/mapquest.js
index fd17e5942..dc854ccdc 100644
--- a/app/assets/javascripts/routing_engines/mapquest.js
+++ b/app/assets/javascripts/routing_engines/mapquest.js
@@ -40,7 +40,7 @@ MapQuestEngine.prototype.createConfig = function() {
             18: 1  // straight fork
         },
         getRoute: function(isFinal,points) {
-            var url="http://open.mapquestapi.com/directions/v2/route?key=Fmjtd%7Cluur290anu%2Crl%3Do5-908a0y";
+            var url=document.location.protocol+"//open.mapquestapi.com/directions/v2/route?key=Fmjtd%7Cluur290anu%2Crl%3Do5-908a0y";
             var from=points[0]; var to=points[points.length-1];
             url+="&from="+from.join(',');
             url+="&to="+to.join(',');
@@ -88,7 +88,7 @@ MapQuestEngine.prototype.createConfig = function() {
     };
 };
 
-OSM.RoutingEngines.list.push(new MapQuestEngine("Bicycle", "routeType=bicycle").createConfig());
-OSM.RoutingEngines.list.push(new MapQuestEngine("Foot", "routeType=pedestrian").createConfig());
-OSM.RoutingEngines.list.push(new MapQuestEngine("Car", "routeType=fastest").createConfig());
+OSM.RoutingEngines.add(true, new MapQuestEngine("Bicycle", "routeType=bicycle").createConfig());
+OSM.RoutingEngines.add(true, new MapQuestEngine("Foot", "routeType=pedestrian").createConfig());
+OSM.RoutingEngines.add(true, new MapQuestEngine("Car", "routeType=fastest").createConfig());
 // can be: routeType=fastest|shortest|pedestrian|multimodal|bicycle
diff --git a/app/assets/javascripts/routing_engines/osrm.js b/app/assets/javascripts/routing_engines/osrm.js
index 5808fb7ee..660a306ea 100644
--- a/app/assets/javascripts/routing_engines/osrm.js
+++ b/app/assets/javascripts/routing_engines/osrm.js
@@ -57,4 +57,4 @@ OSRMEngine.prototype.createConfig = function() {
     };
 };
 
-OSM.RoutingEngines.list.push(new OSRMEngine("Car", "http://router.project-osrm.org/viaroute").createConfig());
+OSM.RoutingEngines.add(false, new OSRMEngine("Car", "http://router.project-osrm.org/viaroute").createConfig());

From 52054e6b23f3ff147ba34104b6f25b44c56ff158 Mon Sep 17 00:00:00 2001
From: Dan Stowell <danstowell@users.sourceforge.net>
Date: Sat, 22 Mar 2014 12:53:08 +0000
Subject: [PATCH 53/88] Fix hours:minutes duration display for routing

---
 app/assets/javascripts/routing.js.erb | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 84bf17832..787d31dda 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -235,7 +235,9 @@ OSM.Routing=function(map,name,jqSearch) {
         else                { return Math.round(m / 1000)  + "km"; }
     };
     r.formatTime=function(s) {
-        var d=new Date(s*1000); var h=d.getHours(); var m=d.getMinutes();
+        var m=Math.round(s/60);
+        var h=Math.floor(m/60);
+        m -= h*60;
         return h+":"+(m<10 ? '0' : '')+m;
     };
 

From d24cba4345d1784780c6036837109380e37986ae Mon Sep 17 00:00:00 2001
From: Kai Krueger <kakrueger@gmail.com>
Date: Sat, 29 Mar 2014 16:47:42 -0600
Subject: [PATCH 54/88] Minor fixes to the I18n code of routing

MapQuest instructions still don't translate, as that backend doesn't accept
simple language locals but require country codes as well.
---
 app/assets/javascripts/routing.js.erb              |  2 +-
 .../javascripts/routing_engines/graphhopper.js     |  4 +++-
 app/assets/javascripts/routing_engines/mapquest.js |  4 ++--
 app/assets/javascripts/routing_engines/osrm.js     |  2 +-
 config/locales/de.yml                              | 14 +++++++++++---
 config/locales/en.yml                              |  1 +
 6 files changed, 19 insertions(+), 8 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 84bf17832..3f38beef4 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -216,7 +216,7 @@ OSM.Routing=function(map,name,jqSearch) {
             $('#turnbyturn').append(row);
             cumulative+=step[3];
         }
-        $('#sidebar_content').append('<p id="routing_credit">' + r.chosenEngine.creditline + '</p>');
+        $('#sidebar_content').append('<p id="routing_credit">' + I18n.t('javascripts.directions.instructions.courtesy',{link: r.chosenEngine.creditline}) + '</p>');
 
     };
     r.clickTurn=function(instruction,latlng) {
diff --git a/app/assets/javascripts/routing_engines/graphhopper.js b/app/assets/javascripts/routing_engines/graphhopper.js
index 6d83e26e2..0f29c162b 100644
--- a/app/assets/javascripts/routing_engines/graphhopper.js
+++ b/app/assets/javascripts/routing_engines/graphhopper.js
@@ -1,6 +1,7 @@
 GraphHopperEngine = function(vehicleName, vehicleParam, locale) {
     this.vehicleName = vehicleName;
     this.vehicleParam = vehicleParam;
+    //At this point the local system isn't correctly initialised yet, so we don't have accurate information about current locale
     this.locale = locale;
     if (!locale)
         this.locale = "en";
@@ -10,12 +11,13 @@ GraphHopperEngine.prototype.createConfig = function() {
     var that = this;
     return {
         name: "javascripts.directions.engines.graphhopper_"+this.vehicleName.toLowerCase(),
+            creditline: '<a href="http://graphhopper.com/" target="_blank">Graphhopper</a>',
         draggable: false,
         _hints: {},
         getRoute: function(isFinal, points) {
             var url = "http://graphhopper.com/routing/api/route?" 
                     + that.vehicleParam 
-                    + "&locale=" + that.locale;
+                    + "&locale=" + I18n.currentLocale();
             for (var i = 0; i < points.length; i++) {
                 var pair = points[i].join(',');
                 url += "&point=" + pair;
diff --git a/app/assets/javascripts/routing_engines/mapquest.js b/app/assets/javascripts/routing_engines/mapquest.js
index dc854ccdc..39e47706a 100644
--- a/app/assets/javascripts/routing_engines/mapquest.js
+++ b/app/assets/javascripts/routing_engines/mapquest.js
@@ -15,7 +15,7 @@ MapQuestEngine.prototype.createConfig = function() {
     var that = this;
     return {
         name: "javascripts.directions.engines.mapquest_"+this.vehicleName.toLowerCase(),
-        creditline: 'Directions courtesy of <a href="http://www.mapquest.com/" target="_blank">MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png">',
+        creditline: '<a href="http://www.mapquest.com/" target="_blank">MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png">',
         draggable: false,
         _hints: {},
         MQ_SPRITE_MAP: {
@@ -45,7 +45,7 @@ MapQuestEngine.prototype.createConfig = function() {
             url+="&from="+from.join(',');
             url+="&to="+to.join(',');
             url+="&"+that.vehicleParam;
-            //url+="&locale=" + I18n.currentLocale(); //Doesn't actually work. MapQuest requires full locale e.g. "de_DE", but I18n only provides language, e.g. "de"
+            //url+="&locale=" + I18n.currentLocale(); //Doesn't actually work. MapQuest requires full locale e.g. "de_DE", but I18n may only provides language, e.g. "de"
             url+="&manMaps=false";
             url+="&shapeFormat=raw&generalize=0&unit=k";
             this.requestCORS(url);
diff --git a/app/assets/javascripts/routing_engines/osrm.js b/app/assets/javascripts/routing_engines/osrm.js
index 660a306ea..b40d5b306 100644
--- a/app/assets/javascripts/routing_engines/osrm.js
+++ b/app/assets/javascripts/routing_engines/osrm.js
@@ -13,7 +13,7 @@ OSRMEngine.prototype.createConfig = function() {
     var that = this;
     return {
         name: "javascripts.directions.engines.osrm_"+this.vehicleName.toLowerCase(),
-        creditline: 'Directions courtesy of <a href="http://project-osrm.org/" target="_blank">OSRM</a>',
+            creditline: '<a href="http://project-osrm.org/" target="_blank">OSRM</a>',
         draggable: true,
         _hints: {},
         getRoute: function(isFinal,points) {
diff --git a/config/locales/de.yml b/config/locales/de.yml
index d2d9e9349..798105ee0 100644
--- a/config/locales/de.yml
+++ b/config/locales/de.yml
@@ -944,10 +944,17 @@ de:
     directions:
       directions: "Fahranweisungen: "
       engines:
-        graphhopper_bike: "Fahrrad (GraphHopper)"
-        mapquest_bike: "Fahrrad (MapQuest)"
+        graphhopper_bicycle: "Fahrrad (GraphHopper)"
+        graphhopper_foot: "Fuss (GraphHopper)"
+        mapquest_bicycle: "Fahrrad (MapQuest)"
+        mapquest_foot: "Fuss (MapQuest)"
+        mapquest_car: "Auto (MapQuest)"
         osrm_car: "Auto (OSRM)"
-        cloudmade_foot: "Fuss (Cloudmade)"
+      distance: "Distanz:"
+      time: "Zeit:"
+      errors:
+        no_route: "Wir konnten keine Strecke zwischen diesen beiden Orten berechnen."
+        no_place: "Wir konnten den Ort nicht finden."
       instructions:
         continue_on: "Weiter auf "
         slight_right: "Rechts halten auf "
@@ -967,6 +974,7 @@ de:
         against_oneway: "Go against one-way on "
         end_oneway: "Ende der Einbahnstrasse "
         unnamed: "(unbekannt)"
+        courtesy: "Fahranweisungen stammen von %{link}"
     key: 
       title: Legende
       tooltip: Legende
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 4384fda86..7787fde86 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -2151,6 +2151,7 @@ en:
         against_oneway: "Go against one-way on "
         end_oneway: "End of one-way on "
         unnamed: "(unnamed)"
+        courtesy: "Directions courtesy of %{link}"
       time: "Time"
   redaction:
     edit:

From 873c1cb84e2fe475bc4ff566d71929fdcc35787d Mon Sep 17 00:00:00 2001
From: Peter <peathal@yahoo.de>
Date: Tue, 1 Apr 2014 16:22:06 +0200
Subject: [PATCH 55/88] Using GraphHopper new API

---
 .../routing_engines/graphhopper.js            | 39 +++++++++++--------
 1 file changed, 23 insertions(+), 16 deletions(-)

diff --git a/app/assets/javascripts/routing_engines/graphhopper.js b/app/assets/javascripts/routing_engines/graphhopper.js
index 0f29c162b..47583364c 100644
--- a/app/assets/javascripts/routing_engines/graphhopper.js
+++ b/app/assets/javascripts/routing_engines/graphhopper.js
@@ -15,9 +15,13 @@ GraphHopperEngine.prototype.createConfig = function() {
         draggable: false,
         _hints: {},
         getRoute: function(isFinal, points) {
-            var url = "http://graphhopper.com/routing/api/route?" 
-                    + that.vehicleParam 
-                    + "&locale=" + I18n.currentLocale();
+            // documentation
+            // https://github.com/graphhopper/graphhopper/blob/master/docs/web/api-doc.md
+            var url = "http://graphhopper.com/api/1/route?" 
+                    + that.vehicleParam
+                    + "&locale=" + I18n.currentLocale()
+                    + "&key=LijBPDQGfu7Iiq80w3HzwB4RUDJbMbhs6BU0dEnn";
+            
             for (var i = 0; i < points.length; i++) {
                 var pair = points[i].join(',');
                 url += "&point=" + pair;
@@ -28,25 +32,26 @@ GraphHopperEngine.prototype.createConfig = function() {
             this.requestJSONP(url + "&type=jsonp&callback=");
         },
         gotRoute: function(router, data) {
-            if (!data.info.routeFound) {
+            if (!data.paths || data.paths.length == 0)
                 return false;
-            }
+            
             // Draw polyline
-            var line = L.PolylineUtil.decode(data.route.coordinates);
+            var path = data.paths[0];
+            var line = L.PolylineUtil.decode(path.points);
             router.setPolyline(line);
             // Assemble instructions
             var steps = [];
-            var instr = data.route.instructions;
-            for (i = 0; i < instr.descriptions.length; i++) {
-                var indi = instr.indications[i];
-                var instrCode = (i == instr.descriptions.length - 1) ? 15 : this.GH_INSTR_MAP[indi];
+            var len = path.instructions.length;
+            for (i = 0; i < len; i++) {
+                var instr = path.instructions[i];                
+                var instrCode = (i === len - 1) ? 15 : this.GH_INSTR_MAP[instr.sign];
                 var instrText = "<b>" + (i + 1) + ".</b> ";
-                instrText += instr.descriptions[i];
-                var latlng = instr.latLngs[i];
-                var distInMeter = instr.distances[i];
-                steps.push([{lat: latlng[0], lng: latlng[1]}, instrCode, instrText, distInMeter, []]); // TODO does graphhopper map instructions onto line indices?
+                instrText += instr.text;
+                var latLng = line[instr.interval[0]];                
+                var distInMeter = instr.distance;
+                steps.push([{lat: latLng.lat, lng: latLng.lng}, instrCode, instrText, distInMeter, []]); // TODO does graphhopper map instructions onto line indices?
             }
-            router.setItinerary({ steps: steps, distance: data.route.distance, time: data.route['time']/1000 });
+            router.setItinerary({ steps: steps, distance: path.distance, time: path.time / 1000 });
             return true;
         },
         GH_INSTR_MAP: {
@@ -56,7 +61,9 @@ GraphHopperEngine.prototype.createConfig = function() {
             0: 0, // straight
             1: 1, // slight right
             2: 2, // right
-            3: 3 // sharp right		
+            3: 3, // sharp right
+            4: -1, // finish reached
+            5: -1 // via reached
         }
     };
 };

From ed75d4710b0d4aec2c57f610083762d6fd63e9c9 Mon Sep 17 00:00:00 2001
From: John Firebaugh <john.firebaugh@gmail.com>
Date: Mon, 12 May 2014 12:32:32 -0700
Subject: [PATCH 56/88] Conform to project style conventions

---
 app/assets/javascripts/routing.js.erb         | 584 ++++++++++--------
 .../routing_engines/graphhopper.js            | 141 +++--
 .../javascripts/routing_engines/mapquest.js   | 162 ++---
 .../javascripts/routing_engines/osrm.js       | 111 ++--
 4 files changed, 534 insertions(+), 464 deletions(-)

diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/routing.js.erb
index 5ff0656c8..fc2bb8d30 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/routing.js.erb
@@ -1,33 +1,33 @@
 /*
-    osm.org routing interface
+ osm.org routing interface
 */
 
-var TURN_INSTRUCTIONS=[]
+var TURN_INSTRUCTIONS = [];
 
-var ROUTING_POLYLINE={
-    color: '#03f',
-    opacity: 0.3,
-    weight: 10
+var ROUTING_POLYLINE = {
+  color: '#03f',
+  opacity: 0.3,
+  weight: 10
 };
 
-var ROUTING_POLYLINE_HIGHLIGHT={
-    color: '#ff0',
-    opacity: 0.5,
-    weight: 12
+var ROUTING_POLYLINE_HIGHLIGHT = {
+  color: '#ff0',
+  opacity: 0.5,
+  weight: 12
 };
 
-
-OSM.RoutingEngines={
-    list: [],
-    add: function(supportsHTTPS,engine) {
-        if (document.location.protocol=="http:" || supportsHTTPS) this.list.push(engine);
-    }
+OSM.RoutingEngines = {
+  list: [],
+  add: function (supportsHTTPS, engine) {
+    if (document.location.protocol == "http:" || supportsHTTPS) this.list.push(engine);
+  }
 };
 
-OSM.Routing=function(map,name,jqSearch) {
-    var r={};
+OSM.Routing = function (map, name, jqSearch) {
+  var r = {};
 
-    TURN_INSTRUCTIONS=["",
+  TURN_INSTRUCTIONS = [
+    "",
     I18n.t('javascripts.directions.instructions.continue_on'),      // 1
     I18n.t('javascripts.directions.instructions.slight_right'),     // 2
     I18n.t('javascripts.directions.instructions.turn_right'),       // 3
@@ -44,266 +44,314 @@ OSM.Routing=function(map,name,jqSearch) {
     I18n.t('javascripts.directions.instructions.start'),            // 14
     I18n.t('javascripts.directions.instructions.destination'),      // 15
     I18n.t('javascripts.directions.instructions.against_oneway'),   // 16
-    I18n.t('javascripts.directions.instructions.end_oneway')]       // 17
+    I18n.t('javascripts.directions.instructions.end_oneway')        // 17
+  ];
 
-    r.map=map;              // Leaflet map
-    r.name=name;            // global variable name of this instance (needed for JSONP)
-    r.jqSearch=jqSearch;    // JQuery object for search panel
+  r.map = map;              // Leaflet map
+  r.name = name;            // global variable name of this instance (needed for JSONP)
+  r.jqSearch = jqSearch;    // JQuery object for search panel
 
-    r.route_from=null;      // null=unset, false=awaiting response, [lat,lon]=geocoded
-    r.route_to=null;        //  |
-    r.awaitingGeocode=false;// true if the user has requested a route, but we're waiting on a geocode result
-    r.awaitingRoute=false;  // true if we've asked the engine for a route and are waiting to hear back
-    r.dragging=false;       // true if the user is dragging a start/end point
-    r.viaPoints=[];         // not yet used
+  r.route_from = null;      // null=unset, false=awaiting response, [lat,lon]=geocoded
+  r.route_to = null;        //  |
+  r.awaitingGeocode = false;// true if the user has requested a route, but we're waiting on a geocode result
+  r.awaitingRoute = false;  // true if we've asked the engine for a route and are waiting to hear back
+  r.dragging = false;       // true if the user is dragging a start/end point
+  r.viaPoints = [];         // not yet used
 
-    r.polyline=null;        // Leaflet polyline object
-    r.popup=null;           // Leaflet popup object
-    r.marker_from=null;     // Leaflet from marker
-    r.marker_to=null;       // Leaflet to marker
+  r.polyline = null;        // Leaflet polyline object
+  r.popup = null;           // Leaflet popup object
+  r.marker_from = null;     // Leaflet from marker
+  r.marker_to = null;       // Leaflet to marker
 
-    r.chosenEngine=null;    // currently selected routing engine
+  r.chosenEngine = null;    // currently selected routing engine
 
-    var icon_from = L.icon({
-        iconUrl: <%= asset_path('marker-green.png').to_json %>,
-        iconSize: [25, 41],
-        iconAnchor: [12, 41],
-        popupAnchor: [1, -34],
-        shadowUrl: <%= asset_path('images/marker-shadow.png').to_json %>,
-        shadowSize: [41, 41]
-    });
-    var icon_to = L.icon({
-        iconUrl: <%= asset_path('marker-red.png').to_json %>,
-        iconSize: [25, 41],
-        iconAnchor: [12, 41],
-        popupAnchor: [1, -34],
-        shadowUrl: <%= asset_path('images/marker-shadow.png').to_json %>,
-        shadowSize: [41, 41]
+  var icon_from = L.icon({
+    iconUrl: <%= asset_path('marker-green.png').to_json %>,
+    iconSize: [25, 41],
+    iconAnchor: [12, 41],
+    popupAnchor: [1, -34],
+    shadowUrl: <%= asset_path('images/marker-shadow.png').to_json %>,
+    shadowSize: [41, 41]
+  });
+
+  var icon_to = L.icon({
+    iconUrl: <%= asset_path('marker-red.png').to_json %>,
+    iconSize: [25, 41],
+    iconAnchor: [12, 41],
+    popupAnchor: [1, -34],
+    shadowUrl: <%= asset_path('images/marker-shadow.png').to_json %>,
+    shadowSize: [41, 41]
+  });
+
+  // Geocoding
+
+  r.geocode = function (id, event) {
+    var _this = this;
+    var field = event.target;
+    var v = event.target.value;
+    var querystring = '<%= NOMINATIM_URL %>search?q=' + encodeURIComponent(v) + '&format=json';
+    // *** &accept-language=<%#= request.user_preferred_languages.join(',') %>
+    r[field.id] = false;
+    $.getJSON(querystring, function (json) {
+      _this._gotGeocode(json, field);
     });
+  };
 
-    // Geocoding
-
-    r.geocode=function(id,event) { var _this=this;
-        var field=event.target;
-        var v=event.target.value;
-        var querystring = '<%= NOMINATIM_URL %>search?q=' + encodeURIComponent(v) + '&format=json';
-        // *** &accept-language=<%#= request.user_preferred_languages.join(',') %>
-        r[field.id]=false;
-        $.getJSON(querystring, function(json) { _this._gotGeocode(json,field); });
-    };
-    
-    r._gotGeocode=function(json,field) {
-        if (json.length==0) {
-            alert(I18n.t('javascripts.directions.errors.no_place'));
-            r[field.id]=null;
-            return;
-        }
-        field.value=json[0].display_name;
-        var lat=Number(json[0].lat), lon=Number(json[0].lon);
-        r[field.id]=[lat,lon];
-        r.updateMarker(field.id);
-        if (r.awaitingGeocode) {
-            r.awaitingGeocode=false;
-            r.requestRoute(true, true);
-        }
-    };
-
-    // Drag and drop markers
-    
-    r.handleDrop=function(e) {
-        var oe=e.originalEvent;
-        var id=oe.dataTransfer.getData('id');
-        var pt=L.DomEvent.getMousePosition(oe,map.getContainer());  // co-ordinates of the mouse pointer at present
-        pt.x+=Number(oe.dataTransfer.getData('offsetX'));
-        pt.y+=Number(oe.dataTransfer.getData('offsetY'));
-        var ll=map.containerPointToLatLng(pt);
-        r.createMarker(ll,id);
-        r.setNumericInput(ll,id);
-        r.requestRoute(true, false);
-        // update to/from field
-    };
-    r.createMarker=function(latlng,id) {
-        if (r[id]) r.map.removeLayer(r[id]);
-        r[id]=L.marker(latlng, {
-            icon: id=='marker_from' ? icon_from : icon_to,
-            draggable: true,
-            name: id
-        }).addTo(r.map);
-        r[id].on('drag',r.markerDragged);
-        r[id].on('dragend',r.markerDragged);
-    };
-    // Update marker from geocoded route input
-    r.updateMarker=function(id) {
-        var m=id.replace('route','marker');
-        if (!r[m]) { r.createMarker(r[id],m); return; }
-        var ll=r[m].getLatLng();
-        if (ll.lat!=r[id][0] || ll.lng!=r[id][1]) {
-            r.createMarker(r[id],m);
-        }
-    };
-    // Marker has been dragged
-    r.markerDragged=function(e) {
-        r.dragging=(e.type=='drag');    // true for drag, false for dragend
-        if (r.dragging && !r.chosenEngine.draggable) return;
-        if (r.dragging && r.awaitingRoute) return;
-        r.setNumericInput(e.target.getLatLng(), e.target.options.name);
-        r.requestRoute(!r.dragging, false);
-    };
-    // Set a route input field to a numeric value
-    r.setNumericInput=function(ll,id) {
-        var routeid=id.replace('marker','route');
-        r[routeid]=[ll.lat,ll.lng];
-        $("[name="+routeid+"]:visible").val(Math.round(ll.lat*10000)/10000+" "+Math.round(ll.lng*10000)/10000);
+  r._gotGeocode = function (json, field) {
+    if (json.length == 0) {
+      alert(I18n.t('javascripts.directions.errors.no_place'));
+      r[field.id] = null;
+      return;
     }
-    
-    // Route-fetching UI
-
-    r.requestRoute=function(isFinal, updateZoom) {
-        if (r.route_from && r.route_to) {
-            $(".query_wrapper.routing .spinner").show();
-            r.awaitingRoute=true;
-            r.chosenEngine.getRoute(isFinal,[r.route_from,r.route_to]);
-            if(updateZoom){
-                r.map.fitBounds(L.latLngBounds([r.route_from, r.route_to]).pad(0.05));
-            }
-            // then, when the route has been fetched, it'll call the engine's gotRoute function
-        } else if (r.route_from==false || r.route_to==false) {
-            // we're waiting for a Nominatim response before we can request a route
-            r.awaitingGeocode=true;
-        }
-    };
-
-    // Take an array of Leaflet LatLngs and draw it as a polyline
-    r.setPolyline=function(line) {
-        if (r.polyline) map.removeLayer(r.polyline);
-        r.polyline=L.polyline(line, ROUTING_POLYLINE).addTo(r.map);
-    };
-
-    // Take directions and write them out
-    // data = { steps: array of [latlng, sprite number, instruction text, distance in metres, highlightPolyline] }
-    // sprite numbers equate to OSRM's route_instructions turn values
-    r.setItinerary=function(data) {
-        // Create base table
-        $("#content").removeClass("overlay-sidebar");
-        $('#sidebar_content').empty();
-        var html=('<h2><a class="geolink" href="#" onclick="$(~.close_directions~).click();return false;">' +
-                  '<span class="icon close"></span></a>' + I18n.t('javascripts.directions.directions') + 
-                  '</h2><p id="routing_summary">' + 
-                  I18n.t('javascripts.directions.distance') + ': ' + r.formatDistance(data.distance)+ '. ' +
-                  I18n.t('javascripts.directions.time'    ) + ': ' + r.formatTime(data.time) + '.</p>' +
-                  '<table id="turnbyturn" />').replace(/~/g,"'");
-        $('#sidebar_content').html(html);
-        // Add each row
-        var cumulative=0;
-        for (var i=0; i<data.steps.length; i++) {
-            var step=data.steps[i];
-            // Distance
-            var dist=step[3];
-            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"+step[1]+"'> ");
-            row.append("<td class='instruction'>"+step[2]);
-            row.append("<td class='distance'>"+dist);
-            with ({ instruction: step[2], ll: step[0], lineseg: step[4] }) {
-                row.on('click',function(e) { r.clickTurn(instruction, ll); });
-                row.hover(function(e){r.highlightSegment(lineseg);}, function(e){r.unhighlightSegment();});
-            };
-            $('#turnbyturn').append(row);
-            cumulative+=step[3];
-        }
-        $('#sidebar_content').append('<p id="routing_credit">' + I18n.t('javascripts.directions.instructions.courtesy',{link: r.chosenEngine.creditline}) + '</p>');
-
-    };
-    r.clickTurn=function(instruction,latlng) {
-        r.popup=L.popup().setLatLng(latlng).setContent("<p>"+instruction+"</p>").openOn(r.map);
-    };
-    r.highlightSegment=function(lineseg){
-        if (r.highlighted) map.removeLayer(r.highlighted);
-        r.highlighted=L.polyline(lineseg, ROUTING_POLYLINE_HIGHLIGHT).addTo(r.map);
+    field.value = json[0].display_name;
+    var lat = Number(json[0].lat), lon = Number(json[0].lon);
+    r[field.id] = [lat, lon];
+    r.updateMarker(field.id);
+    if (r.awaitingGeocode) {
+      r.awaitingGeocode = false;
+      r.requestRoute(true, true);
     }
-    r.unhighlightSegment=function(){
-        if (r.highlighted) map.removeLayer(r.highlighted);
+  };
+
+  // Drag and drop markers
+
+  r.handleDrop = function (e) {
+    var oe = e.originalEvent;
+    var id = oe.dataTransfer.getData('id');
+    var pt = L.DomEvent.getMousePosition(oe, map.getContainer());  // co-ordinates of the mouse pointer at present
+    pt.x += Number(oe.dataTransfer.getData('offsetX'));
+    pt.y += Number(oe.dataTransfer.getData('offsetY'));
+    var ll = map.containerPointToLatLng(pt);
+    r.createMarker(ll, id);
+    r.setNumericInput(ll, id);
+    r.requestRoute(true, false);
+    // update to/from field
+  };
+
+  r.createMarker = function (latlng, id) {
+    if (r[id]) r.map.removeLayer(r[id]);
+    r[id] = L.marker(latlng, {
+      icon: id == 'marker_from' ? icon_from : icon_to,
+      draggable: true,
+      name: id
+    }).addTo(r.map);
+    r[id].on('drag', r.markerDragged);
+    r[id].on('dragend', r.markerDragged);
+  };
+
+  // Update marker from geocoded route input
+  r.updateMarker = function (id) {
+    var m = id.replace('route', 'marker');
+    if (!r[m]) {
+      r.createMarker(r[id], m);
+      return;
     }
-    r.formatDistance=function(m) {
-        if      (m < 1000 ) { return Math.round(m) + "m"; }
-        else if (m < 10000) { return (m/1000.0).toFixed(1) + "km"; }
-        else                { return Math.round(m / 1000)  + "km"; }
-    };
-    r.formatTime=function(s) {
-        var m=Math.round(s/60);
-        var h=Math.floor(m/60);
-        m -= h*60;
-        return h+":"+(m<10 ? '0' : '')+m;
-    };
-
-    // Close all routing UI
-    
-    r.close=function() {
-        $("#content").addClass("overlay-sidebar");
-        r.route_from=r.route_to=null;
-        $(".query_wrapper.routing input").val("");
-        var remove=['polyline','popup','marker_from','marker_to'];
-        for (var i=0; i<remove.length; i++) {
-            if (r[remove[i]]) { map.removeLayer(r[remove[i]]); r[remove[i]]=null; }
-        }
-    };
-
-    // Routing engine handling
-
-    // Add all engines
-    var list=OSM.RoutingEngines.list;
-    list.sort(function(a,b) { return I18n.t(a.name)>I18n.t(b.name); });
-    var select=r.jqSearch.find('select.routing_engines');
-    for (var i=0; i<list.length; i++) {
-        // Set up JSONP callback
-        with ({num: i}) {
-            list[num].requestJSONP=function(url) {
-                var script = document.createElement('script');
-                script.src = url+r.name+".gotRoute"+num;
-                document.body.appendChild(script); 
-            };
-            list[num].requestCORS=function(url) {
-                $.ajax({ url: url, method: "GET", data: {}, dataType: 'json', success: r['gotRoute'+num] });
-            };
-            r['gotRoute'+num]=function(data) { 
-                r.awaitingRoute=false;
-                $(".query_wrapper.routing .spinner").hide();
-                if (!list[num].gotRoute(r,data)) {
-                    // No route found
-                    if (r.polyline) {
-                        map.removeLayer(r.polyline);
-                        r.polyline=null;
-                    }
-                    if (!r.dragging) { alert(I18n.t('javascripts.directions.errors.no_route')); }
-                }
-            };
-        }
-        select.append("<option value='"+i+"'>"+I18n.t(list[i].name)+"</option>");
+    var ll = r[m].getLatLng();
+    if (ll.lat != r[id][0] || ll.lng != r[id][1]) {
+      r.createMarker(r[id], m);
     }
-    r.engines=list;
-    r.chosenEngine=list[0]; // default to first engine
+  };
 
-    // Choose an engine on dropdown change
-    r.selectEngine=function(e) {
-        r.chosenEngine=r.engines[e.target.selectedIndex];
-        if (r.polyline){ // and if a route is currently showing, must also refresh, else confusion
-            r.requestRoute(true, false);
-        }
-    };
-    // Choose an engine by name
-    r.chooseEngine=function(name) {
-        for (var i=0; i<r.engines.length; i++) {
-            if (r.engines[i].name==name) {
-                r.chosenEngine=r.engines[i];
-                r.jqSearch.find('select.routing_engines').val(i);
-            }
-        }
-    };
+  // Marker has been dragged
+  r.markerDragged = function (e) {
+    r.dragging = (e.type == 'drag');    // true for drag, false for dragend
+    if (r.dragging && !r.chosenEngine.draggable) return;
+    if (r.dragging && r.awaitingRoute) return;
+    r.setNumericInput(e.target.getLatLng(), e.target.options.name);
+    r.requestRoute(!r.dragging, false);
+  };
 
-    return r;
+  // Set a route input field to a numeric value
+  r.setNumericInput = function (ll, id) {
+    var routeid = id.replace('marker', 'route');
+    r[routeid] = [ll.lat, ll.lng];
+    $("[name=" + routeid + "]:visible").val(Math.round(ll.lat * 10000) / 10000 + " " + Math.round(ll.lng * 10000) / 10000);
+  };
+
+  // Route-fetching UI
+
+  r.requestRoute = function (isFinal, updateZoom) {
+    if (r.route_from && r.route_to) {
+      $(".query_wrapper.routing .spinner").show();
+      r.awaitingRoute = true;
+      r.chosenEngine.getRoute(isFinal, [r.route_from, r.route_to]);
+      if (updateZoom) {
+        r.map.fitBounds(L.latLngBounds([r.route_from, r.route_to]).pad(0.05));
+      }
+      // then, when the route has been fetched, it'll call the engine's gotRoute function
+    } else if (r.route_from == false || r.route_to == false) {
+      // we're waiting for a Nominatim response before we can request a route
+      r.awaitingGeocode = true;
+    }
+  };
+
+  // Take an array of Leaflet LatLngs and draw it as a polyline
+  r.setPolyline = function (line) {
+    if (r.polyline) map.removeLayer(r.polyline);
+    r.polyline = L.polyline(line, ROUTING_POLYLINE).addTo(r.map);
+  };
+
+  // Take directions and write them out
+  // data = { steps: array of [latlng, sprite number, instruction text, distance in metres, highlightPolyline] }
+  // sprite numbers equate to OSRM's route_instructions turn values
+  r.setItinerary = function (data) {
+    // Create base table
+    $("#content").removeClass("overlay-sidebar");
+    $('#sidebar_content').empty();
+    var html = ('<h2><a class="geolink" href="#" onclick="$(~.close_directions~).click();return false;">' +
+      '<span class="icon close"></span></a>' + I18n.t('javascripts.directions.directions') +
+      '</h2><p id="routing_summary">' +
+      I18n.t('javascripts.directions.distance') + ': ' + r.formatDistance(data.distance) + '. ' +
+      I18n.t('javascripts.directions.time') + ': ' + r.formatTime(data.time) + '.</p>' +
+      '<table id="turnbyturn" />').replace(/~/g, "'");
+    $('#sidebar_content').html(html);
+    // Add each row
+    var cumulative = 0;
+    for (var i = 0; i < data.steps.length; i++) {
+      var step = data.steps[i];
+      // Distance
+      var dist = step[3];
+      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" + step[1] + "'> ");
+      row.append("<td class='instruction'>" + step[2]);
+      row.append("<td class='distance'>" + dist);
+      with ({ instruction: step[2], ll: step[0], lineseg: step[4] }) {
+        row.on('click', function (e) {
+          r.clickTurn(instruction, ll);
+        });
+        row.hover(function (e) {
+          r.highlightSegment(lineseg);
+        }, function (e) {
+          r.unhighlightSegment();
+        });
+      }
+      ;
+      $('#turnbyturn').append(row);
+      cumulative += step[3];
+    }
+    $('#sidebar_content').append('<p id="routing_credit">' + I18n.t('javascripts.directions.instructions.courtesy', {link: r.chosenEngine.creditline}) + '</p>');
+  };
+
+  r.clickTurn = function (instruction, latlng) {
+    r.popup = L.popup().setLatLng(latlng).setContent("<p>" + instruction + "</p>").openOn(r.map);
+  };
+
+  r.highlightSegment = function (lineseg) {
+    if (r.highlighted) map.removeLayer(r.highlighted);
+    r.highlighted = L.polyline(lineseg, ROUTING_POLYLINE_HIGHLIGHT).addTo(r.map);
+  };
+
+  r.unhighlightSegment = function () {
+    if (r.highlighted) map.removeLayer(r.highlighted);
+  };
+
+  r.formatDistance = function (m) {
+    if (m < 1000) {
+      return Math.round(m) + "m";
+    }
+    else if (m < 10000) {
+      return (m / 1000.0).toFixed(1) + "km";
+    }
+    else {
+      return Math.round(m / 1000) + "km";
+    }
+  };
+
+  r.formatTime = function (s) {
+    var m = Math.round(s / 60);
+    var h = Math.floor(m / 60);
+    m -= h * 60;
+    return h + ":" + (m < 10 ? '0' : '') + m;
+  };
+
+  // Close all routing UI
+
+  r.close = function () {
+    $("#content").addClass("overlay-sidebar");
+    r.route_from = r.route_to = null;
+    $(".query_wrapper.routing input").val("");
+    var remove = ['polyline', 'popup', 'marker_from', 'marker_to'];
+    for (var i = 0; i < remove.length; i++) {
+      if (r[remove[i]]) {
+        map.removeLayer(r[remove[i]]);
+        r[remove[i]] = null;
+      }
+    }
+  };
+
+  // Routing engine handling
+
+  // Add all engines
+  var list = OSM.RoutingEngines.list;
+  list.sort(function (a, b) {
+    return I18n.t(a.name) > I18n.t(b.name);
+  });
+  var select = r.jqSearch.find('select.routing_engines');
+  for (var i = 0; i < list.length; i++) {
+    // Set up JSONP callback
+    with ({num: i}) {
+      list[num].requestJSONP = function (url) {
+        var script = document.createElement('script');
+        script.src = url + r.name + ".gotRoute" + num;
+        document.body.appendChild(script);
+      };
+      list[num].requestCORS = function (url) {
+        $.ajax({ url: url, method: "GET", data: {}, dataType: 'json', success: r['gotRoute' + num] });
+      };
+      r['gotRoute' + num] = function (data) {
+        r.awaitingRoute = false;
+        $(".query_wrapper.routing .spinner").hide();
+        if (!list[num].gotRoute(r, data)) {
+          // No route found
+          if (r.polyline) {
+            map.removeLayer(r.polyline);
+            r.polyline = null;
+          }
+          if (!r.dragging) {
+            alert(I18n.t('javascripts.directions.errors.no_route'));
+          }
+        }
+      };
+    }
+    select.append("<option value='" + i + "'>" + I18n.t(list[i].name) + "</option>");
+  }
+
+  r.engines = list;
+  r.chosenEngine = list[0]; // default to first engine
+
+  // Choose an engine on dropdown change
+  r.selectEngine = function (e) {
+    r.chosenEngine = r.engines[e.target.selectedIndex];
+    if (r.polyline) { // and if a route is currently showing, must also refresh, else confusion
+      r.requestRoute(true, false);
+    }
+  };
+
+  // Choose an engine by name
+  r.chooseEngine = function (name) {
+    for (var i = 0; i < r.engines.length; i++) {
+      if (r.engines[i].name == name) {
+        r.chosenEngine = r.engines[i];
+        r.jqSearch.find('select.routing_engines').val(i);
+      }
+    }
+  };
+
+  return r;
 };
diff --git a/app/assets/javascripts/routing_engines/graphhopper.js b/app/assets/javascripts/routing_engines/graphhopper.js
index 47583364c..a0e877e4b 100644
--- a/app/assets/javascripts/routing_engines/graphhopper.js
+++ b/app/assets/javascripts/routing_engines/graphhopper.js
@@ -1,71 +1,80 @@
-GraphHopperEngine = function(vehicleName, vehicleParam, locale) {
-    this.vehicleName = vehicleName;
-    this.vehicleParam = vehicleParam;
-    //At this point the local system isn't correctly initialised yet, so we don't have accurate information about current locale
-    this.locale = locale;
-    if (!locale)
-        this.locale = "en";
+GraphHopperEngine = function (vehicleName, vehicleParam, locale) {
+  this.vehicleName = vehicleName;
+  this.vehicleParam = vehicleParam;
+  //At this point the local system isn't correctly initialised yet, so we don't have accurate information about current locale
+  this.locale = locale;
+  if (!locale)
+    this.locale = "en";
 };
 
-GraphHopperEngine.prototype.createConfig = function() {
-    var that = this;
-    return {
-        name: "javascripts.directions.engines.graphhopper_"+this.vehicleName.toLowerCase(),
-            creditline: '<a href="http://graphhopper.com/" target="_blank">Graphhopper</a>',
-        draggable: false,
-        _hints: {},
-        getRoute: function(isFinal, points) {
-            // documentation
-            // https://github.com/graphhopper/graphhopper/blob/master/docs/web/api-doc.md
-            var url = "http://graphhopper.com/api/1/route?" 
-                    + that.vehicleParam
-                    + "&locale=" + I18n.currentLocale()
-                    + "&key=LijBPDQGfu7Iiq80w3HzwB4RUDJbMbhs6BU0dEnn";
-            
-            for (var i = 0; i < points.length; i++) {
-                var pair = points[i].join(',');
-                url += "&point=" + pair;
-            }            
-            if (isFinal)
-                url += "&instructions=true";
-            // GraphHopper supports json too
-            this.requestJSONP(url + "&type=jsonp&callback=");
-        },
-        gotRoute: function(router, data) {
-            if (!data.paths || data.paths.length == 0)
-                return false;
-            
-            // Draw polyline
-            var path = data.paths[0];
-            var line = L.PolylineUtil.decode(path.points);
-            router.setPolyline(line);
-            // Assemble instructions
-            var steps = [];
-            var len = path.instructions.length;
-            for (i = 0; i < len; i++) {
-                var instr = path.instructions[i];                
-                var instrCode = (i === len - 1) ? 15 : this.GH_INSTR_MAP[instr.sign];
-                var instrText = "<b>" + (i + 1) + ".</b> ";
-                instrText += instr.text;
-                var latLng = line[instr.interval[0]];                
-                var distInMeter = instr.distance;
-                steps.push([{lat: latLng.lat, lng: latLng.lng}, instrCode, instrText, distInMeter, []]); // TODO does graphhopper map instructions onto line indices?
-            }
-            router.setItinerary({ steps: steps, distance: path.distance, time: path.time / 1000 });
-            return true;
-        },
-        GH_INSTR_MAP: {
-            "-3": 6, // sharp left
-            "-2": 7, // left	
-            "-1": 8, // slight left                
-            0: 0, // straight
-            1: 1, // slight right
-            2: 2, // right
-            3: 3, // sharp right
-            4: -1, // finish reached
-            5: -1 // via reached
-        }
-    };
+GraphHopperEngine.prototype.createConfig = function () {
+  var that = this;
+  return {
+    name: "javascripts.directions.engines.graphhopper_" + this.vehicleName.toLowerCase(),
+    creditline: '<a href="http://graphhopper.com/" target="_blank">Graphhopper</a>',
+    draggable: false,
+    _hints: {},
+
+    getRoute: function (isFinal, points) {
+      // documentation
+      // https://github.com/graphhopper/graphhopper/blob/master/docs/web/api-doc.md
+      var url = "http://graphhopper.com/api/1/route?"
+        + that.vehicleParam
+        + "&locale=" + I18n.currentLocale()
+        + "&key=LijBPDQGfu7Iiq80w3HzwB4RUDJbMbhs6BU0dEnn";
+
+      for (var i = 0; i < points.length; i++) {
+        var pair = points[i].join(',');
+        url += "&point=" + pair;
+      }
+      if (isFinal)
+        url += "&instructions=true";
+      // GraphHopper supports json too
+      this.requestJSONP(url + "&type=jsonp&callback=");
+    },
+
+    gotRoute: function (router, data) {
+      if (!data.paths || data.paths.length == 0)
+        return false;
+
+      // Draw polyline
+      var path = data.paths[0];
+      var line = L.PolylineUtil.decode(path.points);
+      router.setPolyline(line);
+      // Assemble instructions
+      var steps = [];
+      var len = path.instructions.length;
+      for (i = 0; i < len; i++) {
+        var instr = path.instructions[i];
+        var instrCode = (i === len - 1) ? 15 : this.GH_INSTR_MAP[instr.sign];
+        var instrText = "<b>" + (i + 1) + ".</b> ";
+        instrText += instr.text;
+        var latLng = line[instr.interval[0]];
+        var distInMeter = instr.distance;
+        steps.push([
+          {lat: latLng.lat, lng: latLng.lng},
+          instrCode,
+          instrText,
+          distInMeter,
+          []
+        ]); // TODO does graphhopper map instructions onto line indices?
+      }
+      router.setItinerary({ steps: steps, distance: path.distance, time: path.time / 1000 });
+      return true;
+    },
+
+    GH_INSTR_MAP: {
+      "-3": 6, // sharp left
+      "-2": 7, // left
+      "-1": 8, // slight left
+      0: 0, // straight
+      1: 1, // slight right
+      2: 2, // right
+      3: 3, // sharp right
+      4: -1, // finish reached
+      5: -1 // via reached
+    }
+  };
 };
 
 OSM.RoutingEngines.add(false, new GraphHopperEngine("Bicycle", "vehicle=bike").createConfig());
diff --git a/app/assets/javascripts/routing_engines/mapquest.js b/app/assets/javascripts/routing_engines/mapquest.js
index 39e47706a..67fc534b7 100644
--- a/app/assets/javascripts/routing_engines/mapquest.js
+++ b/app/assets/javascripts/routing_engines/mapquest.js
@@ -3,89 +3,93 @@
 // http://open.mapquestapi.com/directions/
 // https://github.com/apmon/openstreetmap-website/blob/21edc353a4558006f0ce23f5ec3930be6a7d4c8b/app/controllers/routing_controller.rb#L153
 
-MapQuestEngine = function(vehicleName, vehicleParam, locale) {
-    this.vehicleName = vehicleName;
-    this.vehicleParam = vehicleParam;
-    this.locale = locale;
-    if (!locale)
-        this.locale = "en";
+MapQuestEngine = function (vehicleName, vehicleParam, locale) {
+  this.vehicleName = vehicleName;
+  this.vehicleParam = vehicleParam;
+  this.locale = locale;
+  if (!locale)
+    this.locale = "en";
 };
 
-MapQuestEngine.prototype.createConfig = function() {
-    var that = this;
-    return {
-        name: "javascripts.directions.engines.mapquest_"+this.vehicleName.toLowerCase(),
-        creditline: '<a href="http://www.mapquest.com/" target="_blank">MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png">',
-        draggable: false,
-        _hints: {},
-        MQ_SPRITE_MAP: {
-            0: 1, // straight
-            1: 2, // slight right
-            2: 3, // right
-            3: 4, // sharp right
-            4: 5, // reverse
-            5: 6, // sharp left
-            6: 7, // left
-            7: 8, // slight left
-            8: 5, // right U-turn
-            9: 5, // left U-turn
-            10: 2, // right merge
-            11: 8, // left merge
-            12: 2, // right on-ramp
-            13: 8, // left on-ramp
-            14: 2, // right off-ramp
-            15: 8, // left off-ramp
-            16: 2, // right fork
-            17: 8, // left fork
-            18: 1  // straight fork
-        },
-        getRoute: function(isFinal,points) {
-            var url=document.location.protocol+"//open.mapquestapi.com/directions/v2/route?key=Fmjtd%7Cluur290anu%2Crl%3Do5-908a0y";
-            var from=points[0]; var to=points[points.length-1];
-            url+="&from="+from.join(',');
-            url+="&to="+to.join(',');
-            url+="&"+that.vehicleParam;
-            //url+="&locale=" + I18n.currentLocale(); //Doesn't actually work. MapQuest requires full locale e.g. "de_DE", but I18n may only provides language, e.g. "de"
-            url+="&manMaps=false";
-            url+="&shapeFormat=raw&generalize=0&unit=k";
-            this.requestCORS(url);
-        },
-        gotRoute: function(router,data) {
-            if (data.info.statuscode!=0) return false;
-        
-            var poly=[];
-            var shape=data.route.shape.shapePoints;
-            for (var i=0; i<shape.length; i+=2) {
-                poly.push(L.latLng(shape[i],shape[i+1]));
-            }
-            router.setPolyline(poly);
+MapQuestEngine.prototype.createConfig = function () {
+  var that = this;
+  return {
+    name: "javascripts.directions.engines.mapquest_" + this.vehicleName.toLowerCase(),
+    creditline: '<a href="http://www.mapquest.com/" target="_blank">MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png">',
+    draggable: false,
+    _hints: {},
 
-            // data.route.shape.maneuverIndexes links turns to polyline positions
-            // data.route.legs[0].maneuvers is list of turns
-            var steps=[];
-            var mq=data.route.legs[0].maneuvers;
-            for (var i=0; i<mq.length; i++) {
-                var s=mq[i];
-                var d;
-                var linesegstart, linesegend, lineseg;
-                linesegstart = data.route.shape.maneuverIndexes[i];
-                if (i==mq.length-1) {
-                    d = 15;
-                    linesegend = linesegstart + 1;
-                } else {
-                    d = this.MQ_SPRITE_MAP[s.turnType];
-                    linesegend = data.route.shape.maneuverIndexes[i+1] + 1;
-                }
-                lineseg = [];
-                for (var j=linesegstart; j<linesegend; j++) {
-                    lineseg.push(L.latLng(data.route.shape.shapePoints[j*2], data.route.shape.shapePoints[j*2+1]));
-                }
-                steps.push([L.latLng(s.startPoint.lat, s.startPoint.lng), d, s.narrative, s.distance*1000, lineseg]);
-            }
-            router.setItinerary( { steps: steps, distance: data.route.distance*1000, time: data.route['time'] });
-            return true;
+    MQ_SPRITE_MAP: {
+      0: 1, // straight
+      1: 2, // slight right
+      2: 3, // right
+      3: 4, // sharp right
+      4: 5, // reverse
+      5: 6, // sharp left
+      6: 7, // left
+      7: 8, // slight left
+      8: 5, // right U-turn
+      9: 5, // left U-turn
+      10: 2, // right merge
+      11: 8, // left merge
+      12: 2, // right on-ramp
+      13: 8, // left on-ramp
+      14: 2, // right off-ramp
+      15: 8, // left off-ramp
+      16: 2, // right fork
+      17: 8, // left fork
+      18: 1  // straight fork
+    },
+
+    getRoute: function (isFinal, points) {
+      var url = document.location.protocol + "//open.mapquestapi.com/directions/v2/route?key=Fmjtd%7Cluur290anu%2Crl%3Do5-908a0y";
+      var from = points[0];
+      var to = points[points.length - 1];
+      url += "&from=" + from.join(',');
+      url += "&to=" + to.join(',');
+      url += "&" + that.vehicleParam;
+      //url+="&locale=" + I18n.currentLocale(); //Doesn't actually work. MapQuest requires full locale e.g. "de_DE", but I18n may only provides language, e.g. "de"
+      url += "&manMaps=false";
+      url += "&shapeFormat=raw&generalize=0&unit=k";
+      this.requestCORS(url);
+    },
+
+    gotRoute: function (router, data) {
+      if (data.info.statuscode != 0) return false;
+
+      var poly = [];
+      var shape = data.route.shape.shapePoints;
+      for (var i = 0; i < shape.length; i += 2) {
+        poly.push(L.latLng(shape[i], shape[i + 1]));
+      }
+      router.setPolyline(poly);
+
+      // data.route.shape.maneuverIndexes links turns to polyline positions
+      // data.route.legs[0].maneuvers is list of turns
+      var steps = [];
+      var mq = data.route.legs[0].maneuvers;
+      for (var i = 0; i < mq.length; i++) {
+        var s = mq[i];
+        var d;
+        var linesegstart, linesegend, lineseg;
+        linesegstart = data.route.shape.maneuverIndexes[i];
+        if (i == mq.length - 1) {
+          d = 15;
+          linesegend = linesegstart + 1;
+        } else {
+          d = this.MQ_SPRITE_MAP[s.turnType];
+          linesegend = data.route.shape.maneuverIndexes[i + 1] + 1;
         }
-    };
+        lineseg = [];
+        for (var j = linesegstart; j < linesegend; j++) {
+          lineseg.push(L.latLng(data.route.shape.shapePoints[j * 2], data.route.shape.shapePoints[j * 2 + 1]));
+        }
+        steps.push([L.latLng(s.startPoint.lat, s.startPoint.lng), d, s.narrative, s.distance * 1000, lineseg]);
+      }
+      router.setItinerary({ steps: steps, distance: data.route.distance * 1000, time: data.route['time'] });
+      return true;
+    }
+  };
 };
 
 OSM.RoutingEngines.add(true, new MapQuestEngine("Bicycle", "routeType=bicycle").createConfig());
diff --git a/app/assets/javascripts/routing_engines/osrm.js b/app/assets/javascripts/routing_engines/osrm.js
index b40d5b306..6a197bb98 100644
--- a/app/assets/javascripts/routing_engines/osrm.js
+++ b/app/assets/javascripts/routing_engines/osrm.js
@@ -1,60 +1,69 @@
 // OSRM car engine
 // Doesn't yet support hints
 
-OSRMEngine = function(vehicleName, baseURL, locale) {
-    this.vehicleName = vehicleName;
-    this.baseURL = baseURL;
-    this.locale = locale;
-    if (!locale)
-        this.locale = "en";
+OSRMEngine = function (vehicleName, baseURL, locale) {
+  this.vehicleName = vehicleName;
+  this.baseURL = baseURL;
+  this.locale = locale;
+  if (!locale)
+    this.locale = "en";
 };
 
-OSRMEngine.prototype.createConfig = function() {
-    var that = this;
-    return {
-        name: "javascripts.directions.engines.osrm_"+this.vehicleName.toLowerCase(),
-            creditline: '<a href="http://project-osrm.org/" target="_blank">OSRM</a>',
-        draggable: true,
-        _hints: {},
-        getRoute: function(isFinal,points) {
-            var url=that.baseURL+"?z=14&output=json";
-            for (var i=0; i<points.length; i++) {
-                var pair=points[i].join(',');
-                url+="&loc="+pair;
-                if (this._hints[pair]) url+= "&hint="+this._hints[pair];
-            }
-            if (isFinal) url+="&instructions=true";
-            this.requestCORS(url);
-        },
-        gotRoute: function(router,data) {
-            if (data.status==207) {
-                return false;
-            }
-            // Draw polyline
-            var line=L.PolylineUtil.decode(data.route_geometry);
-            for (i=0; i<line.length; i++) { line[i].lat/=10; line[i].lng/=10; }
-            router.setPolyline(line);
-            // Assemble instructions
-            var steps=[];
-            for (i=0; i<data.route_instructions.length; i++) {
-                var s=data.route_instructions[i];
-                var linesegend;
-                var instCodes=s[0].split('-');
-                var instText="<b>"+(i+1)+".</b> ";
-                instText+=TURN_INSTRUCTIONS[instCodes[0]];
-                if (instCodes[1]) { instText+="exit "+instCodes[1]+" "; }
-                if (instCodes[0]!=15) { instText+=s[1] ? "<b>"+s[1]+"</b>" : I18n.t('javascripts.directions.instructions.unnamed'); }
-                if ((i+1)<data.route_instructions.length) {
-                    linesegend = data.route_instructions[i+1][3] + 1;
-                } else {
-                    linesegend = s[3] + 1;
-                }
-                steps.push([line[s[3]], s[0].split('-')[0], instText, s[2], line.slice(s[3], linesegend)]);
-            }
-            if (steps.length) router.setItinerary({ steps: steps, distance: data.route_summary.total_distance, time: data.route_summary.total_time });
-            return true;
+OSRMEngine.prototype.createConfig = function () {
+  var that = this;
+  return {
+    name: "javascripts.directions.engines.osrm_" + this.vehicleName.toLowerCase(),
+    creditline: '<a href="http://project-osrm.org/" target="_blank">OSRM</a>',
+    draggable: true,
+    _hints: {},
+
+    getRoute: function (isFinal, points) {
+      var url = that.baseURL + "?z=14&output=json";
+      for (var i = 0; i < points.length; i++) {
+        var pair = points[i].join(',');
+        url += "&loc=" + pair;
+        if (this._hints[pair]) url += "&hint=" + this._hints[pair];
+      }
+      if (isFinal) url += "&instructions=true";
+      this.requestCORS(url);
+    },
+
+    gotRoute: function (router, data) {
+      if (data.status == 207) {
+        return false;
+      }
+      // Draw polyline
+      var line = L.PolylineUtil.decode(data.route_geometry);
+      for (i = 0; i < line.length; i++) {
+        line[i].lat /= 10;
+        line[i].lng /= 10;
+      }
+      router.setPolyline(line);
+      // Assemble instructions
+      var steps = [];
+      for (i = 0; i < data.route_instructions.length; i++) {
+        var s = data.route_instructions[i];
+        var linesegend;
+        var instCodes = s[0].split('-');
+        var instText = "<b>" + (i + 1) + ".</b> ";
+        instText += TURN_INSTRUCTIONS[instCodes[0]];
+        if (instCodes[1]) {
+          instText += "exit " + instCodes[1] + " ";
         }
-    };
+        if (instCodes[0] != 15) {
+          instText += s[1] ? "<b>" + s[1] + "</b>" : I18n.t('javascripts.directions.instructions.unnamed');
+        }
+        if ((i + 1) < data.route_instructions.length) {
+          linesegend = data.route_instructions[i + 1][3] + 1;
+        } else {
+          linesegend = s[3] + 1;
+        }
+        steps.push([line[s[3]], s[0].split('-')[0], instText, s[2], line.slice(s[3], linesegend)]);
+      }
+      if (steps.length) router.setItinerary({ steps: steps, distance: data.route_summary.total_distance, time: data.route_summary.total_time });
+      return true;
+    }
+  };
 };
 
 OSM.RoutingEngines.add(false, new OSRMEngine("Car", "http://router.project-osrm.org/viaroute").createConfig());

From be79156f43975a90399bb2629684bea6c580f238 Mon Sep 17 00:00:00 2001
From: John Firebaugh <john.firebaugh@gmail.com>
Date: Mon, 12 May 2014 12:34:34 -0700
Subject: [PATCH 57/88] OSM.Routing -> OSM.Directions

Too close of a name collision to OSM.Router.
---
 app/assets/javascripts/index.js                   | 15 +++++++--------
 .../{routing.js.erb => index/directions.js.erb}   | 11 +++++------
 .../directions_engines}/graphhopper.js            |  4 ++--
 .../directions_engines}/mapquest.js               |  6 +++---
 .../directions_engines}/osrm.js                   |  2 +-
 app/views/layouts/_search.html.erb                |  6 +++---
 6 files changed, 21 insertions(+), 23 deletions(-)
 rename app/assets/javascripts/{routing.js.erb => index/directions.js.erb} (98%)
 rename app/assets/javascripts/{routing_engines => index/directions_engines}/graphhopper.js (92%)
 rename app/assets/javascripts/{routing_engines => index/directions_engines}/mapquest.js (92%)
 rename app/assets/javascripts/{routing_engines => index/directions_engines}/osrm.js (95%)

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index 52b8b4c23..66e0e0642 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -13,9 +13,8 @@
 //= require index/history
 //= require index/note
 //= require index/new_note
+//= require index/directions
 //= require router
-//= require routing
-//= require_tree ./routing_engines
 
 (function() {
   var loaderTimeout;
@@ -326,8 +325,8 @@ $(document).ready(function () {
   $(".search_form").on("submit", function(e) {
     e.preventDefault();
     if ($(".query_wrapper.routing").is(":visible")) {
-      // Routing
-      OSM.routing.requestRoute(true, true);
+      // Directions
+      OSM.directions.requestRoute(true, true);
     } else {
       // Search
       $("header").addClass("closed");
@@ -348,8 +347,8 @@ $(document).ready(function () {
       map.getCenter().lng.toFixed(precision)));
   });
 
-  OSM.routing = OSM.Routing(map,'OSM.routing',$('.query_wrapper.routing'));
-  OSM.routing.chooseEngine('javascripts.directions.engines.osrm_car');
+  OSM.directions = OSM.Directions(map, 'OSM.directions', $('.query_wrapper.routing'));
+  OSM.directions.chooseEngine('javascripts.directions.engines.osrm_car');
 
   $(".get_directions").on("click",function(e) {
     e.preventDefault();
@@ -358,7 +357,7 @@ $(document).ready(function () {
     $(".search_form input[type='submit']").addClass("routing_submit");
     $(".query_wrapper.routing [name=route_from]").focus();
     $("#map").on('dragend dragover',function(e) { e.preventDefault(); });
-    $("#map").on('drop',function(e) { OSM.routing.handleDrop(e); e.preventDefault(); });
+    $("#map").on('drop',function(e) { OSM.directions.handleDrop(e); e.preventDefault(); });
     $(".routing_marker").on('dragstart',function(e) {
       e.originalEvent.dataTransfer.effectAllowed = 'move';
       e.originalEvent.dataTransfer.setData('id', this.id);
@@ -374,7 +373,7 @@ $(document).ready(function () {
     $(".search").show();
     $(".routing").hide();
     $(".search_form input[type='submit']").removeClass("routing_submit");
-    OSM.routing.close();
+    OSM.directions.close();
     $("#map").off('dragend drop dragover');
     $(".routing_marker").off('dragstart');
     $(".query_wrapper.search [name=query]").focus();
diff --git a/app/assets/javascripts/routing.js.erb b/app/assets/javascripts/index/directions.js.erb
similarity index 98%
rename from app/assets/javascripts/routing.js.erb
rename to app/assets/javascripts/index/directions.js.erb
index fc2bb8d30..fb16c7915 100644
--- a/app/assets/javascripts/routing.js.erb
+++ b/app/assets/javascripts/index/directions.js.erb
@@ -1,6 +1,5 @@
-/*
- osm.org routing interface
-*/
+//= require_self
+//= require_tree ./directions_engines
 
 var TURN_INSTRUCTIONS = [];
 
@@ -16,14 +15,14 @@ var ROUTING_POLYLINE_HIGHLIGHT = {
   weight: 12
 };
 
-OSM.RoutingEngines = {
+OSM.DirectionsEngines = {
   list: [],
   add: function (supportsHTTPS, engine) {
     if (document.location.protocol == "http:" || supportsHTTPS) this.list.push(engine);
   }
 };
 
-OSM.Routing = function (map, name, jqSearch) {
+OSM.Directions = function (map, name, jqSearch) {
   var r = {};
 
   TURN_INSTRUCTIONS = [
@@ -298,7 +297,7 @@ OSM.Routing = function (map, name, jqSearch) {
   // Routing engine handling
 
   // Add all engines
-  var list = OSM.RoutingEngines.list;
+  var list = OSM.DirectionsEngines.list;
   list.sort(function (a, b) {
     return I18n.t(a.name) > I18n.t(b.name);
   });
diff --git a/app/assets/javascripts/routing_engines/graphhopper.js b/app/assets/javascripts/index/directions_engines/graphhopper.js
similarity index 92%
rename from app/assets/javascripts/routing_engines/graphhopper.js
rename to app/assets/javascripts/index/directions_engines/graphhopper.js
index a0e877e4b..9f9c549b5 100644
--- a/app/assets/javascripts/routing_engines/graphhopper.js
+++ b/app/assets/javascripts/index/directions_engines/graphhopper.js
@@ -77,5 +77,5 @@ GraphHopperEngine.prototype.createConfig = function () {
   };
 };
 
-OSM.RoutingEngines.add(false, new GraphHopperEngine("Bicycle", "vehicle=bike").createConfig());
-OSM.RoutingEngines.add(false, new GraphHopperEngine("Foot", "vehicle=foot").createConfig());
+OSM.DirectionsEngines.add(false, new GraphHopperEngine("Bicycle", "vehicle=bike").createConfig());
+OSM.DirectionsEngines.add(false, new GraphHopperEngine("Foot", "vehicle=foot").createConfig());
diff --git a/app/assets/javascripts/routing_engines/mapquest.js b/app/assets/javascripts/index/directions_engines/mapquest.js
similarity index 92%
rename from app/assets/javascripts/routing_engines/mapquest.js
rename to app/assets/javascripts/index/directions_engines/mapquest.js
index 67fc534b7..f24d8fab6 100644
--- a/app/assets/javascripts/routing_engines/mapquest.js
+++ b/app/assets/javascripts/index/directions_engines/mapquest.js
@@ -92,7 +92,7 @@ MapQuestEngine.prototype.createConfig = function () {
   };
 };
 
-OSM.RoutingEngines.add(true, new MapQuestEngine("Bicycle", "routeType=bicycle").createConfig());
-OSM.RoutingEngines.add(true, new MapQuestEngine("Foot", "routeType=pedestrian").createConfig());
-OSM.RoutingEngines.add(true, new MapQuestEngine("Car", "routeType=fastest").createConfig());
+OSM.DirectionsEngines.add(true, new MapQuestEngine("Bicycle", "routeType=bicycle").createConfig());
+OSM.DirectionsEngines.add(true, new MapQuestEngine("Foot", "routeType=pedestrian").createConfig());
+OSM.DirectionsEngines.add(true, new MapQuestEngine("Car", "routeType=fastest").createConfig());
 // can be: routeType=fastest|shortest|pedestrian|multimodal|bicycle
diff --git a/app/assets/javascripts/routing_engines/osrm.js b/app/assets/javascripts/index/directions_engines/osrm.js
similarity index 95%
rename from app/assets/javascripts/routing_engines/osrm.js
rename to app/assets/javascripts/index/directions_engines/osrm.js
index 6a197bb98..ac78699f9 100644
--- a/app/assets/javascripts/routing_engines/osrm.js
+++ b/app/assets/javascripts/index/directions_engines/osrm.js
@@ -66,4 +66,4 @@ OSRMEngine.prototype.createConfig = function () {
   };
 };
 
-OSM.RoutingEngines.add(false, new OSRMEngine("Car", "http://router.project-osrm.org/viaroute").createConfig());
+OSM.DirectionsEngines.add(false, new OSRMEngine("Car", "http://router.project-osrm.org/viaroute").createConfig());
diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index 9ac3eae33..8d216ee80 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -18,10 +18,10 @@
 
   <div class='query_wrapper routing'>
     <%= image_tag "marker-green.png", :class => 'routing_marker', :id => 'marker_from', :draggable => 'true' %>
-    <%= text_field_tag "route_from", params[:from], :placeholder => t('site.search.from'), :onchange=>"OSM.routing.geocode('route_from',event)" %>
+    <%= text_field_tag "route_from", params[:from], :placeholder => t('site.search.from'), :onchange=>"OSM.directions.geocode('route_from',event)" %>
     <%= image_tag "marker-red.png"  , :class => 'routing_marker', :id => 'marker_to'  , :draggable => 'true' %>
-    <%= text_field_tag "route_to"  , params[:to]  , :placeholder => t('site.search.to')  , :onchange=>"OSM.routing.geocode('route_to'  ,event)" %>
-    <select class='routing_engines' name='routing_engines' onchange="OSM.routing.selectEngine(event)"></select>
+    <%= text_field_tag "route_to"  , params[:to]  , :placeholder => t('site.search.to')  , :onchange=>"OSM.directions.geocode('route_to'  ,event)" %>
+    <select class='routing_engines' name='routing_engines' onchange="OSM.directions.selectEngine(event)"></select>
     <%= image_tag "searching-small.gif", :class => 'spinner', :style => "vertical-align: middle; display: none;" %>
   </div>
 

From 18c7c4f5d7995a56bf76bf81b86ff607bd27ef21 Mon Sep 17 00:00:00 2001
From: John Firebaugh <john.firebaugh@gmail.com>
Date: Mon, 12 May 2014 12:47:36 -0700
Subject: [PATCH 58/88] Use unobtrusive JS for routing related events

---
 app/assets/javascripts/index/directions.js.erb | 12 ++++++++++++
 app/views/layouts/_search.html.erb             |  6 +++---
 2 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/index/directions.js.erb b/app/assets/javascripts/index/directions.js.erb
index fb16c7915..254bfa2b8 100644
--- a/app/assets/javascripts/index/directions.js.erb
+++ b/app/assets/javascripts/index/directions.js.erb
@@ -352,5 +352,17 @@ OSM.Directions = function (map, name, jqSearch) {
     }
   };
 
+  $("input[name='route_from']").on("change", function (e) {
+    r.geocode('route_from', e);
+  });
+
+  $("input[name='route_to']").on("change", function (e) {
+    r.geocode('route_to', e);
+  });
+
+  $("select[name='routing_engines']").on("change", function (e) {
+    r.selectEngine(e);
+  });
+
   return r;
 };
diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index 8d216ee80..43613352e 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -18,10 +18,10 @@
 
   <div class='query_wrapper routing'>
     <%= image_tag "marker-green.png", :class => 'routing_marker', :id => 'marker_from', :draggable => 'true' %>
-    <%= text_field_tag "route_from", params[:from], :placeholder => t('site.search.from'), :onchange=>"OSM.directions.geocode('route_from',event)" %>
+    <%= text_field_tag "route_from", params[:from], :placeholder => t('site.search.from') %>
     <%= image_tag "marker-red.png"  , :class => 'routing_marker', :id => 'marker_to'  , :draggable => 'true' %>
-    <%= text_field_tag "route_to"  , params[:to]  , :placeholder => t('site.search.to')  , :onchange=>"OSM.directions.geocode('route_to'  ,event)" %>
-    <select class='routing_engines' name='routing_engines' onchange="OSM.directions.selectEngine(event)"></select>
+    <%= text_field_tag "route_to"  , params[:to]  , :placeholder => t('site.search.to') %>
+    <select class='routing_engines' name='routing_engines'></select>
     <%= image_tag "searching-small.gif", :class => 'spinner', :style => "vertical-align: middle; display: none;" %>
   </div>
 

From 2b252e8337109de714bb8aa38ccf6d46e7686e42 Mon Sep 17 00:00:00 2001
From: John Firebaugh <john.firebaugh@gmail.com>
Date: Mon, 12 May 2014 16:09:29 -0700
Subject: [PATCH 59/88] Refactor

---
 app/assets/javascripts/index.js               |  36 +-
 .../javascripts/index/directions.js.erb       | 580 ++++++++----------
 .../index/directions_engines/graphhopper.js   | 117 ++--
 .../index/directions_engines/mapquest.js      | 146 +++--
 .../index/directions_engines/osrm.js          | 128 ++--
 5 files changed, 456 insertions(+), 551 deletions(-)

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index 66e0e0642..3d063189f 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -281,6 +281,7 @@ $(document).ready(function () {
     return page;
   };
 
+  var directions = OSM.Directions(map);
   var history = OSM.History(map);
 
   OSM.router = OSM.Router(map, {
@@ -326,7 +327,7 @@ $(document).ready(function () {
     e.preventDefault();
     if ($(".query_wrapper.routing").is(":visible")) {
       // Directions
-      OSM.directions.requestRoute(true, true);
+      directions.requestRoute(true, true);
     } else {
       // Search
       $("header").addClass("closed");
@@ -346,37 +347,4 @@ $(document).ready(function () {
       map.getCenter().lat.toFixed(precision) + "," +
       map.getCenter().lng.toFixed(precision)));
   });
-
-  OSM.directions = OSM.Directions(map, 'OSM.directions', $('.query_wrapper.routing'));
-  OSM.directions.chooseEngine('javascripts.directions.engines.osrm_car');
-
-  $(".get_directions").on("click",function(e) {
-    e.preventDefault();
-    $(".search").hide();
-    $(".routing").show();
-    $(".search_form input[type='submit']").addClass("routing_submit");
-    $(".query_wrapper.routing [name=route_from]").focus();
-    $("#map").on('dragend dragover',function(e) { e.preventDefault(); });
-    $("#map").on('drop',function(e) { OSM.directions.handleDrop(e); e.preventDefault(); });
-    $(".routing_marker").on('dragstart',function(e) {
-      e.originalEvent.dataTransfer.effectAllowed = 'move';
-      e.originalEvent.dataTransfer.setData('id', this.id);
-      var xo=e.originalEvent.clientX - $(e.target).offset().left;
-      var yo=e.originalEvent.clientY - $(e.target).offset().top;
-      e.originalEvent.dataTransfer.setData('offsetX', e.originalEvent.target.width/2 - xo);
-      e.originalEvent.dataTransfer.setData('offsetY', e.originalEvent.target.height  - yo);
-    });
-  });
-
-  $(".close_directions").on("click",function(e) {
-    e.preventDefault();
-    $(".search").show();
-    $(".routing").hide();
-    $(".search_form input[type='submit']").removeClass("routing_submit");
-    OSM.directions.close();
-    $("#map").off('dragend drop dragover');
-    $(".routing_marker").off('dragstart');
-    $(".query_wrapper.search [name=query]").focus();
-  });
-
 });
diff --git a/app/assets/javascripts/index/directions.js.erb b/app/assets/javascripts/index/directions.js.erb
index 254bfa2b8..9c9df6515 100644
--- a/app/assets/javascripts/index/directions.js.erb
+++ b/app/assets/javascripts/index/directions.js.erb
@@ -1,368 +1,296 @@
 //= require_self
 //= require_tree ./directions_engines
 
-var TURN_INSTRUCTIONS = [];
+OSM.Directions = function (map) {
+  var awaitingGeocode; // true if the user has requested a route, but we're waiting on a geocode result
+  var awaitingRoute;   // true if we've asked the engine for a route and are waiting to hear back
+  var dragging;        // true if the user is dragging a start/end point
+  var chosenEngine;
 
-var ROUTING_POLYLINE = {
-  color: '#03f',
-  opacity: 0.3,
-  weight: 10
-};
+  var popup = L.popup();
 
-var ROUTING_POLYLINE_HIGHLIGHT = {
-  color: '#ff0',
-  opacity: 0.5,
-  weight: 12
-};
+  var polyline = L.polyline([], {
+    color: '#03f',
+    opacity: 0.3,
+    weight: 10
+  });
 
-OSM.DirectionsEngines = {
-  list: [],
-  add: function (supportsHTTPS, engine) {
-    if (document.location.protocol == "http:" || supportsHTTPS) this.list.push(engine);
-  }
-};
+  var highlight = L.polyline([], {
+    color: '#ff0',
+    opacity: 0.5,
+    weight: 12
+  });
 
-OSM.Directions = function (map, name, jqSearch) {
-  var r = {};
-
-  TURN_INSTRUCTIONS = [
-    "",
-    I18n.t('javascripts.directions.instructions.continue_on'),      // 1
-    I18n.t('javascripts.directions.instructions.slight_right'),     // 2
-    I18n.t('javascripts.directions.instructions.turn_right'),       // 3
-    I18n.t('javascripts.directions.instructions.sharp_right'),      // 4
-    I18n.t('javascripts.directions.instructions.uturn'),            // 5
-    I18n.t('javascripts.directions.instructions.sharp_left'),       // 6
-    I18n.t('javascripts.directions.instructions.turn_left'),        // 7
-    I18n.t('javascripts.directions.instructions.slight_left'),      // 8
-    I18n.t('javascripts.directions.instructions.via_point'),        // 9
-    I18n.t('javascripts.directions.instructions.follow'),           // 10
-    I18n.t('javascripts.directions.instructions.roundabout'),       // 11
-    I18n.t('javascripts.directions.instructions.leave_roundabout'), // 12
-    I18n.t('javascripts.directions.instructions.stay_roundabout'),  // 13
-    I18n.t('javascripts.directions.instructions.start'),            // 14
-    I18n.t('javascripts.directions.instructions.destination'),      // 15
-    I18n.t('javascripts.directions.instructions.against_oneway'),   // 16
-    I18n.t('javascripts.directions.instructions.end_oneway')        // 17
+  var endpoints = [
+    Endpoint($("input[name='route_from']"), <%= asset_path('marker-green.png').to_json %>),
+    Endpoint($("input[name='route_to']"),   <%= asset_path('marker-red.png').to_json %>)
   ];
 
-  r.map = map;              // Leaflet map
-  r.name = name;            // global variable name of this instance (needed for JSONP)
-  r.jqSearch = jqSearch;    // JQuery object for search panel
+  function Endpoint(input, iconUrl) {
+    var endpoint = {};
 
-  r.route_from = null;      // null=unset, false=awaiting response, [lat,lon]=geocoded
-  r.route_to = null;        //  |
-  r.awaitingGeocode = false;// true if the user has requested a route, but we're waiting on a geocode result
-  r.awaitingRoute = false;  // true if we've asked the engine for a route and are waiting to hear back
-  r.dragging = false;       // true if the user is dragging a start/end point
-  r.viaPoints = [];         // not yet used
-
-  r.polyline = null;        // Leaflet polyline object
-  r.popup = null;           // Leaflet popup object
-  r.marker_from = null;     // Leaflet from marker
-  r.marker_to = null;       // Leaflet to marker
-
-  r.chosenEngine = null;    // currently selected routing engine
-
-  var icon_from = L.icon({
-    iconUrl: <%= asset_path('marker-green.png').to_json %>,
-    iconSize: [25, 41],
-    iconAnchor: [12, 41],
-    popupAnchor: [1, -34],
-    shadowUrl: <%= asset_path('images/marker-shadow.png').to_json %>,
-    shadowSize: [41, 41]
-  });
-
-  var icon_to = L.icon({
-    iconUrl: <%= asset_path('marker-red.png').to_json %>,
-    iconSize: [25, 41],
-    iconAnchor: [12, 41],
-    popupAnchor: [1, -34],
-    shadowUrl: <%= asset_path('images/marker-shadow.png').to_json %>,
-    shadowSize: [41, 41]
-  });
-
-  // Geocoding
-
-  r.geocode = function (id, event) {
-    var _this = this;
-    var field = event.target;
-    var v = event.target.value;
-    var querystring = '<%= NOMINATIM_URL %>search?q=' + encodeURIComponent(v) + '&format=json';
-    // *** &accept-language=<%#= request.user_preferred_languages.join(',') %>
-    r[field.id] = false;
-    $.getJSON(querystring, function (json) {
-      _this._gotGeocode(json, field);
+    endpoint.marker = L.marker([0, 0], {
+      icon: L.icon({
+        iconUrl: iconUrl,
+        iconSize: [25, 41],
+        iconAnchor: [12, 41],
+        popupAnchor: [1, -34],
+        shadowUrl: <%= asset_path('images/marker-shadow.png').to_json %>,
+        shadowSize: [41, 41]
+      }),
+      draggable: true
     });
-  };
 
-  r._gotGeocode = function (json, field) {
-    if (json.length == 0) {
-      alert(I18n.t('javascripts.directions.errors.no_place'));
-      r[field.id] = null;
-      return;
-    }
-    field.value = json[0].display_name;
-    var lat = Number(json[0].lat), lon = Number(json[0].lon);
-    r[field.id] = [lat, lon];
-    r.updateMarker(field.id);
-    if (r.awaitingGeocode) {
-      r.awaitingGeocode = false;
-      r.requestRoute(true, true);
-    }
-  };
+    endpoint.marker.on('drag dragend', function (e) {
+      dragging = (e.type == 'drag');
+      if (dragging && !chosenEngine.draggable) return;
+      if (dragging && awaitingRoute) return;
+      endpoint.setLatLng(e.target.getLatLng());
+      r.requestRoute(!dragging, false);
+    });
 
-  // Drag and drop markers
+    input.on("change", function (e) {
+      endpoint.awaitingGeocode = true;
 
-  r.handleDrop = function (e) {
-    var oe = e.originalEvent;
-    var id = oe.dataTransfer.getData('id');
-    var pt = L.DomEvent.getMousePosition(oe, map.getContainer());  // co-ordinates of the mouse pointer at present
-    pt.x += Number(oe.dataTransfer.getData('offsetX'));
-    pt.y += Number(oe.dataTransfer.getData('offsetY'));
-    var ll = map.containerPointToLatLng(pt);
-    r.createMarker(ll, id);
-    r.setNumericInput(ll, id);
-    r.requestRoute(true, false);
-    // update to/from field
-  };
+      $.getJSON('<%= NOMINATIM_URL %>search?q=' + encodeURIComponent(e.target.value) + '&format=json', function (json) {
+        endpoint.awaitingGeocode = false;
 
-  r.createMarker = function (latlng, id) {
-    if (r[id]) r.map.removeLayer(r[id]);
-    r[id] = L.marker(latlng, {
-      icon: id == 'marker_from' ? icon_from : icon_to,
-      draggable: true,
-      name: id
-    }).addTo(r.map);
-    r[id].on('drag', r.markerDragged);
-    r[id].on('dragend', r.markerDragged);
-  };
+        if (json.length == 0) {
+          alert(I18n.t('javascripts.directions.errors.no_place'));
+          return;
+        }
 
-  // Update marker from geocoded route input
-  r.updateMarker = function (id) {
-    var m = id.replace('route', 'marker');
-    if (!r[m]) {
-      r.createMarker(r[id], m);
-      return;
-    }
-    var ll = r[m].getLatLng();
-    if (ll.lat != r[id][0] || ll.lng != r[id][1]) {
-      r.createMarker(r[id], m);
-    }
-  };
+        input.val(json[0].display_name);
 
-  // Marker has been dragged
-  r.markerDragged = function (e) {
-    r.dragging = (e.type == 'drag');    // true for drag, false for dragend
-    if (r.dragging && !r.chosenEngine.draggable) return;
-    if (r.dragging && r.awaitingRoute) return;
-    r.setNumericInput(e.target.getLatLng(), e.target.options.name);
-    r.requestRoute(!r.dragging, false);
-  };
+        endpoint.latlng = L.latLng(json[0]);
+        endpoint.marker
+          .setLatLng(endpoint.latlng)
+          .addTo(map);
 
-  // Set a route input field to a numeric value
-  r.setNumericInput = function (ll, id) {
-    var routeid = id.replace('marker', 'route');
-    r[routeid] = [ll.lat, ll.lng];
-    $("[name=" + routeid + "]:visible").val(Math.round(ll.lat * 10000) / 10000 + " " + Math.round(ll.lng * 10000) / 10000);
-  };
+        if (awaitingGeocode) {
+          awaitingGeocode = false;
+          r.requestRoute(true, true);
+        }
+      });
+    });
 
-  // Route-fetching UI
+    endpoint.setLatLng = function (ll) {
+      input.val(Math.round(ll.lat * 10000) / 10000 + " " + Math.round(ll.lng * 10000) / 10000);
+      endpoint.latlng = ll;
+      endpoint.marker
+        .setLatLng(ll)
+        .addTo(map);
+    };
 
-  r.requestRoute = function (isFinal, updateZoom) {
-    if (r.route_from && r.route_to) {
-      $(".query_wrapper.routing .spinner").show();
-      r.awaitingRoute = true;
-      r.chosenEngine.getRoute(isFinal, [r.route_from, r.route_to]);
-      if (updateZoom) {
-        r.map.fitBounds(L.latLngBounds([r.route_from, r.route_to]).pad(0.05));
-      }
-      // then, when the route has been fetched, it'll call the engine's gotRoute function
-    } else if (r.route_from == false || r.route_to == false) {
-      // we're waiting for a Nominatim response before we can request a route
-      r.awaitingGeocode = true;
-    }
-  };
+    return endpoint;
+  }
 
-  // Take an array of Leaflet LatLngs and draw it as a polyline
-  r.setPolyline = function (line) {
-    if (r.polyline) map.removeLayer(r.polyline);
-    r.polyline = L.polyline(line, ROUTING_POLYLINE).addTo(r.map);
-  };
-
-  // Take directions and write them out
-  // data = { steps: array of [latlng, sprite number, instruction text, distance in metres, highlightPolyline] }
-  // sprite numbers equate to OSRM's route_instructions turn values
-  r.setItinerary = function (data) {
-    // Create base table
-    $("#content").removeClass("overlay-sidebar");
-    $('#sidebar_content').empty();
-    var html = ('<h2><a class="geolink" href="#" onclick="$(~.close_directions~).click();return false;">' +
-      '<span class="icon close"></span></a>' + I18n.t('javascripts.directions.directions') +
-      '</h2><p id="routing_summary">' +
-      I18n.t('javascripts.directions.distance') + ': ' + r.formatDistance(data.distance) + '. ' +
-      I18n.t('javascripts.directions.time') + ': ' + r.formatTime(data.time) + '.</p>' +
-      '<table id="turnbyturn" />').replace(/~/g, "'");
-    $('#sidebar_content').html(html);
-    // Add each row
-    var cumulative = 0;
-    for (var i = 0; i < data.steps.length; i++) {
-      var step = data.steps[i];
-      // Distance
-      var dist = step[3];
-      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" + step[1] + "'> ");
-      row.append("<td class='instruction'>" + step[2]);
-      row.append("<td class='distance'>" + dist);
-      with ({ instruction: step[2], ll: step[0], lineseg: step[4] }) {
-        row.on('click', function (e) {
-          r.clickTurn(instruction, ll);
-        });
-        row.hover(function (e) {
-          r.highlightSegment(lineseg);
-        }, function (e) {
-          r.unhighlightSegment();
-        });
-      }
-      ;
-      $('#turnbyturn').append(row);
-      cumulative += step[3];
-    }
-    $('#sidebar_content').append('<p id="routing_credit">' + I18n.t('javascripts.directions.instructions.courtesy', {link: r.chosenEngine.creditline}) + '</p>');
-  };
-
-  r.clickTurn = function (instruction, latlng) {
-    r.popup = L.popup().setLatLng(latlng).setContent("<p>" + instruction + "</p>").openOn(r.map);
-  };
-
-  r.highlightSegment = function (lineseg) {
-    if (r.highlighted) map.removeLayer(r.highlighted);
-    r.highlighted = L.polyline(lineseg, ROUTING_POLYLINE_HIGHLIGHT).addTo(r.map);
-  };
-
-  r.unhighlightSegment = function () {
-    if (r.highlighted) map.removeLayer(r.highlighted);
-  };
-
-  r.formatDistance = function (m) {
+  function formatDistance(m) {
     if (m < 1000) {
       return Math.round(m) + "m";
-    }
-    else if (m < 10000) {
+    } else if (m < 10000) {
       return (m / 1000.0).toFixed(1) + "km";
-    }
-    else {
+    } else {
       return Math.round(m / 1000) + "km";
     }
-  };
+  }
 
-  r.formatTime = function (s) {
+  function formatTime(s) {
     var m = Math.round(s / 60);
     var h = Math.floor(m / 60);
     m -= h * 60;
     return h + ":" + (m < 10 ? '0' : '') + m;
-  };
-
-  // Close all routing UI
-
-  r.close = function () {
-    $("#content").addClass("overlay-sidebar");
-    r.route_from = r.route_to = null;
-    $(".query_wrapper.routing input").val("");
-    var remove = ['polyline', 'popup', 'marker_from', 'marker_to'];
-    for (var i = 0; i < remove.length; i++) {
-      if (r[remove[i]]) {
-        map.removeLayer(r[remove[i]]);
-        r[remove[i]] = null;
-      }
-    }
-  };
-
-  // Routing engine handling
-
-  // Add all engines
-  var list = OSM.DirectionsEngines.list;
-  list.sort(function (a, b) {
-    return I18n.t(a.name) > I18n.t(b.name);
-  });
-  var select = r.jqSearch.find('select.routing_engines');
-  for (var i = 0; i < list.length; i++) {
-    // Set up JSONP callback
-    with ({num: i}) {
-      list[num].requestJSONP = function (url) {
-        var script = document.createElement('script');
-        script.src = url + r.name + ".gotRoute" + num;
-        document.body.appendChild(script);
-      };
-      list[num].requestCORS = function (url) {
-        $.ajax({ url: url, method: "GET", data: {}, dataType: 'json', success: r['gotRoute' + num] });
-      };
-      r['gotRoute' + num] = function (data) {
-        r.awaitingRoute = false;
-        $(".query_wrapper.routing .spinner").hide();
-        if (!list[num].gotRoute(r, data)) {
-          // No route found
-          if (r.polyline) {
-            map.removeLayer(r.polyline);
-            r.polyline = null;
-          }
-          if (!r.dragging) {
-            alert(I18n.t('javascripts.directions.errors.no_route'));
-          }
-        }
-      };
-    }
-    select.append("<option value='" + i + "'>" + I18n.t(list[i].name) + "</option>");
   }
 
-  r.engines = list;
-  r.chosenEngine = list[0]; // default to first engine
+  var engines = OSM.Directions.engines;
 
-  // Choose an engine on dropdown change
-  r.selectEngine = function (e) {
-    r.chosenEngine = r.engines[e.target.selectedIndex];
-    if (r.polyline) { // and if a route is currently showing, must also refresh, else confusion
+  engines.sort(function (a, b) {
+    return I18n.t(a.name) > I18n.t(b.name);
+  });
+
+  var select = $('select.routing_engines');
+
+  for (var i = 0; i < engines.length; i++) {
+    var engine = engines[i];
+
+    select.append("<option value='" + i + "'>" + I18n.t(engine.name) + "</option>");
+
+    if (engine.name == 'javascripts.directions.engines.osrm_car') {
+      chosenEngine = engine;
+      select.val(i);
+    }
+  }
+
+  select.on("change", function (e) {
+    chosenEngine = engines[e.target.selectedIndex];
+    if (map.hasLayer(polyline)) { // and if a route is currently showing, must also refresh, else confusion
       r.requestRoute(true, false);
     }
-  };
+  });
 
-  // Choose an engine by name
-  r.chooseEngine = function (name) {
-    for (var i = 0; i < r.engines.length; i++) {
-      if (r.engines[i].name == name) {
-        r.chosenEngine = r.engines[i];
-        r.jqSearch.find('select.routing_engines').val(i);
-      }
+  $(".get_directions").on("click", function (e) {
+    e.preventDefault();
+    $(".search").hide();
+    $(".routing").show();
+    $(".search_form input[type='submit']").addClass("routing_submit");
+    $(".query_wrapper.routing [name=route_from]").focus();
+
+    $("#map").on('dragend dragover', function (e) {
+      e.preventDefault();
+    });
+
+    $("#map").on('drop', function (e) {
+      e.preventDefault();
+      var oe = e.originalEvent;
+      var id = oe.dataTransfer.getData('id');
+      var pt = L.DomEvent.getMousePosition(oe, map.getContainer());  // co-ordinates of the mouse pointer at present
+      pt.x += Number(oe.dataTransfer.getData('offsetX'));
+      pt.y += Number(oe.dataTransfer.getData('offsetY'));
+      var ll = map.containerPointToLatLng(pt);
+      endpoints[id === 'marker_from' ? 0 : 1].setLatLng(ll);
+      r.requestRoute(true, false);
+    });
+
+    $(".routing_marker").on('dragstart', function (e) {
+      e.originalEvent.dataTransfer.effectAllowed = 'move';
+      e.originalEvent.dataTransfer.setData('id', this.id);
+      var xo = e.originalEvent.clientX - $(e.target).offset().left;
+      var yo = e.originalEvent.clientY - $(e.target).offset().top;
+      e.originalEvent.dataTransfer.setData('offsetX', e.originalEvent.target.width / 2 - xo);
+      e.originalEvent.dataTransfer.setData('offsetY', e.originalEvent.target.height - yo);
+    });
+  });
+
+  $(".close_directions").on("click", function (e) {
+    e.preventDefault();
+    $(".search").show();
+    $(".routing").hide();
+    $(".search_form input[type='submit']").removeClass("routing_submit");
+    $("#content").addClass("overlay-sidebar");
+    $(".query_wrapper.routing input").val("");
+    map
+      .removeLayer(popup)
+      .removeLayer(polyline)
+      .removeLayer(endpoints[0].marker)
+      .removeLayer(endpoints[1].marker);
+    endpoints[0].latlng = endpoints[1].latlng = null;
+    $("#map").off('dragend drop dragover');
+    $(".routing_marker").off('dragstart');
+    $(".query_wrapper.search [name=query]").focus();
+  });
+
+  var r = {};
+
+  r.requestRoute = function (isFinal, updateZoom) {
+    if (endpoints[0].awaitingGeocode || endpoints[1].awaitingGeocode) {
+      awaitingGeocode = true;
+      return;
     }
+
+    var origin = endpoints[0].latlng,
+      destination = endpoints[1].latlng;
+
+    if (!origin || !destination) {
+      return;
+    }
+
+    $(".query_wrapper.routing .spinner").show();
+    awaitingRoute = true;
+
+    if (updateZoom) {
+      map.fitBounds(L.latLngBounds(origin, destination).pad(0.05));
+    }
+
+    chosenEngine.getRoute(isFinal, [origin, destination], function (err, route) {
+      awaitingRoute = false;
+
+      $(".query_wrapper.routing .spinner").hide();
+
+      if (err) {
+        map.removeLayer(polyline);
+
+        if (!dragging) {
+          alert(I18n.t('javascripts.directions.errors.no_route'));
+        }
+
+        return;
+      }
+
+      polyline
+        .setLatLngs(route.line)
+        .addTo(map);
+
+      $("#content").removeClass("overlay-sidebar");
+
+      var html = ('<h2><a class="geolink" href="#" onclick="$(~.close_directions~).click();return false;">' +
+        '<span class="icon close"></span></a>' + I18n.t('javascripts.directions.directions') +
+        '</h2><p id="routing_summary">' +
+        I18n.t('javascripts.directions.distance') + ': ' + formatDistance(route.distance) + '. ' +
+        I18n.t('javascripts.directions.time') + ': ' + formatTime(route.time) + '.</p>' +
+        '<table id="turnbyturn" />').replace(/~/g, "'");
+
+      $('#sidebar_content')
+        .html(html);
+
+      // Add each row
+      var cumulative = 0;
+      route.steps.forEach(function (step) {
+        var ll        = step[0],
+          direction   = step[1],
+          instruction = step[2],
+          dist        = step[3],
+          lineseg     = step[4];
+
+        cumulative += dist;
+
+        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";
+        }
+
+        var row = $("<tr class='turn'/>");
+        row.append("<td class='direction i" + direction + "'> ");
+        row.append("<td class='instruction'>" + instruction);
+        row.append("<td class='distance'>" + dist);
+
+        row.on('click', function () {
+          popup
+            .setLatLng(ll)
+            .setContent("<p>" + instruction + "</p>")
+            .openOn(map);
+        });
+
+        row.hover(function () {
+          highlight
+            .setLatLngs(lineseg)
+            .addTo(map);
+        }, function () {
+          map.removeLayer(highlight);
+        });
+
+        $('#turnbyturn').append(row);
+      });
+
+      $('#sidebar_content').append('<p id="routing_credit">' +
+        I18n.t('javascripts.directions.instructions.courtesy', {link: chosenEngine.creditline}) +
+        '</p>');
+    });
   };
 
-  $("input[name='route_from']").on("change", function (e) {
-    r.geocode('route_from', e);
-  });
-
-  $("input[name='route_to']").on("change", function (e) {
-    r.geocode('route_to', e);
-  });
-
-  $("select[name='routing_engines']").on("change", function (e) {
-    r.selectEngine(e);
-  });
-
   return r;
 };
+
+OSM.Directions.engines = [];
+
+OSM.Directions.addEngine = function (engine, supportsHTTPS) {
+  if (document.location.protocol == "http:" || supportsHTTPS) {
+    OSM.Directions.engines.push(engine);
+  }
+};
diff --git a/app/assets/javascripts/index/directions_engines/graphhopper.js b/app/assets/javascripts/index/directions_engines/graphhopper.js
index 9f9c549b5..d6e52070c 100644
--- a/app/assets/javascripts/index/directions_engines/graphhopper.js
+++ b/app/assets/javascripts/index/directions_engines/graphhopper.js
@@ -1,81 +1,76 @@
-GraphHopperEngine = function (vehicleName, vehicleParam, locale) {
-  this.vehicleName = vehicleName;
-  this.vehicleParam = vehicleParam;
-  //At this point the local system isn't correctly initialised yet, so we don't have accurate information about current locale
-  this.locale = locale;
-  if (!locale)
-    this.locale = "en";
-};
+function GraphHopperEngine(vehicleName, vehicleParam) {
+  var GH_INSTR_MAP = {
+    "-3": 6, // sharp left
+    "-2": 7, // left
+    "-1": 8, // slight left
+    0: 0, // straight
+    1: 1, // slight right
+    2: 2, // right
+    3: 3, // sharp right
+    4: -1, // finish reached
+    5: -1 // via reached
+  };
 
-GraphHopperEngine.prototype.createConfig = function () {
-  var that = this;
   return {
-    name: "javascripts.directions.engines.graphhopper_" + this.vehicleName.toLowerCase(),
+    name: "javascripts.directions.engines.graphhopper_" + vehicleName.toLowerCase(),
     creditline: '<a href="http://graphhopper.com/" target="_blank">Graphhopper</a>',
     draggable: false,
-    _hints: {},
 
-    getRoute: function (isFinal, points) {
+    getRoute: function (isFinal, points, callback) {
       // documentation
       // https://github.com/graphhopper/graphhopper/blob/master/docs/web/api-doc.md
       var url = "http://graphhopper.com/api/1/route?"
-        + that.vehicleParam
+        + vehicleParam
         + "&locale=" + I18n.currentLocale()
-        + "&key=LijBPDQGfu7Iiq80w3HzwB4RUDJbMbhs6BU0dEnn";
+        + "&key=LijBPDQGfu7Iiq80w3HzwB4RUDJbMbhs6BU0dEnn"
+        + "&type=jsonp";
 
       for (var i = 0; i < points.length; i++) {
-        var pair = points[i].join(',');
-        url += "&point=" + pair;
+        url += "&point=" + points[i].lat + ',' + points[i].lng;
       }
+
       if (isFinal)
         url += "&instructions=true";
-      // GraphHopper supports json too
-      this.requestJSONP(url + "&type=jsonp&callback=");
-    },
 
-    gotRoute: function (router, data) {
-      if (!data.paths || data.paths.length == 0)
-        return false;
+      $.ajax({
+        url: url,
+        dataType: 'jsonp',
+        success: function (data) {
+          if (!data.paths || data.paths.length == 0)
+            return callback(true);
 
-      // Draw polyline
-      var path = data.paths[0];
-      var line = L.PolylineUtil.decode(path.points);
-      router.setPolyline(line);
-      // Assemble instructions
-      var steps = [];
-      var len = path.instructions.length;
-      for (i = 0; i < len; i++) {
-        var instr = path.instructions[i];
-        var instrCode = (i === len - 1) ? 15 : this.GH_INSTR_MAP[instr.sign];
-        var instrText = "<b>" + (i + 1) + ".</b> ";
-        instrText += instr.text;
-        var latLng = line[instr.interval[0]];
-        var distInMeter = instr.distance;
-        steps.push([
-          {lat: latLng.lat, lng: latLng.lng},
-          instrCode,
-          instrText,
-          distInMeter,
-          []
-        ]); // TODO does graphhopper map instructions onto line indices?
-      }
-      router.setItinerary({ steps: steps, distance: path.distance, time: path.time / 1000 });
-      return true;
-    },
+          var path = data.paths[0];
+          var line = L.PolylineUtil.decode(path.points);
 
-    GH_INSTR_MAP: {
-      "-3": 6, // sharp left
-      "-2": 7, // left
-      "-1": 8, // slight left
-      0: 0, // straight
-      1: 1, // slight right
-      2: 2, // right
-      3: 3, // sharp right
-      4: -1, // finish reached
-      5: -1 // via reached
+          var steps = [];
+          var len = path.instructions.length;
+          for (var i = 0; i < len; i++) {
+            var instr = path.instructions[i];
+            var instrCode = (i === len - 1) ? 15 : GH_INSTR_MAP[instr.sign];
+            var instrText = "<b>" + (i + 1) + ".</b> ";
+            instrText += instr.text;
+            var latLng = line[instr.interval[0]];
+            var distInMeter = instr.distance;
+            steps.push([
+              {lat: latLng.lat, lng: latLng.lng},
+              instrCode,
+              instrText,
+              distInMeter,
+              []
+            ]); // TODO does graphhopper map instructions onto line indices?
+          }
+
+          callback(null, {
+            line: line,
+            steps: steps,
+            distance: path.distance,
+            time: path.time / 1000
+          });
+        }
+      });
     }
   };
-};
+}
 
-OSM.DirectionsEngines.add(false, new GraphHopperEngine("Bicycle", "vehicle=bike").createConfig());
-OSM.DirectionsEngines.add(false, new GraphHopperEngine("Foot", "vehicle=foot").createConfig());
+OSM.Directions.addEngine(GraphHopperEngine("Bicycle", "vehicle=bike"), false);
+OSM.Directions.addEngine(GraphHopperEngine("Foot", "vehicle=foot"), false);
diff --git a/app/assets/javascripts/index/directions_engines/mapquest.js b/app/assets/javascripts/index/directions_engines/mapquest.js
index f24d8fab6..3266795bc 100644
--- a/app/assets/javascripts/index/directions_engines/mapquest.js
+++ b/app/assets/javascripts/index/directions_engines/mapquest.js
@@ -3,96 +3,92 @@
 // http://open.mapquestapi.com/directions/
 // https://github.com/apmon/openstreetmap-website/blob/21edc353a4558006f0ce23f5ec3930be6a7d4c8b/app/controllers/routing_controller.rb#L153
 
-MapQuestEngine = function (vehicleName, vehicleParam, locale) {
-  this.vehicleName = vehicleName;
-  this.vehicleParam = vehicleParam;
-  this.locale = locale;
-  if (!locale)
-    this.locale = "en";
-};
+function MapQuestEngine(vehicleName, vehicleParam) {
+  var MQ_SPRITE_MAP = {
+    0: 1, // straight
+    1: 2, // slight right
+    2: 3, // right
+    3: 4, // sharp right
+    4: 5, // reverse
+    5: 6, // sharp left
+    6: 7, // left
+    7: 8, // slight left
+    8: 5, // right U-turn
+    9: 5, // left U-turn
+    10: 2, // right merge
+    11: 8, // left merge
+    12: 2, // right on-ramp
+    13: 8, // left on-ramp
+    14: 2, // right off-ramp
+    15: 8, // left off-ramp
+    16: 2, // right fork
+    17: 8, // left fork
+    18: 1  // straight fork
+  };
 
-MapQuestEngine.prototype.createConfig = function () {
-  var that = this;
   return {
-    name: "javascripts.directions.engines.mapquest_" + this.vehicleName.toLowerCase(),
+    name: "javascripts.directions.engines.mapquest_" + vehicleName.toLowerCase(),
     creditline: '<a href="http://www.mapquest.com/" target="_blank">MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png">',
     draggable: false,
-    _hints: {},
 
-    MQ_SPRITE_MAP: {
-      0: 1, // straight
-      1: 2, // slight right
-      2: 3, // right
-      3: 4, // sharp right
-      4: 5, // reverse
-      5: 6, // sharp left
-      6: 7, // left
-      7: 8, // slight left
-      8: 5, // right U-turn
-      9: 5, // left U-turn
-      10: 2, // right merge
-      11: 8, // left merge
-      12: 2, // right on-ramp
-      13: 8, // left on-ramp
-      14: 2, // right off-ramp
-      15: 8, // left off-ramp
-      16: 2, // right fork
-      17: 8, // left fork
-      18: 1  // straight fork
-    },
-
-    getRoute: function (isFinal, points) {
+    getRoute: function (isFinal, points, callback) {
       var url = document.location.protocol + "//open.mapquestapi.com/directions/v2/route?key=Fmjtd%7Cluur290anu%2Crl%3Do5-908a0y";
       var from = points[0];
       var to = points[points.length - 1];
-      url += "&from=" + from.join(',');
-      url += "&to=" + to.join(',');
-      url += "&" + that.vehicleParam;
+      url += "&from=" + from.lat + ',' + from.lng;
+      url += "&to=" + to.lat + ',' + to.lng;
+      url += "&" + vehicleParam;
       //url+="&locale=" + I18n.currentLocale(); //Doesn't actually work. MapQuest requires full locale e.g. "de_DE", but I18n may only provides language, e.g. "de"
       url += "&manMaps=false";
       url += "&shapeFormat=raw&generalize=0&unit=k";
-      this.requestCORS(url);
-    },
 
-    gotRoute: function (router, data) {
-      if (data.info.statuscode != 0) return false;
+      $.ajax({
+        url: url,
+        success: function (data) {
+          if (data.info.statuscode != 0)
+            return callback(true);
 
-      var poly = [];
-      var shape = data.route.shape.shapePoints;
-      for (var i = 0; i < shape.length; i += 2) {
-        poly.push(L.latLng(shape[i], shape[i + 1]));
-      }
-      router.setPolyline(poly);
+          var line = [];
+          var shape = data.route.shape.shapePoints;
+          for (var i = 0; i < shape.length; i += 2) {
+            line.push(L.latLng(shape[i], shape[i + 1]));
+          }
 
-      // data.route.shape.maneuverIndexes links turns to polyline positions
-      // data.route.legs[0].maneuvers is list of turns
-      var steps = [];
-      var mq = data.route.legs[0].maneuvers;
-      for (var i = 0; i < mq.length; i++) {
-        var s = mq[i];
-        var d;
-        var linesegstart, linesegend, lineseg;
-        linesegstart = data.route.shape.maneuverIndexes[i];
-        if (i == mq.length - 1) {
-          d = 15;
-          linesegend = linesegstart + 1;
-        } else {
-          d = this.MQ_SPRITE_MAP[s.turnType];
-          linesegend = data.route.shape.maneuverIndexes[i + 1] + 1;
+          // data.route.shape.maneuverIndexes links turns to polyline positions
+          // data.route.legs[0].maneuvers is list of turns
+          var steps = [];
+          var mq = data.route.legs[0].maneuvers;
+          for (var i = 0; i < mq.length; i++) {
+            var s = mq[i];
+            var d;
+            var linesegstart, linesegend, lineseg;
+            linesegstart = data.route.shape.maneuverIndexes[i];
+            if (i == mq.length - 1) {
+              d = 15;
+              linesegend = linesegstart + 1;
+            } else {
+              d = MQ_SPRITE_MAP[s.turnType];
+              linesegend = data.route.shape.maneuverIndexes[i + 1] + 1;
+            }
+            lineseg = [];
+            for (var j = linesegstart; j < linesegend; j++) {
+              lineseg.push(L.latLng(data.route.shape.shapePoints[j * 2], data.route.shape.shapePoints[j * 2 + 1]));
+            }
+            steps.push([L.latLng(s.startPoint.lat, s.startPoint.lng), d, s.narrative, s.distance * 1000, lineseg]);
+          }
+
+          callback(null, {
+            line: line,
+            steps: steps,
+            distance: data.route.distance * 1000,
+            time: data.route['time']
+          });
         }
-        lineseg = [];
-        for (var j = linesegstart; j < linesegend; j++) {
-          lineseg.push(L.latLng(data.route.shape.shapePoints[j * 2], data.route.shape.shapePoints[j * 2 + 1]));
-        }
-        steps.push([L.latLng(s.startPoint.lat, s.startPoint.lng), d, s.narrative, s.distance * 1000, lineseg]);
-      }
-      router.setItinerary({ steps: steps, distance: data.route.distance * 1000, time: data.route['time'] });
-      return true;
+      });
     }
   };
-};
+}
 
-OSM.DirectionsEngines.add(true, new MapQuestEngine("Bicycle", "routeType=bicycle").createConfig());
-OSM.DirectionsEngines.add(true, new MapQuestEngine("Foot", "routeType=pedestrian").createConfig());
-OSM.DirectionsEngines.add(true, new MapQuestEngine("Car", "routeType=fastest").createConfig());
-// can be: routeType=fastest|shortest|pedestrian|multimodal|bicycle
+OSM.Directions.addEngine(MapQuestEngine("Bicycle", "routeType=bicycle"), true);
+OSM.Directions.addEngine(MapQuestEngine("Foot", "routeType=pedestrian"), true);
+OSM.Directions.addEngine(MapQuestEngine("Car", "routeType=fastest"), true);
diff --git a/app/assets/javascripts/index/directions_engines/osrm.js b/app/assets/javascripts/index/directions_engines/osrm.js
index ac78699f9..ebcbf1fb1 100644
--- a/app/assets/javascripts/index/directions_engines/osrm.js
+++ b/app/assets/javascripts/index/directions_engines/osrm.js
@@ -1,69 +1,87 @@
 // OSRM car engine
 // Doesn't yet support hints
 
-OSRMEngine = function (vehicleName, baseURL, locale) {
-  this.vehicleName = vehicleName;
-  this.baseURL = baseURL;
-  this.locale = locale;
-  if (!locale)
-    this.locale = "en";
-};
-
-OSRMEngine.prototype.createConfig = function () {
-  var that = this;
+function OSRMEngine() {
   return {
-    name: "javascripts.directions.engines.osrm_" + this.vehicleName.toLowerCase(),
+    name: "javascripts.directions.engines.osrm_car",
     creditline: '<a href="http://project-osrm.org/" target="_blank">OSRM</a>',
     draggable: true,
-    _hints: {},
 
-    getRoute: function (isFinal, points) {
-      var url = that.baseURL + "?z=14&output=json";
+    getRoute: function (isFinal, points, callback) {
+      var TURN_INSTRUCTIONS = [
+        "",
+        I18n.t('javascripts.directions.instructions.continue_on'),      // 1
+        I18n.t('javascripts.directions.instructions.slight_right'),     // 2
+        I18n.t('javascripts.directions.instructions.turn_right'),       // 3
+        I18n.t('javascripts.directions.instructions.sharp_right'),      // 4
+        I18n.t('javascripts.directions.instructions.uturn'),            // 5
+        I18n.t('javascripts.directions.instructions.sharp_left'),       // 6
+        I18n.t('javascripts.directions.instructions.turn_left'),        // 7
+        I18n.t('javascripts.directions.instructions.slight_left'),      // 8
+        I18n.t('javascripts.directions.instructions.via_point'),        // 9
+        I18n.t('javascripts.directions.instructions.follow'),           // 10
+        I18n.t('javascripts.directions.instructions.roundabout'),       // 11
+        I18n.t('javascripts.directions.instructions.leave_roundabout'), // 12
+        I18n.t('javascripts.directions.instructions.stay_roundabout'),  // 13
+        I18n.t('javascripts.directions.instructions.start'),            // 14
+        I18n.t('javascripts.directions.instructions.destination'),      // 15
+        I18n.t('javascripts.directions.instructions.against_oneway'),   // 16
+        I18n.t('javascripts.directions.instructions.end_oneway')        // 17
+      ];
+
+      var url = "http://router.project-osrm.org/viaroute?z=14&output=json";
+
       for (var i = 0; i < points.length; i++) {
-        var pair = points[i].join(',');
-        url += "&loc=" + pair;
-        if (this._hints[pair]) url += "&hint=" + this._hints[pair];
+        url += "&loc=" + points[i].lat + ',' + points[i].lng;
       }
-      if (isFinal) url += "&instructions=true";
-      this.requestCORS(url);
-    },
 
-    gotRoute: function (router, data) {
-      if (data.status == 207) {
-        return false;
-      }
-      // Draw polyline
-      var line = L.PolylineUtil.decode(data.route_geometry);
-      for (i = 0; i < line.length; i++) {
-        line[i].lat /= 10;
-        line[i].lng /= 10;
-      }
-      router.setPolyline(line);
-      // Assemble instructions
-      var steps = [];
-      for (i = 0; i < data.route_instructions.length; i++) {
-        var s = data.route_instructions[i];
-        var linesegend;
-        var instCodes = s[0].split('-');
-        var instText = "<b>" + (i + 1) + ".</b> ";
-        instText += TURN_INSTRUCTIONS[instCodes[0]];
-        if (instCodes[1]) {
-          instText += "exit " + instCodes[1] + " ";
+      if (isFinal)
+        url += "&instructions=true";
+
+      $.ajax({
+        url: url,
+        dataType: 'json',
+        success: function (data) {
+          if (data.status == 207)
+            return callback(true);
+
+          var line = L.PolylineUtil.decode(data.route_geometry);
+          for (var i = 0; i < line.length; i++) {
+            line[i].lat /= 10;
+            line[i].lng /= 10;
+          }
+
+          var steps = [];
+          for (i = 0; i < data.route_instructions.length; i++) {
+            var s = data.route_instructions[i];
+            var linesegend;
+            var instCodes = s[0].split('-');
+            var instText = "<b>" + (i + 1) + ".</b> ";
+            instText += TURN_INSTRUCTIONS[instCodes[0]];
+            if (instCodes[1]) {
+              instText += "exit " + instCodes[1] + " ";
+            }
+            if (instCodes[0] != 15) {
+              instText += s[1] ? "<b>" + s[1] + "</b>" : I18n.t('javascripts.directions.instructions.unnamed');
+            }
+            if ((i + 1) < data.route_instructions.length) {
+              linesegend = data.route_instructions[i + 1][3] + 1;
+            } else {
+              linesegend = s[3] + 1;
+            }
+            steps.push([line[s[3]], s[0].split('-')[0], instText, s[2], line.slice(s[3], linesegend)]);
+          }
+
+          callback(null, {
+            line: line,
+            steps: steps,
+            distance: data.route_summary.total_distance,
+            time: data.route_summary.total_time
+          });
         }
-        if (instCodes[0] != 15) {
-          instText += s[1] ? "<b>" + s[1] + "</b>" : I18n.t('javascripts.directions.instructions.unnamed');
-        }
-        if ((i + 1) < data.route_instructions.length) {
-          linesegend = data.route_instructions[i + 1][3] + 1;
-        } else {
-          linesegend = s[3] + 1;
-        }
-        steps.push([line[s[3]], s[0].split('-')[0], instText, s[2], line.slice(s[3], linesegend)]);
-      }
-      if (steps.length) router.setItinerary({ steps: steps, distance: data.route_summary.total_distance, time: data.route_summary.total_time });
-      return true;
+      });
     }
   };
-};
+}
 
-OSM.DirectionsEngines.add(false, new OSRMEngine("Car", "http://router.project-osrm.org/viaroute").createConfig());
+OSM.Directions.addEngine(OSRMEngine(), false);

From f2bf38606e281290fee8273e247afc54f08a0a47 Mon Sep 17 00:00:00 2001
From: John Firebaugh <john.firebaugh@gmail.com>
Date: Tue, 13 May 2014 11:21:48 -0700
Subject: [PATCH 60/88] Permalinks for directions

---
 app/assets/javascripts/index.js               |  51 +---
 .../javascripts/index/directions.js.erb       | 227 ++++++++++--------
 .../index/directions_engines/graphhopper.js   |  16 +-
 .../index/directions_engines/mapquest.js      |  12 +-
 .../index/directions_engines/osrm.js          |   9 +-
 app/assets/javascripts/index/search.js        |  34 ++-
 app/assets/javascripts/leaflet.map.js.erb     |  13 +
 app/assets/javascripts/router.js              |   9 +-
 app/assets/stylesheets/common.css.scss        |  14 +-
 app/assets/stylesheets/small.css.scss         |   4 +-
 app/controllers/directions_controller.rb      |   9 +
 app/views/directions/search.html.erb          |   1 +
 app/views/layouts/_search.html.erb            |  50 ++--
 config/routes.rb                              |   3 +
 14 files changed, 244 insertions(+), 208 deletions(-)
 create mode 100644 app/controllers/directions_controller.rb
 create mode 100644 app/views/directions/search.html.erb

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index 3d063189f..1c0812485 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -16,10 +16,12 @@
 //= require index/directions
 //= require router
 
-(function() {
+$(document).ready(function () {
   var loaderTimeout;
 
   OSM.loadSidebarContent = function(path, callback) {
+    map.setSidebarOverlaid(false);
+
     clearTimeout(loaderTimeout);
 
     loaderTimeout = setTimeout(function() {
@@ -67,9 +69,7 @@
       }
     });
   };
-})();
 
-$(document).ready(function () {
   var params = OSM.mapParams();
 
   var map = new L.OSM.Map("map", {
@@ -222,10 +222,8 @@ $(document).ready(function () {
   OSM.Index = function(map) {
     var page = {};
 
-    page.pushstate = function() {
-      $("#content").addClass("overlay-sidebar");
-      map.invalidateSize({pan: false})
-        .panBy([-350, 0], {animate: false});
+    page.pushstate = page.popstate = function() {
+      map.setSidebarOverlaid(true);
       document.title = I18n.t('layouts.project_name.title');
     };
 
@@ -236,18 +234,6 @@ $(document).ready(function () {
       return map.getState();
     };
 
-    page.popstate = function() {
-      $("#content").addClass("overlay-sidebar");
-      map.invalidateSize({pan: false});
-      document.title = I18n.t('layouts.project_name.title');
-    };
-
-    page.unload = function() {
-      map.panBy([350, 0], {animate: false});
-      $("#content").removeClass("overlay-sidebar");
-      map.invalidateSize({pan: false});
-    };
-
     return page;
   };
 
@@ -281,12 +267,12 @@ $(document).ready(function () {
     return page;
   };
 
-  var directions = OSM.Directions(map);
   var history = OSM.History(map);
 
   OSM.router = OSM.Router(map, {
     "/":                           OSM.Index(map),
     "/search":                     OSM.Search(map),
+    "/directions":                 OSM.Directions(map),
     "/export":                     OSM.Export(map),
     "/note/new":                   OSM.NewNote(map),
     "/history/friends":            history,
@@ -322,29 +308,4 @@ $(document).ready(function () {
     if (OSM.router.route(this.pathname + this.search + this.hash))
       e.preventDefault();
   });
-
-  $(".search_form").on("submit", function(e) {
-    e.preventDefault();
-    if ($(".query_wrapper.routing").is(":visible")) {
-      // Directions
-      directions.requestRoute(true, true);
-    } else {
-      // Search
-      $("header").addClass("closed");
-      var query = $(this).find("input[name=query]").val();
-      if (query) {
-        OSM.router.route("/search?query=" + encodeURIComponent(query) + OSM.formatHash(map));
-      } else {
-        OSM.router.route("/" + OSM.formatHash(map));
-      }
-    }
-  });
-
-  $(".describe_location").on("click", function(e) {
-    e.preventDefault();
-    var precision = OSM.zoomPrecision(map.getZoom());
-    OSM.router.route("/search?query=" + encodeURIComponent(
-      map.getCenter().lat.toFixed(precision) + "," +
-      map.getCenter().lng.toFixed(precision)));
-  });
 });
diff --git a/app/assets/javascripts/index/directions.js.erb b/app/assets/javascripts/index/directions.js.erb
index 9c9df6515..3520f3ecd 100644
--- a/app/assets/javascripts/index/directions.js.erb
+++ b/app/assets/javascripts/index/directions.js.erb
@@ -46,7 +46,9 @@ OSM.Directions = function (map) {
       if (dragging && !chosenEngine.draggable) return;
       if (dragging && awaitingRoute) return;
       endpoint.setLatLng(e.target.getLatLng());
-      r.requestRoute(!dragging, false);
+      if (map.hasLayer(polyline)) {
+        getRoute();
+      }
     });
 
     input.on("change", function (e) {
@@ -69,13 +71,14 @@ OSM.Directions = function (map) {
 
         if (awaitingGeocode) {
           awaitingGeocode = false;
-          r.requestRoute(true, true);
+          getRoute();
         }
       });
     });
 
     endpoint.setLatLng = function (ll) {
-      input.val(Math.round(ll.lat * 10000) / 10000 + " " + Math.round(ll.lng * 10000) / 10000);
+      var precision = OSM.zoomPrecision(map.getZoom());
+      input.val(ll.lat.toFixed(precision) + ", " + ll.lng.toFixed(precision));
       endpoint.latlng = ll;
       endpoint.marker
         .setLatLng(ll)
@@ -102,109 +105,41 @@ OSM.Directions = function (map) {
     return h + ":" + (m < 10 ? '0' : '') + m;
   }
 
-  var engines = OSM.Directions.engines;
-
-  engines.sort(function (a, b) {
-    return I18n.t(a.name) > I18n.t(b.name);
-  });
-
-  var select = $('select.routing_engines');
-
-  for (var i = 0; i < engines.length; i++) {
-    var engine = engines[i];
-
-    select.append("<option value='" + i + "'>" + I18n.t(engine.name) + "</option>");
-
-    if (engine.name == 'javascripts.directions.engines.osrm_car') {
-      chosenEngine = engine;
-      select.val(i);
-    }
+  function setEngine(id) {
+    engines.forEach(function(engine, i) {
+      if (engine.id == id) {
+        chosenEngine = engine;
+        select.val(i);
+      }
+    });
   }
 
-  select.on("change", function (e) {
-    chosenEngine = engines[e.target.selectedIndex];
-    if (map.hasLayer(polyline)) { // and if a route is currently showing, must also refresh, else confusion
-      r.requestRoute(true, false);
-    }
-  });
-
-  $(".get_directions").on("click", function (e) {
-    e.preventDefault();
-    $(".search").hide();
-    $(".routing").show();
-    $(".search_form input[type='submit']").addClass("routing_submit");
-    $(".query_wrapper.routing [name=route_from]").focus();
-
-    $("#map").on('dragend dragover', function (e) {
-      e.preventDefault();
-    });
-
-    $("#map").on('drop', function (e) {
-      e.preventDefault();
-      var oe = e.originalEvent;
-      var id = oe.dataTransfer.getData('id');
-      var pt = L.DomEvent.getMousePosition(oe, map.getContainer());  // co-ordinates of the mouse pointer at present
-      pt.x += Number(oe.dataTransfer.getData('offsetX'));
-      pt.y += Number(oe.dataTransfer.getData('offsetY'));
-      var ll = map.containerPointToLatLng(pt);
-      endpoints[id === 'marker_from' ? 0 : 1].setLatLng(ll);
-      r.requestRoute(true, false);
-    });
-
-    $(".routing_marker").on('dragstart', function (e) {
-      e.originalEvent.dataTransfer.effectAllowed = 'move';
-      e.originalEvent.dataTransfer.setData('id', this.id);
-      var xo = e.originalEvent.clientX - $(e.target).offset().left;
-      var yo = e.originalEvent.clientY - $(e.target).offset().top;
-      e.originalEvent.dataTransfer.setData('offsetX', e.originalEvent.target.width / 2 - xo);
-      e.originalEvent.dataTransfer.setData('offsetY', e.originalEvent.target.height - yo);
-    });
-  });
-
-  $(".close_directions").on("click", function (e) {
-    e.preventDefault();
-    $(".search").show();
-    $(".routing").hide();
-    $(".search_form input[type='submit']").removeClass("routing_submit");
-    $("#content").addClass("overlay-sidebar");
-    $(".query_wrapper.routing input").val("");
-    map
-      .removeLayer(popup)
-      .removeLayer(polyline)
-      .removeLayer(endpoints[0].marker)
-      .removeLayer(endpoints[1].marker);
-    endpoints[0].latlng = endpoints[1].latlng = null;
-    $("#map").off('dragend drop dragover');
-    $(".routing_marker").off('dragstart');
-    $(".query_wrapper.search [name=query]").focus();
-  });
-
-  var r = {};
-
-  r.requestRoute = function (isFinal, updateZoom) {
+  function getRoute() {
     if (endpoints[0].awaitingGeocode || endpoints[1].awaitingGeocode) {
       awaitingGeocode = true;
       return;
     }
 
-    var origin = endpoints[0].latlng,
-      destination = endpoints[1].latlng;
+    var o = endpoints[0].latlng,
+        d = endpoints[1].latlng;
 
-    if (!origin || !destination) {
-      return;
-    }
+    if (!o || !d) return;
 
-    $(".query_wrapper.routing .spinner").show();
+    var precision = OSM.zoomPrecision(map.getZoom());
+
+    OSM.router.replace("/directions?" + querystring.stringify({
+      engine: chosenEngine.id,
+      route: o.lat.toFixed(precision) + ',' + o.lng.toFixed(precision) + ';' +
+             d.lat.toFixed(precision) + ',' + d.lng.toFixed(precision)
+    }));
+
+    $(".directions_form .spinner").show();
     awaitingRoute = true;
 
-    if (updateZoom) {
-      map.fitBounds(L.latLngBounds(origin, destination).pad(0.05));
-    }
-
-    chosenEngine.getRoute(isFinal, [origin, destination], function (err, route) {
+    chosenEngine.getRoute([o, d], function (err, route) {
       awaitingRoute = false;
 
-      $(".query_wrapper.routing .spinner").hide();
+      $(".directions_form .spinner").hide();
 
       if (err) {
         map.removeLayer(polyline);
@@ -220,14 +155,18 @@ OSM.Directions = function (map) {
         .setLatLngs(route.line)
         .addTo(map);
 
-      $("#content").removeClass("overlay-sidebar");
+      map.setSidebarOverlaid(false);
 
-      var html = ('<h2><a class="geolink" href="#" onclick="$(~.close_directions~).click();return false;">' +
+      if (!dragging) {
+        map.fitBounds(polyline.getBounds().pad(0.05));
+      }
+
+      var html = '<h2><a class="geolink" href="#">' +
         '<span class="icon close"></span></a>' + I18n.t('javascripts.directions.directions') +
         '</h2><p id="routing_summary">' +
         I18n.t('javascripts.directions.distance') + ': ' + formatDistance(route.distance) + '. ' +
         I18n.t('javascripts.directions.time') + ': ' + formatTime(route.time) + '.</p>' +
-        '<table id="turnbyturn" />').replace(/~/g, "'");
+        '<table id="turnbyturn" />';
 
       $('#sidebar_content')
         .html(html);
@@ -282,9 +221,103 @@ OSM.Directions = function (map) {
         I18n.t('javascripts.directions.instructions.courtesy', {link: chosenEngine.creditline}) +
         '</p>');
     });
+  }
+
+  var engines = OSM.Directions.engines;
+
+  engines.sort(function (a, b) {
+    a = I18n.t('javascripts.directions.engines.' + a.id);
+    b = I18n.t('javascripts.directions.engines.' + b.id);
+    return a.localeCompare(b);
+  });
+
+  var select = $('select.routing_engines');
+
+  engines.forEach(function(engine, i) {
+    select.append("<option value='" + i + "'>" + I18n.t('javascripts.directions.engines.' + engine.id) + "</option>");
+  });
+
+  setEngine('osrm_car');
+
+  select.on("change", function (e) {
+    chosenEngine = engines[e.target.selectedIndex];
+    if (map.hasLayer(polyline)) {
+      getRoute();
+    }
+  });
+
+  $(".directions_form").on("submit", function(e) {
+    e.preventDefault();
+    $("header").addClass("closed");
+    getRoute();
+  });
+
+  $(".routing_marker").on('dragstart', function (e) {
+    e.originalEvent.dataTransfer.effectAllowed = 'move';
+    e.originalEvent.dataTransfer.setData('id', this.id);
+    var xo = e.originalEvent.clientX - $(e.target).offset().left;
+    var yo = e.originalEvent.clientY - $(e.target).offset().top;
+    e.originalEvent.dataTransfer.setData('offsetX', e.originalEvent.target.width / 2 - xo);
+    e.originalEvent.dataTransfer.setData('offsetY', e.originalEvent.target.height - yo);
+  });
+
+  var page = {};
+
+  page.pushstate = page.popstate = function() {
+    $(".search_form").hide();
+    $(".directions_form").show();
+
+    $("#map").on('dragend dragover', function (e) {
+      e.preventDefault();
+    });
+
+    $("#map").on('drop', function (e) {
+      e.preventDefault();
+      var oe = e.originalEvent;
+      var id = oe.dataTransfer.getData('id');
+      var pt = L.DomEvent.getMousePosition(oe, map.getContainer());  // co-ordinates of the mouse pointer at present
+      pt.x += Number(oe.dataTransfer.getData('offsetX'));
+      pt.y += Number(oe.dataTransfer.getData('offsetY'));
+      var ll = map.containerPointToLatLng(pt);
+      endpoints[id === 'marker_from' ? 0 : 1].setLatLng(ll);
+      getRoute();
+    });
+
+    var params = querystring.parse(location.search.substring(1)),
+      route = (params.route || '').split(';');
+
+    if (params.engine) {
+      setEngine(params.engine);
+    }
+
+    var o = route[0] && L.latLng(route[0].split(',')),
+        d = route[1] && L.latLng(route[1].split(','));
+
+    if (o) endpoints[0].setLatLng(o);
+    if (d) endpoints[1].setLatLng(d);
+
+    map.setSidebarOverlaid(!o || !d);
+
+    getRoute();
   };
 
-  return r;
+  page.load = function() {
+    page.pushstate();
+  };
+
+  page.unload = function() {
+    $(".search_form").show();
+    $(".directions_form").hide();
+    $("#map").off('dragend dragover drop');
+
+    map
+      .removeLayer(popup)
+      .removeLayer(polyline)
+      .removeLayer(endpoints[0].marker)
+      .removeLayer(endpoints[1].marker);
+  };
+
+  return page;
 };
 
 OSM.Directions.engines = [];
diff --git a/app/assets/javascripts/index/directions_engines/graphhopper.js b/app/assets/javascripts/index/directions_engines/graphhopper.js
index d6e52070c..11d70efc5 100644
--- a/app/assets/javascripts/index/directions_engines/graphhopper.js
+++ b/app/assets/javascripts/index/directions_engines/graphhopper.js
@@ -1,4 +1,4 @@
-function GraphHopperEngine(vehicleName, vehicleParam) {
+function GraphHopperEngine(id, vehicleParam) {
   var GH_INSTR_MAP = {
     "-3": 6, // sharp left
     "-2": 7, // left
@@ -12,26 +12,24 @@ function GraphHopperEngine(vehicleName, vehicleParam) {
   };
 
   return {
-    name: "javascripts.directions.engines.graphhopper_" + vehicleName.toLowerCase(),
+    id: id,
     creditline: '<a href="http://graphhopper.com/" target="_blank">Graphhopper</a>',
     draggable: false,
 
-    getRoute: function (isFinal, points, callback) {
+    getRoute: function (points, callback) {
       // documentation
       // https://github.com/graphhopper/graphhopper/blob/master/docs/web/api-doc.md
       var url = "http://graphhopper.com/api/1/route?"
         + vehicleParam
         + "&locale=" + I18n.currentLocale()
         + "&key=LijBPDQGfu7Iiq80w3HzwB4RUDJbMbhs6BU0dEnn"
-        + "&type=jsonp";
+        + "&type=jsonp"
+        + "&instructions=true";
 
       for (var i = 0; i < points.length; i++) {
         url += "&point=" + points[i].lat + ',' + points[i].lng;
       }
 
-      if (isFinal)
-        url += "&instructions=true";
-
       $.ajax({
         url: url,
         dataType: 'jsonp',
@@ -72,5 +70,5 @@ function GraphHopperEngine(vehicleName, vehicleParam) {
   };
 }
 
-OSM.Directions.addEngine(GraphHopperEngine("Bicycle", "vehicle=bike"), false);
-OSM.Directions.addEngine(GraphHopperEngine("Foot", "vehicle=foot"), false);
+OSM.Directions.addEngine(GraphHopperEngine("graphhopper_bicycle", "vehicle=bike"), false);
+OSM.Directions.addEngine(GraphHopperEngine("graphhopper_foot", "vehicle=foot"), false);
diff --git a/app/assets/javascripts/index/directions_engines/mapquest.js b/app/assets/javascripts/index/directions_engines/mapquest.js
index 3266795bc..935a1ca4c 100644
--- a/app/assets/javascripts/index/directions_engines/mapquest.js
+++ b/app/assets/javascripts/index/directions_engines/mapquest.js
@@ -3,7 +3,7 @@
 // http://open.mapquestapi.com/directions/
 // https://github.com/apmon/openstreetmap-website/blob/21edc353a4558006f0ce23f5ec3930be6a7d4c8b/app/controllers/routing_controller.rb#L153
 
-function MapQuestEngine(vehicleName, vehicleParam) {
+function MapQuestEngine(id, vehicleParam) {
   var MQ_SPRITE_MAP = {
     0: 1, // straight
     1: 2, // slight right
@@ -27,11 +27,11 @@ function MapQuestEngine(vehicleName, vehicleParam) {
   };
 
   return {
-    name: "javascripts.directions.engines.mapquest_" + vehicleName.toLowerCase(),
+    id: id,
     creditline: '<a href="http://www.mapquest.com/" target="_blank">MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png">',
     draggable: false,
 
-    getRoute: function (isFinal, points, callback) {
+    getRoute: function (points, callback) {
       var url = document.location.protocol + "//open.mapquestapi.com/directions/v2/route?key=Fmjtd%7Cluur290anu%2Crl%3Do5-908a0y";
       var from = points[0];
       var to = points[points.length - 1];
@@ -89,6 +89,6 @@ function MapQuestEngine(vehicleName, vehicleParam) {
   };
 }
 
-OSM.Directions.addEngine(MapQuestEngine("Bicycle", "routeType=bicycle"), true);
-OSM.Directions.addEngine(MapQuestEngine("Foot", "routeType=pedestrian"), true);
-OSM.Directions.addEngine(MapQuestEngine("Car", "routeType=fastest"), true);
+OSM.Directions.addEngine(MapQuestEngine("mapquest_bicycle", "routeType=bicycle"), true);
+OSM.Directions.addEngine(MapQuestEngine("mapquest_foot", "routeType=pedestrian"), true);
+OSM.Directions.addEngine(MapQuestEngine("mapquest_car", "routeType=fastest"), true);
diff --git a/app/assets/javascripts/index/directions_engines/osrm.js b/app/assets/javascripts/index/directions_engines/osrm.js
index ebcbf1fb1..706970ec5 100644
--- a/app/assets/javascripts/index/directions_engines/osrm.js
+++ b/app/assets/javascripts/index/directions_engines/osrm.js
@@ -3,11 +3,11 @@
 
 function OSRMEngine() {
   return {
-    name: "javascripts.directions.engines.osrm_car",
+    id: "osrm_car",
     creditline: '<a href="http://project-osrm.org/" target="_blank">OSRM</a>',
     draggable: true,
 
-    getRoute: function (isFinal, points, callback) {
+    getRoute: function (points, callback) {
       var TURN_INSTRUCTIONS = [
         "",
         I18n.t('javascripts.directions.instructions.continue_on'),      // 1
@@ -29,15 +29,12 @@ function OSRMEngine() {
         I18n.t('javascripts.directions.instructions.end_oneway')        // 17
       ];
 
-      var url = "http://router.project-osrm.org/viaroute?z=14&output=json";
+      var url = "http://router.project-osrm.org/viaroute?z=14&output=json&instructions=true";
 
       for (var i = 0; i < points.length; i++) {
         url += "&loc=" + points[i].lat + ',' + points[i].lng;
       }
 
-      if (isFinal)
-        url += "&instructions=true";
-
       $.ajax({
         url: url,
         dataType: 'json',
diff --git a/app/assets/javascripts/index/search.js b/app/assets/javascripts/index/search.js
index 81b96635b..7fb8edbb0 100644
--- a/app/assets/javascripts/index/search.js
+++ b/app/assets/javascripts/index/search.js
@@ -1,12 +1,30 @@
 OSM.Search = function(map) {
-  $(".search_form input[name=query]")
-    .on("input", function(e) {
-      if ($(e.target).val() == "") {
-        $(".describe_location").fadeIn(100);
-      } else {
-        $(".describe_location").fadeOut(100);
-      }
-    })
+  $(".search_form input[name=query]").on("input", function(e) {
+    if ($(e.target).val() == "") {
+      $(".describe_location").fadeIn(100);
+    } else {
+      $(".describe_location").fadeOut(100);
+    }
+  });
+
+  $(".search_form").on("submit", function(e) {
+    e.preventDefault();
+    $("header").addClass("closed");
+    var query = $(this).find("input[name=query]").val();
+    if (query) {
+      OSM.router.route("/search?query=" + encodeURIComponent(query) + OSM.formatHash(map));
+    } else {
+      OSM.router.route("/" + OSM.formatHash(map));
+    }
+  });
+
+  $(".describe_location").on("click", function(e) {
+    e.preventDefault();
+    var precision = OSM.zoomPrecision(map.getZoom());
+    OSM.router.route("/search?query=" + encodeURIComponent(
+        map.getCenter().lat.toFixed(precision) + "," +
+        map.getCenter().lng.toFixed(precision)));
+  });
 
   $("#sidebar_content")
     .on("click", ".search_more a", clickSearchMore)
diff --git a/app/assets/javascripts/leaflet.map.js.erb b/app/assets/javascripts/leaflet.map.js.erb
index 35370ae99..6f7d7754f 100644
--- a/app/assets/javascripts/leaflet.map.js.erb
+++ b/app/assets/javascripts/leaflet.map.js.erb
@@ -242,6 +242,19 @@ L.OSM.Map = L.Map.extend({
   setState: function(state, options) {
     if (state.center) this.setView(state.center, state.zoom, options);
     this.updateLayers(state.layers);
+  },
+
+  setSidebarOverlaid: function(overlaid) {
+    if (overlaid && !$("#content").hasClass("overlay-sidebar")) {
+      $("#content").addClass("overlay-sidebar");
+      this.invalidateSize({pan: false})
+        .panBy([-350, 0], {animate: false});
+    } else if (!overlaid && $("#content").hasClass("overlay-sidebar")) {
+      this.panBy([350, 0], {animate: false});
+      $("#content").removeClass("overlay-sidebar");
+      this.invalidateSize({pan: false});
+    }
+    return this;
   }
 });
 
diff --git a/app/assets/javascripts/router.js b/app/assets/javascripts/router.js
index 05e47c356..a05ed5a9d 100644
--- a/app/assets/javascripts/router.js
+++ b/app/assets/javascripts/router.js
@@ -121,6 +121,10 @@ OSM.Router = function(map, rts) {
       return true;
     };
 
+    router.replace = function (url) {
+      window.history.replaceState(OSM.parseHash(url), document.title, url);
+    };
+
     router.stateChange = function(state) {
       if (state.center) {
         window.history.replaceState(state, document.title, OSM.formatHash(state));
@@ -129,7 +133,7 @@ OSM.Router = function(map, rts) {
       }
     };
   } else {
-    router.route = function (url) {
+    router.route = router.replace = function (url) {
       window.location.assign(url);
     };
 
@@ -174,9 +178,6 @@ OSM.Router = function(map, rts) {
 
   map.on('moveend baselayerchange overlaylayerchange', router.updateHash);
   $(window).on('hashchange', router.hashUpdated);
-  $(window).on('unload', function(e) {
-      $(".query_wrapper.routing input").val("");
-  });
 
   return router;
 };
diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index 5a26d12f3..b552ce850 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -903,13 +903,15 @@ nav.secondary {
   }
 }
 
-/* Rules for the search box */
+/* Rules for the search and direction forms */
 
-header .search_form {
+header .search_forms,
+.directions_form {
   display: none;
 }
 
-.search_form {
+.search_form,
+.directions_form {
   position: relative;
   padding: $lineheight/2;
   padding-top: 1px;
@@ -948,10 +950,6 @@ header .search_form {
     font-size: 10px;
     color: $blue;
   }
-
-  .routing {
-    display: none;
-  }
 }
 
 /* Rules for the map key which appears in the popout sidebar */
@@ -1005,7 +1003,7 @@ td.direction {
 td.direction.i#{$i}  { background-position: #{($i)*-20+20}px 0px; }
 }
 
-.routing_submit {
+.directions_form input[type="submit"] {
     margin-top: 30px !important;
 }
 
diff --git a/app/assets/stylesheets/small.css.scss b/app/assets/stylesheets/small.css.scss
index e9d0a4779..950e1214d 100644
--- a/app/assets/stylesheets/small.css.scss
+++ b/app/assets/stylesheets/small.css.scss
@@ -36,12 +36,12 @@ header {
     display: none;
   }
 
-  .search_form {
+  .search_forms {
     display: block;
   }
 }
 
-#sidebar .search_form,
+#sidebar .search_forms,
 #edit_tab,
 #export_tab {
   display: none;
diff --git a/app/controllers/directions_controller.rb b/app/controllers/directions_controller.rb
new file mode 100644
index 000000000..d153f0320
--- /dev/null
+++ b/app/controllers/directions_controller.rb
@@ -0,0 +1,9 @@
+class DirectionsController < ApplicationController
+  before_filter :authorize_web
+  before_filter :set_locale
+  before_filter :require_oauth, :only => [:search]
+
+  def search
+    render :layout => map_layout
+  end
+end
diff --git a/app/views/directions/search.html.erb b/app/views/directions/search.html.erb
new file mode 100644
index 000000000..ea6ee7088
--- /dev/null
+++ b/app/views/directions/search.html.erb
@@ -0,0 +1 @@
+<% content_for(:content_class) { "overlay-sidebar" } %>
diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index 43613352e..6e1aa5dc2 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -1,28 +1,32 @@
-<form method="GET" action="<%= search_path %>" class="search_form">
+<div class="search_forms">
+  <form method="GET" action="<%= search_path %>" class="search_form">
+    <div class='query_options'>
+      <%= link_to t('site.search.where_am_i'), '#', { :class => "describe_location", :title => t('site.search.where_am_i_title') } %>
+      &middot;
+      <%= link_to t('site.search.get_directions'), directions_path, { :class => "geolink", :title => t('site.search.get_directions_title') } %>
+    </div>
 
-  <div class='query_options search'>
-    <%= link_to t('site.search.where_am_i'), '#', { :class => "describe_location", :title => t('site.search.where_am_i_title') } %>
-    &middot;
-    <%= link_to t('site.search.get_directions'), '#', { :class => "get_directions", :title => t('site.search.get_directions_title') } %>
-  </div>
+    <%= submit_tag t('site.search.submit_text') %>
 
-  <div class='query_options routing'>
-    <%= link_to t('site.search.close_directions'), '#', { :class => "close_directions", :title => t('site.search.close_directions_title') } %>
-  </div>
+    <div class='query_wrapper'>
+      <%= text_field_tag "query", params[:query], :placeholder => t("site.search.search"), :autofocus => autofocus %>
+    </div>
+  </form>
 
-  <%= submit_tag t('site.search.submit_text') %>
+  <form method="GET" action="<%= directions_path %>" class="directions_form">
+    <div class='query_options'>
+      <%= link_to t('site.search.close_directions'), root_path, { :class => "geolink", :title => t('site.search.close_directions_title') } %>
+    </div>
 
-  <div class='query_wrapper search'>
-    <%= text_field_tag "query", params[:query], :placeholder => t("site.search.search"), :autofocus => autofocus %>
-  </div>
+    <%= submit_tag t('site.search.submit_text') %>
 
-  <div class='query_wrapper routing'>
-    <%= image_tag "marker-green.png", :class => 'routing_marker', :id => 'marker_from', :draggable => 'true' %>
-    <%= text_field_tag "route_from", params[:from], :placeholder => t('site.search.from') %>
-    <%= image_tag "marker-red.png"  , :class => 'routing_marker', :id => 'marker_to'  , :draggable => 'true' %>
-    <%= text_field_tag "route_to"  , params[:to]  , :placeholder => t('site.search.to') %>
-    <select class='routing_engines' name='routing_engines'></select>
-    <%= image_tag "searching-small.gif", :class => 'spinner', :style => "vertical-align: middle; display: none;" %>
-  </div>
-
-</form>
+    <div class='query_wrapper'>
+      <%= image_tag "marker-green.png", :class => 'routing_marker', :id => 'marker_from', :draggable => 'true' %>
+      <%= text_field_tag "route_from", params[:from], :placeholder => t('site.search.from') %>
+      <%= image_tag "marker-red.png"  , :class => 'routing_marker', :id => 'marker_to'  , :draggable => 'true' %>
+      <%= text_field_tag "route_to"  , params[:to]  , :placeholder => t('site.search.to') %>
+      <select class='routing_engines' name='routing_engines'></select>
+      <%= image_tag "searching-small.gif", :class => 'spinner', :style => "vertical-align: middle; display: none;" %>
+    </div>
+  </form>
+</div>
diff --git a/config/routes.rb b/config/routes.rb
index e9f593d92..3b00cbf6a 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -239,6 +239,9 @@ OpenStreetMap::Application.routes.draw do
   match '/geocoder/search_osm_nominatim_reverse' => 'geocoder#search_osm_nominatim_reverse', :via => :get
   match '/geocoder/search_geonames_reverse' => 'geocoder#search_geonames_reverse', :via => :get
 
+  # directions
+  match '/directions' => 'directions#search', :via => :get, :as => :directions
+
   # export
   match '/export/finish' => 'export#finish', :via => :post
   match '/export/embed' => 'export#embed', :via => :get

From 6b0d4dcab2c72397dbbabd768e47323c0e2e42b2 Mon Sep 17 00:00:00 2001
From: John Firebaugh <john.firebaugh@gmail.com>
Date: Wed, 14 May 2014 16:00:31 -0700
Subject: [PATCH 61/88] Supply hints for OSRM

---
 .../javascripts/index/directions_engines/osrm.js     | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/app/assets/javascripts/index/directions_engines/osrm.js b/app/assets/javascripts/index/directions_engines/osrm.js
index 706970ec5..69b78c25e 100644
--- a/app/assets/javascripts/index/directions_engines/osrm.js
+++ b/app/assets/javascripts/index/directions_engines/osrm.js
@@ -2,6 +2,8 @@
 // Doesn't yet support hints
 
 function OSRMEngine() {
+  var previousPoints, hintData;
+
   return {
     id: "osrm_car",
     creditline: '<a href="http://project-osrm.org/" target="_blank">OSRM</a>',
@@ -33,6 +35,13 @@ function OSRMEngine() {
 
       for (var i = 0; i < points.length; i++) {
         url += "&loc=" + points[i].lat + ',' + points[i].lng;
+        if (hintData && previousPoints && previousPoints[i].equals(points[i])) {
+          url += "&hint=" + hintData.locations[i];
+        }
+      }
+
+      if (hintData && hintData.checksum) {
+        url += "&checksum=" + hintData.checksum;
       }
 
       $.ajax({
@@ -42,6 +51,9 @@ function OSRMEngine() {
           if (data.status == 207)
             return callback(true);
 
+          previousPoints = points;
+          hintData = data.hint_data;
+
           var line = L.PolylineUtil.decode(data.route_geometry);
           for (var i = 0; i < line.length; i++) {
             line[i].lat /= 10;

From 3a9db4cf30899d256558f2e03a7c4c30d66669fd Mon Sep 17 00:00:00 2001
From: Matt Amos <zerebubuth@gmail.com>
Date: Mon, 10 Nov 2014 19:17:21 +0000
Subject: [PATCH 62/88] Use buttons for switching to/from directions.

Previously, used a small text link which wasn't very usable. Now
it uses larger buttons which are (hopefully) more usable. Also
this sorts out the weird right-hanging text boxes for the to/from
in the directions sidebar - now they look like proper text input
boxes.

However, the "back to search" button and the directions submit
buttons are weirdly large and I don't quite understand why.
Hopefully an easy fix for someone who knows the arcana of CSS
better than I.
---
 app/assets/images/directions.png       | Bin 0 -> 262 bytes
 app/assets/images/search.png           | Bin 0 -> 391 bytes
 app/assets/stylesheets/common.css.scss |  38 +++++++++++++++++++------
 app/views/layouts/_search.html.erb     |  34 +++++++++-------------
 4 files changed, 44 insertions(+), 28 deletions(-)
 create mode 100644 app/assets/images/directions.png
 create mode 100644 app/assets/images/search.png

diff --git a/app/assets/images/directions.png b/app/assets/images/directions.png
new file mode 100644
index 0000000000000000000000000000000000000000..197244f4a3fcf7744ee20d63981e5bd109d712e2
GIT binary patch
literal 262
zcmeAS@N?(olHy`uVBq!ia0vp^A|TAc1|)ksWqE-VTavfC3&Vd9T(EcfWS|IVfk$L9
z0|Va?5N4dJ%_j{MWH0gbb!ETD%_XSAWEOVRA1E~0)5S5w;`G|d2ZfF(a5!`Rx}Rzv
zbF*76BQ`~Q=Yx!z!wD);D@yljcneQs+Uwl6V87n}rgwUOS$k(K-dANVeoWnfP1alF
z*w4jV*4^3_w|JJZ9Z#FU#Ky4Y(XydU0V2nwED}B~3NBze<1mqBw!@VLh1>Owovas#
zu+5Q?iU`Z`*<mUC?Ae9OSv-;UPZcc=-z(dENnBOETt@NB&qAQ{7(8A5T-G@yGywp0
C8d~K5

literal 0
HcmV?d00001

diff --git a/app/assets/images/search.png b/app/assets/images/search.png
new file mode 100644
index 0000000000000000000000000000000000000000..15cc32e47397c475206dbf0fb23ece25edbce1e5
GIT binary patch
literal 391
zcmV;20eJq2P)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmY4#WTe4#WYKD-Ig~000McNliru-U|v62qONLx_AHp0Tf9@
zK~y-)t(3uygD?<9Kd_>RNVGs1=>t(+8lZ(-xNi;1Ar&z5_cD%b$72x6NS2ND{rqju
z08t_iQBI;<M7fD_w|)`jgtH+^h;kI=Q<SW<rzpoWz%g3%E6Q1vgD5-eXPc)e{|=#<
zvp#okeJ{#Ka9V>+k+VL((*iU&ojl-Tf;k5`(Ao5h2i#0B#2|a9q}lvn`mMBaBg!2>
z2jB;QbZwJB<8Pbm0PFz7)+Cx1z{|!rFQu{wx>rfl0$6Q)_dwaPgKjPA^H=un&sy@z
z-aW^8_z0=vz~ZVw4LDi_oT-#5G%vrST4oLE{UoY?8xQ)<!-Ew0$io0F=$eo=SEBJY
lx#Y0s^s2+;m|p{yp#Lf_XVL>0kWl~t002ovPDHLkV1kGLq;LQL

literal 0
HcmV?d00001

diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index 95e5d8328..39519b81a 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -918,7 +918,6 @@ header .search_forms,
 .directions_form {
   position: relative;
   padding: $lineheight/2;
-  padding-top: 1px;
   background-color: $lightgrey;
 
   .query_wrapper {
@@ -930,17 +929,19 @@ header .search_forms,
   input[type=text] {
     width: 100%;
     height: 30px;
-    border-right: none;
-
     transition: 300ms linear;
   }
 
+  input[type=text].overflow {
+    border-right: none;
+  }
+
   input:focus {
     outline: none;
     box-shadow: 0px 0px 7px #9ED485;
   }
 
-  input[type=submit] {
+  input[type=submit].float {
     float: right;
     width: auto;
     min-width: 0;
@@ -952,6 +953,31 @@ header .search_forms,
     font-size: 10px;
     color: $blue;
   }
+
+  .describe_location {
+    position: absolute;
+    top: 6px;
+    right: 6px;
+    font-size: 10px;
+    color: $blue;
+  }
+
+  .switch_link {
+    float: right;
+    width: auto;
+    min-width: 0;
+    margin-left: 6px;
+  }
+
+  img.button {
+    display: block;
+  }
+
+  span.force_width {
+    width: 100%;
+    padding-right: 25px;
+    display: block;
+  }
 }
 
 /* Rules for the map key which appears in the popout sidebar */
@@ -1007,10 +1033,6 @@ td.direction {
 td.direction.i#{$i}  { background-position: #{($i)*-20+20}px 0px; }
 }
 
-.directions_form input[type="submit"] {
-    margin-top: 30px !important;
-}
-
 p#routing_summary {
     padding: 0 $lineheight $lineheight/4;
 }
diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index 6e1aa5dc2..55b5650b2 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -1,32 +1,26 @@
 <div class="search_forms">
   <form method="GET" action="<%= search_path %>" class="search_form">
-    <div class='query_options'>
-      <%= link_to t('site.search.where_am_i'), '#', { :class => "describe_location", :title => t('site.search.where_am_i_title') } %>
-      &middot;
-      <%= link_to t('site.search.get_directions'), directions_path, { :class => "geolink", :title => t('site.search.get_directions_title') } %>
-    </div>
-
-    <%= submit_tag t('site.search.submit_text') %>
-
+    <%= link_to image_tag('directions.png', :class => 'button'), directions_path, { :class => "button switch_link", :title => t('site.search.get_directions_title') } %>
+    <%= submit_tag t('site.search.submit_text'), :class => 'float' %>
     <div class='query_wrapper'>
-      <%= text_field_tag "query", params[:query], :placeholder => t("site.search.search"), :autofocus => autofocus %>
+      <%= text_field_tag "query", params[:query], :placeholder => t("site.search.search"), :autofocus => autofocus, :class => 'overflow' %>
+      <%= link_to t('site.search.where_am_i'), '#', { :class => "describe_location", :title => t('site.search.where_am_i_title') } %>
     </div>
   </form>
 
   <form method="GET" action="<%= directions_path %>" class="directions_form">
-    <div class='query_options'>
-      <%= link_to t('site.search.close_directions'), root_path, { :class => "geolink", :title => t('site.search.close_directions_title') } %>
-    </div>
+    <div width="100%" align="right"><%= link_to image_tag('search.png', :class => 'button'), root_path, { :class => "button", :title => t('site.search.close_directions_title') } %></div>
 
-    <%= submit_tag t('site.search.submit_text') %>
-
-    <div class='query_wrapper'>
+    <div width="100%">
       <%= image_tag "marker-green.png", :class => 'routing_marker', :id => 'marker_from', :draggable => 'true' %>
-      <%= text_field_tag "route_from", params[:from], :placeholder => t('site.search.from') %>
-      <%= image_tag "marker-red.png"  , :class => 'routing_marker', :id => 'marker_to'  , :draggable => 'true' %>
-      <%= text_field_tag "route_to"  , params[:to]  , :placeholder => t('site.search.to') %>
-      <select class='routing_engines' name='routing_engines'></select>
-      <%= image_tag "searching-small.gif", :class => 'spinner', :style => "vertical-align: middle; display: none;" %>
+      <span class="force_width"><%= text_field_tag "route_from", params[:from], :placeholder => t('site.search.from') %></span>
     </div>
+    <div width="100%">
+      <%= image_tag "marker-red.png"  , :class => 'routing_marker', :id => 'marker_to'  , :draggable => 'true' %>
+      <span class="force_width"><%= text_field_tag "route_to"  , params[:to]  , :placeholder => t('site.search.to') %></span>
+    </div>
+    <select class='routing_engines' name='routing_engines'></select>
+    <div width="100%" align="right"><%= submit_tag t('site.search.submit_text') %></div>
+    <%= image_tag "searching-small.gif", :class => 'spinner', :style => "vertical-align: middle; display: none;" %>
   </form>
 </div>

From 4734b9ce5dec2233eb2ae8b3ce0683033bd26757 Mon Sep 17 00:00:00 2001
From: Matt Amos <zerebubuth@gmail.com>
Date: Mon, 10 Nov 2014 19:36:43 +0000
Subject: [PATCH 63/88] Added some vertical space in the routing text input
 boxes.

---
 app/assets/stylesheets/common.css.scss | 10 ++++++++++
 app/views/layouts/_search.html.erb     |  4 ++--
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index 39519b81a..fb879d375 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -978,6 +978,16 @@ header .search_forms,
     padding-right: 25px;
     display: block;
   }
+
+  select.routing_engines {
+    min-height: 30px;
+    margin: 0px 0px 5px 25px;
+  }
+
+  div.line {
+    width: 100%;
+    margin: 0px 0px 5px 0px;
+  }
 }
 
 /* Rules for the map key which appears in the popout sidebar */
diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index 55b5650b2..c9ae72477 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -11,11 +11,11 @@
   <form method="GET" action="<%= directions_path %>" class="directions_form">
     <div width="100%" align="right"><%= link_to image_tag('search.png', :class => 'button'), root_path, { :class => "button", :title => t('site.search.close_directions_title') } %></div>
 
-    <div width="100%">
+    <div class="line">
       <%= image_tag "marker-green.png", :class => 'routing_marker', :id => 'marker_from', :draggable => 'true' %>
       <span class="force_width"><%= text_field_tag "route_from", params[:from], :placeholder => t('site.search.from') %></span>
     </div>
-    <div width="100%">
+    <div class="line">
       <%= image_tag "marker-red.png"  , :class => 'routing_marker', :id => 'marker_to'  , :draggable => 'true' %>
       <span class="force_width"><%= text_field_tag "route_to"  , params[:to]  , :placeholder => t('site.search.to') %></span>
     </div>

From e3062aa794b89a37b53f4b4b39ea1c985f9da82d Mon Sep 17 00:00:00 2001
From: Matt Amos <zerebubuth@gmail.com>
Date: Mon, 10 Nov 2014 19:59:02 +0000
Subject: [PATCH 64/88] Made top & bottom spacing in directions list
 consistent.

---
 app/assets/javascripts/index/directions.js.erb |  2 +-
 app/assets/stylesheets/common.css.scss         | 14 ++++++++------
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/app/assets/javascripts/index/directions.js.erb b/app/assets/javascripts/index/directions.js.erb
index 3520f3ecd..30b6349fd 100644
--- a/app/assets/javascripts/index/directions.js.erb
+++ b/app/assets/javascripts/index/directions.js.erb
@@ -195,7 +195,7 @@ OSM.Directions = function (map) {
         }
 
         var row = $("<tr class='turn'/>");
-        row.append("<td class='direction i" + direction + "'> ");
+        row.append("<td><div class='direction i" + direction + "'/></td> ");
         row.append("<td class='instruction'>" + instruction);
         row.append("<td class='distance'>" + dist);
 
diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index fb879d375..ad068138b 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -1034,13 +1034,14 @@ header .search_forms,
     border-collapse: separate;
 }
 
-td.direction {
-    background-image: image-url('routing-sprite.png'); 
-    width: 20px; height: 20px; 
-    background-repeat: no-repeat;
+div.direction {
+  background-image: image-url('routing-sprite.png');
+  width: 20px;
+  height: 20px;
+  background-repeat: no-repeat;
 }
 @for $i from 1 through 17 {
-td.direction.i#{$i}  { background-position: #{($i)*-20+20}px 0px; }
+div.direction.i#{$i} { background-position: #{($i)*-20+20}px 0px; }
 }
 
 p#routing_summary {
@@ -1048,7 +1049,8 @@ p#routing_summary {
 }
 
 td.instruction, td.distance {
-    padding-top: 0;
+    padding-top: $lineheight/5;
+    padding-bottom: $lineheight/5;
     border-bottom: 1px solid #DDD;
 }
 td.distance {

From 91930aa4a5dbbc5a0297e72793607b87b792b478 Mon Sep 17 00:00:00 2001
From: Matt Amos <zerebubuth@gmail.com>
Date: Mon, 10 Nov 2014 20:05:54 +0000
Subject: [PATCH 65/88] Consolidated list highlight colours to one parameter.

---
 app/assets/stylesheets/common.css.scss | 8 ++++----
 app/assets/stylesheets/parameters.scss | 1 +
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index ad068138b..d6549e740 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -1010,7 +1010,7 @@ header .search_forms,
     border-bottom: $keyline;
     cursor: pointer;
     &:first-child { border-top: $keyline; }
-    &.selected { background: #FFFFE6; }
+    &.selected { background: $list-highlight; }
   }
 
   .search_details {
@@ -1062,7 +1062,7 @@ tr.turn {
     cursor: pointer;
 }
 tr.turn:hover {
-    background: lighten($green, 30%); 
+    background: $list-highlight;
 }
 .routing_engines, #route_from, #route_to { margin-left: 25px; }
 .routing_marker { width: 15px; position: absolute; }
@@ -1088,7 +1088,7 @@ tr.turn:hover {
     border-bottom: 1px solid #ddd;
     cursor: pointer;
 
-    &.selected { background: #FFFFE6; }
+    &.selected { background: $list-highlight; }
     /* color is derived from changeset bbox fillColor in history.js */
   }
 
@@ -1245,7 +1245,7 @@ tr.turn:hover {
         }
 
         &.selected {
-          background: #FFFFE6;
+          background: $list-highlight;
         }
       }
     }
diff --git a/app/assets/stylesheets/parameters.scss b/app/assets/stylesheets/parameters.scss
index b26b29105..989444a62 100644
--- a/app/assets/stylesheets/parameters.scss
+++ b/app/assets/stylesheets/parameters.scss
@@ -15,3 +15,4 @@ $headerHeight: 55px;
 $sidebarWidth: 350px;
 $keyline: 1px solid $lightgrey;
 $border-radius: 3px;
+$list-highlight: #FFFFE6;

From 60dfcbda9a0b589779f1f088ab562d551048e2e3 Mon Sep 17 00:00:00 2001
From: Peter <peathal@yahoo.de>
Date: Sat, 6 Dec 2014 18:09:18 +0100
Subject: [PATCH 66/88] Using HTTPS for GraphHopper

this avoids information leaking if used via https://openstreetmap.org and it should not be a problem when using via the HTTP variant
---
 .../javascripts/index/directions_engines/graphhopper.js       | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/assets/javascripts/index/directions_engines/graphhopper.js b/app/assets/javascripts/index/directions_engines/graphhopper.js
index 11d70efc5..8d01bcd16 100644
--- a/app/assets/javascripts/index/directions_engines/graphhopper.js
+++ b/app/assets/javascripts/index/directions_engines/graphhopper.js
@@ -13,13 +13,13 @@ function GraphHopperEngine(id, vehicleParam) {
 
   return {
     id: id,
-    creditline: '<a href="http://graphhopper.com/" target="_blank">Graphhopper</a>',
+    creditline: '<a href="https://graphhopper.com/" target="_blank">Graphhopper</a>',
     draggable: false,
 
     getRoute: function (points, callback) {
       // documentation
       // https://github.com/graphhopper/graphhopper/blob/master/docs/web/api-doc.md
-      var url = "http://graphhopper.com/api/1/route?"
+      var url = "https://graphhopper.com/api/1/route?"
         + vehicleParam
         + "&locale=" + I18n.currentLocale()
         + "&key=LijBPDQGfu7Iiq80w3HzwB4RUDJbMbhs6BU0dEnn"

From c99841536b164713f519b96c80dfef1fd4bfd9a8 Mon Sep 17 00:00:00 2001
From: Dan Stowell <danstowell@users.sourceforge.net>
Date: Sat, 24 Jan 2015 13:27:17 +0000
Subject: [PATCH 67/88] Use 'close-box' appearance (less confusing) for
 exit-from-directions

---
 app/views/layouts/_search.html.erb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index c9ae72477..fb4f79eb6 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -9,7 +9,7 @@
   </form>
 
   <form method="GET" action="<%= directions_path %>" class="directions_form">
-    <div width="100%" align="right"><%= link_to image_tag('search.png', :class => 'button'), root_path, { :class => "button", :title => t('site.search.close_directions_title') } %></div>
+    <div width="100%" align="right" style="height:30px"><%= link_to tag('span', { :class => "icon close"}), root_path, { :title => t('site.search.close_directions_title') } %></div>
 
     <div class="line">
       <%= image_tag "marker-green.png", :class => 'routing_marker', :id => 'marker_from', :draggable => 'true' %>

From 9995d316b23eaf3145da524de0b30313769a73ac Mon Sep 17 00:00:00 2001
From: Matt Amos <zerebubuth@gmail.com>
Date: Mon, 26 Jan 2015 14:52:18 +0000
Subject: [PATCH 68/88] Pre-fill directions 'from' field with search query, if
 any.

---
 app/assets/javascripts/index/directions.js.erb |  4 ++++
 app/assets/javascripts/index/search.js         | 10 ++++++++++
 2 files changed, 14 insertions(+)

diff --git a/app/assets/javascripts/index/directions.js.erb b/app/assets/javascripts/index/directions.js.erb
index 30b6349fd..b1f9e44b9 100644
--- a/app/assets/javascripts/index/directions.js.erb
+++ b/app/assets/javascripts/index/directions.js.erb
@@ -290,6 +290,10 @@ OSM.Directions = function (map) {
       setEngine(params.engine);
     }
 
+    if (params.from) {
+      $(".directions_form input[name='route_from']").val(params.from);
+    }
+
     var o = route[0] && L.latLng(route[0].split(',')),
         d = route[1] && L.latLng(route[1].split(','));
 
diff --git a/app/assets/javascripts/index/search.js b/app/assets/javascripts/index/search.js
index 46f756f3b..08d2dc96c 100644
--- a/app/assets/javascripts/index/search.js
+++ b/app/assets/javascripts/index/search.js
@@ -9,6 +9,16 @@ OSM.Search = function(map) {
     }
   });
 
+  $(".search_form a.button.switch_link").on("click", function(e) {
+    e.preventDefault();
+    var query = $(e.target).parent().parent().find("input[name=query]").val();
+    if (query) {
+      OSM.router.route("/directions?from=" + encodeURIComponent(query) + OSM.formatHash(map));
+    } else {
+      OSM.router.route("/directions" + OSM.formatHash(map));
+    }
+  });
+
   $(".search_form").on("submit", function(e) {
     e.preventDefault();
     $("header").addClass("closed");

From 321218f9b1b08451cd4fa4ea67b2a91189eeb37d Mon Sep 17 00:00:00 2001
From: Matt Amos <zerebubuth@gmail.com>
Date: Mon, 26 Jan 2015 15:02:55 +0000
Subject: [PATCH 69/88] Make close button on route dialogue return to index.

---
 app/assets/javascripts/index.js                |  4 ++++
 app/assets/javascripts/index/directions.js.erb | 10 ++++++++++
 app/views/layouts/_search.html.erb             |  2 +-
 3 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index 66dfa5b6f..afb6b3d65 100644
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -236,6 +236,10 @@ $(document).ready(function () {
     };
 
     page.load = function() {
+      var params = querystring.parse(location.search.substring(1));
+      if (params.query) {
+        $("#sidebar .search_form input[name=query]").value(params.query);
+      }
       if (!("autofocus" in document.createElement("input"))) {
         $("#sidebar .search_form input[name=query]").focus();
       }
diff --git a/app/assets/javascripts/index/directions.js.erb b/app/assets/javascripts/index/directions.js.erb
index b1f9e44b9..f1f45814e 100644
--- a/app/assets/javascripts/index/directions.js.erb
+++ b/app/assets/javascripts/index/directions.js.erb
@@ -2,6 +2,16 @@
 //= require_tree ./directions_engines
 
 OSM.Directions = function (map) {
+  $(".directions_form a.directions_close").on("click", function(e) {
+    e.preventDefault();
+    var route_from = $(e.target).parent().parent().parent().find("input[name=route_from]").val();
+    if (route_from) {
+      OSM.router.route("/?query=" + encodeURIComponent(route_from) + OSM.formatHash(map));
+    } else {
+      OSM.router.route("/" + OSM.formatHash(map));
+    }
+  });
+
   var awaitingGeocode; // true if the user has requested a route, but we're waiting on a geocode result
   var awaitingRoute;   // true if we've asked the engine for a route and are waiting to hear back
   var dragging;        // true if the user is dragging a start/end point
diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index fb4f79eb6..5b6806e3d 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -9,7 +9,7 @@
   </form>
 
   <form method="GET" action="<%= directions_path %>" class="directions_form">
-    <div width="100%" align="right" style="height:30px"><%= link_to tag('span', { :class => "icon close"}), root_path, { :title => t('site.search.close_directions_title') } %></div>
+    <div width="100%" align="right" style="height:30px"><%= link_to tag('span', { :class => "icon close"}), root_path, { :title => t('site.search.close_directions_title'), :class => "directions_close" } %></div>
 
     <div class="line">
       <%= image_tag "marker-green.png", :class => 'routing_marker', :id => 'marker_from', :draggable => 'true' %>

From 2dd89f2d0806b249287d19e63e4392e6d21a847b Mon Sep 17 00:00:00 2001
From: Matt Amos <zerebubuth@gmail.com>
Date: Mon, 26 Jan 2015 15:39:21 +0000
Subject: [PATCH 70/88] Geocode pre-filled values when the user presses 'Go'.

---
 .../javascripts/index/directions.js.erb       | 31 ++++++++++++++++---
 1 file changed, 27 insertions(+), 4 deletions(-)

diff --git a/app/assets/javascripts/index/directions.js.erb b/app/assets/javascripts/index/directions.js.erb
index f1f45814e..ee2cce667 100644
--- a/app/assets/javascripts/index/directions.js.erb
+++ b/app/assets/javascripts/index/directions.js.erb
@@ -32,8 +32,8 @@ OSM.Directions = function (map) {
   });
 
   var endpoints = [
-    Endpoint($("input[name='route_from']"), <%= asset_path('marker-green.png').to_json %>),
-    Endpoint($("input[name='route_to']"),   <%= asset_path('marker-red.png').to_json %>)
+    Endpoint($("#content input[name='route_from']"), <%= asset_path('marker-green.png').to_json %>),
+    Endpoint($("#content input[name='route_to']"),   <%= asset_path('marker-red.png').to_json %>)
   ];
 
   function Endpoint(input, iconUrl) {
@@ -62,10 +62,23 @@ OSM.Directions = function (map) {
     });
 
     input.on("change", function (e) {
+      endpoint.getGeocode();
+    });
+
+    endpoint.getGeocode = function() {
+      var value = input.val();
+
+      // if no one has entered a value yet, then we can't geocode, so don't
+      // even try.
+      if (!value) {
+        return;
+      }
+
       endpoint.awaitingGeocode = true;
 
-      $.getJSON('<%= NOMINATIM_URL %>search?q=' + encodeURIComponent(e.target.value) + '&format=json', function (json) {
+      $.getJSON('<%= NOMINATIM_URL %>search?q=' + encodeURIComponent(value) + '&format=json', function (json) {
         endpoint.awaitingGeocode = false;
+        endpoint.hasGeocode = true;
 
         if (json.length == 0) {
           alert(I18n.t('javascripts.directions.errors.no_place'));
@@ -84,11 +97,12 @@ OSM.Directions = function (map) {
           getRoute();
         }
       });
-    });
+    }
 
     endpoint.setLatLng = function (ll) {
       var precision = OSM.zoomPrecision(map.getZoom());
       input.val(ll.lat.toFixed(precision) + ", " + ll.lng.toFixed(precision));
+      endpoint.hasGeocode = true;
       endpoint.latlng = ll;
       endpoint.marker
         .setLatLng(ll)
@@ -125,6 +139,15 @@ OSM.Directions = function (map) {
   }
 
   function getRoute() {
+    // go fetch geocodes for any endpoints which have not already
+    // been geocoded.
+    for (var ep_i = 0; ep_i < 2; ++ep_i) {
+      var endpoint = endpoints[ep_i];
+      if (!endpoint.hasGeocode && !endpoint.awaitingGeocode) {
+        endpoint.getGeocode();
+        awaitingGeocode = true;
+      }
+    }
     if (endpoints[0].awaitingGeocode || endpoints[1].awaitingGeocode) {
       awaitingGeocode = true;
       return;

From 56b2fdf5c9915b02c8bf051e4f82927ae72c8c41 Mon Sep 17 00:00:00 2001
From: Matt Amos <zerebubuth@gmail.com>
Date: Mon, 26 Jan 2015 15:39:53 +0000
Subject: [PATCH 71/88] Hide route steps sidebar when user presses close
 button.

---
 app/assets/javascripts/index/directions.js.erb | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/app/assets/javascripts/index/directions.js.erb b/app/assets/javascripts/index/directions.js.erb
index ee2cce667..3e2251b7a 100644
--- a/app/assets/javascripts/index/directions.js.erb
+++ b/app/assets/javascripts/index/directions.js.erb
@@ -253,6 +253,14 @@ OSM.Directions = function (map) {
       $('#sidebar_content').append('<p id="routing_credit">' +
         I18n.t('javascripts.directions.instructions.courtesy', {link: chosenEngine.creditline}) +
         '</p>');
+
+      $('#sidebar_content a.geolink').on('click', function(e) {
+        e.preventDefault();
+        map.removeLayer(polyline);
+        $('#sidebar_content').html('');
+        map.setSidebarOverlaid(true);
+        // TODO: collapse width of sidebar back to previous
+      });
     });
   }
 

From 376a630756e4f9f68ff88ac9319501d14c38cf37 Mon Sep 17 00:00:00 2001
From: Matt Amos <zerebubuth@gmail.com>
Date: Mon, 26 Jan 2015 16:57:34 +0000
Subject: [PATCH 72/88] Fix vertical alignment of text within select input on
 Firefox.

---
 app/assets/stylesheets/common.css.scss | 9 +++++++++
 app/assets/stylesheets/parameters.scss | 1 +
 2 files changed, 10 insertions(+)

diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index 5202e9c87..7efe76cb1 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -948,6 +948,15 @@ header .search_forms,
     border-radius: 0 2px 2px 0;
   }
 
+  select {
+    border-radius: $border-radius;
+	 border: $border;
+	 background-color: white;
+	 /* this next line is to polyfill the vertical alignment of text within a select element,
+	  * which is different between firefox and chrome. */
+	 padding: 0.3em 0;
+  }
+
   .query_options {
     text-align: right;
     font-size: 10px;
diff --git a/app/assets/stylesheets/parameters.scss b/app/assets/stylesheets/parameters.scss
index 989444a62..eb363459c 100644
--- a/app/assets/stylesheets/parameters.scss
+++ b/app/assets/stylesheets/parameters.scss
@@ -16,3 +16,4 @@ $sidebarWidth: 350px;
 $keyline: 1px solid $lightgrey;
 $border-radius: 3px;
 $list-highlight: #FFFFE6;
+$border: 1px solid $grey;

From 5afe47e3f63031f4ec86156ca63596b90af5197e Mon Sep 17 00:00:00 2001
From: Matt Amos <zerebubuth@gmail.com>
Date: Mon, 26 Jan 2015 17:18:32 +0000
Subject: [PATCH 73/88] Use larger 'spinner' when waiting for route request.
 Replace HTML in content to avoid resize.

---
 app/assets/javascripts/index/directions.js.erb | 10 +++++-----
 app/views/layouts/_search.html.erb             |  2 +-
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/app/assets/javascripts/index/directions.js.erb b/app/assets/javascripts/index/directions.js.erb
index 3e2251b7a..a8f4feb78 100644
--- a/app/assets/javascripts/index/directions.js.erb
+++ b/app/assets/javascripts/index/directions.js.erb
@@ -166,14 +166,16 @@ OSM.Directions = function (map) {
              d.lat.toFixed(precision) + ',' + d.lng.toFixed(precision)
     }));
 
-    $(".directions_form .spinner").show();
+    // copy loading item to sidebar and display it. we copy it, rather than
+    // just using it in-place and replacing it in case it has to be used
+    // again.
+    $('#sidebar_content').html($('.directions_form .loader_copy').html());
     awaitingRoute = true;
+    map.setSidebarOverlaid(false);
 
     chosenEngine.getRoute([o, d], function (err, route) {
       awaitingRoute = false;
 
-      $(".directions_form .spinner").hide();
-
       if (err) {
         map.removeLayer(polyline);
 
@@ -188,8 +190,6 @@ OSM.Directions = function (map) {
         .setLatLngs(route.line)
         .addTo(map);
 
-      map.setSidebarOverlaid(false);
-
       if (!dragging) {
         map.fitBounds(polyline.getBounds().pad(0.05));
       }
diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index 5b6806e3d..441ea3212 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -21,6 +21,6 @@
     </div>
     <select class='routing_engines' name='routing_engines'></select>
     <div width="100%" align="right"><%= submit_tag t('site.search.submit_text') %></div>
-    <%= image_tag "searching-small.gif", :class => 'spinner', :style => "vertical-align: middle; display: none;" %>
+    <div class="loader_copy" style="display:none;"><div class="loader"><%= image_tag "searching.gif", :style => "vertical-align: middle;" %></div></div>
   </form>
 </div>

From b09c14218f917f9d76e89a5c2eebf6a6d0d5eedd Mon Sep 17 00:00:00 2001
From: Matt Amos <zerebubuth@gmail.com>
Date: Mon, 26 Jan 2015 17:53:24 +0000
Subject: [PATCH 74/88] Revert some of the selection styling changes which
 cause bizarre styling regressions to the 80s on FF.

---
 app/assets/stylesheets/common.css.scss | 9 +++------
 1 file changed, 3 insertions(+), 6 deletions(-)

diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index 7efe76cb1..8d40bbe39 100644
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -949,12 +949,9 @@ header .search_forms,
   }
 
   select {
-    border-radius: $border-radius;
-	 border: $border;
-	 background-color: white;
-	 /* this next line is to polyfill the vertical alignment of text within a select element,
-	  * which is different between firefox and chrome. */
-	 padding: 0.3em 0;
+    /* this next line is to polyfill the vertical alignment of text within a select element,
+     * which is different between firefox and chrome. */
+    padding: 0.3em 0;
   }
 
   .query_options {

From 7a44ae6cdc97df0e097f7d0bebaf1bc4339dce60 Mon Sep 17 00:00:00 2001
From: Matt Amos <zerebubuth@gmail.com>
Date: Mon, 26 Jan 2015 18:02:00 +0000
Subject: [PATCH 75/88] Use CSS rather than HTML attributes for styling.

---
 app/views/layouts/_search.html.erb | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index 441ea3212..02d6406cf 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -9,7 +9,7 @@
   </form>
 
   <form method="GET" action="<%= directions_path %>" class="directions_form">
-    <div width="100%" align="right" style="height:30px"><%= link_to tag('span', { :class => "icon close"}), root_path, { :title => t('site.search.close_directions_title'), :class => "directions_close" } %></div>
+    <div style="width:100%; text-align:right; height:30px;"><%= link_to tag('span', { :class => "icon close"}), root_path, { :title => t('site.search.close_directions_title'), :class => "directions_close" } %></div>
 
     <div class="line">
       <%= image_tag "marker-green.png", :class => 'routing_marker', :id => 'marker_from', :draggable => 'true' %>
@@ -20,7 +20,7 @@
       <span class="force_width"><%= text_field_tag "route_to"  , params[:to]  , :placeholder => t('site.search.to') %></span>
     </div>
     <select class='routing_engines' name='routing_engines'></select>
-    <div width="100%" align="right"><%= submit_tag t('site.search.submit_text') %></div>
+    <div style="width:100%; text-align:right;"><%= submit_tag t('site.search.submit_text') %></div>
     <div class="loader_copy" style="display:none;"><div class="loader"><%= image_tag "searching.gif", :style => "vertical-align: middle;" %></div></div>
   </form>
 </div>

From 1b2bfb6e9242d5ec8ff5ab65d44b5761d95d1942 Mon Sep 17 00:00:00 2001
From: Matt Amos <zerebubuth@gmail.com>
Date: Mon, 26 Jan 2015 18:47:34 +0000
Subject: [PATCH 76/88] Make directions endpoints own the value and not care
 which input box they get it from.

---
 .../javascripts/index/directions.js.erb       | 41 +++++++++++--------
 1 file changed, 23 insertions(+), 18 deletions(-)

diff --git a/app/assets/javascripts/index/directions.js.erb b/app/assets/javascripts/index/directions.js.erb
index a8f4feb78..c3ad085ff 100644
--- a/app/assets/javascripts/index/directions.js.erb
+++ b/app/assets/javascripts/index/directions.js.erb
@@ -2,16 +2,6 @@
 //= require_tree ./directions_engines
 
 OSM.Directions = function (map) {
-  $(".directions_form a.directions_close").on("click", function(e) {
-    e.preventDefault();
-    var route_from = $(e.target).parent().parent().parent().find("input[name=route_from]").val();
-    if (route_from) {
-      OSM.router.route("/?query=" + encodeURIComponent(route_from) + OSM.formatHash(map));
-    } else {
-      OSM.router.route("/" + OSM.formatHash(map));
-    }
-  });
-
   var awaitingGeocode; // true if the user has requested a route, but we're waiting on a geocode result
   var awaitingRoute;   // true if we've asked the engine for a route and are waiting to hear back
   var dragging;        // true if the user is dragging a start/end point
@@ -32,8 +22,8 @@ OSM.Directions = function (map) {
   });
 
   var endpoints = [
-    Endpoint($("#content input[name='route_from']"), <%= asset_path('marker-green.png').to_json %>),
-    Endpoint($("#content input[name='route_to']"),   <%= asset_path('marker-red.png').to_json %>)
+    Endpoint($("input[name='route_from']"), <%= asset_path('marker-green.png').to_json %>),
+    Endpoint($("input[name='route_to']"),   <%= asset_path('marker-red.png').to_json %>)
   ];
 
   function Endpoint(input, iconUrl) {
@@ -62,24 +52,29 @@ OSM.Directions = function (map) {
     });
 
     input.on("change", function (e) {
+      // make text the same in both text boxes
+      var value = e.target.value;
+      endpoint.setValue(value)
       endpoint.getGeocode();
     });
 
-    endpoint.getGeocode = function() {
-      var value = input.val();
+    endpoint.setValue = function(value) {
+      endpoint.value = value;
+      input.val(value);
+    }
 
+    endpoint.getGeocode = function() {
       // if no one has entered a value yet, then we can't geocode, so don't
       // even try.
-      if (!value) {
+      if (!endpoint.value) {
         return;
       }
 
       endpoint.awaitingGeocode = true;
 
-      $.getJSON('<%= NOMINATIM_URL %>search?q=' + encodeURIComponent(value) + '&format=json', function (json) {
+      $.getJSON('<%= NOMINATIM_URL %>search?q=' + encodeURIComponent(endpoint.value) + '&format=json', function (json) {
         endpoint.awaitingGeocode = false;
         endpoint.hasGeocode = true;
-
         if (json.length == 0) {
           alert(I18n.t('javascripts.directions.errors.no_place'));
           return;
@@ -112,6 +107,16 @@ OSM.Directions = function (map) {
     return endpoint;
   }
 
+  $(".directions_form a.directions_close").on("click", function(e) {
+    e.preventDefault();
+    var route_from = endpoint[0].value;
+    if (route_from) {
+      OSM.router.route("/?query=" + encodeURIComponent(route_from) + OSM.formatHash(map));
+    } else {
+      OSM.router.route("/" + OSM.formatHash(map));
+    }
+  });
+
   function formatDistance(m) {
     if (m < 1000) {
       return Math.round(m) + "m";
@@ -332,7 +337,7 @@ OSM.Directions = function (map) {
     }
 
     if (params.from) {
-      $(".directions_form input[name='route_from']").val(params.from);
+      endpoints[0].setValue(params.from);
     }
 
     var o = route[0] && L.latLng(route[0].split(',')),

From 8024ad919c4ff4c0249d653ee3626a4b38942f3a Mon Sep 17 00:00:00 2001
From: Dan Stowell <danstowell@users.sourceforge.net>
Date: Mon, 26 Jan 2015 20:48:01 +0000
Subject: [PATCH 77/88] fix typo which prevented directions closebox from
 working

---
 app/assets/javascripts/index/directions.js.erb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/javascripts/index/directions.js.erb b/app/assets/javascripts/index/directions.js.erb
index c3ad085ff..93767612b 100644
--- a/app/assets/javascripts/index/directions.js.erb
+++ b/app/assets/javascripts/index/directions.js.erb
@@ -109,7 +109,7 @@ OSM.Directions = function (map) {
 
   $(".directions_form a.directions_close").on("click", function(e) {
     e.preventDefault();
-    var route_from = endpoint[0].value;
+    var route_from = endpoints[0].value;
     if (route_from) {
       OSM.router.route("/?query=" + encodeURIComponent(route_from) + OSM.formatHash(map));
     } else {

From 44a0835487875777401342b16fee73da68589cf5 Mon Sep 17 00:00:00 2001
From: Tom Hughes <tom@compton.nu>
Date: Sun, 1 Feb 2015 12:15:49 +0000
Subject: [PATCH 78/88] Move routing "Go" button up alongside the dropdown

---
 app/assets/stylesheets/common.scss |  5 +++++
 app/views/layouts/_search.html.erb | 11 +++++++----
 2 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
index ff16ad66b..b7ba464c0 100644
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@ -990,6 +990,11 @@ header .search_forms,
     margin: 0px 0px 5px 25px;
   }
 
+  input.routing_go {
+    min-width: 100px;
+    float: right;
+  }
+
   div.line {
     width: 100%;
     margin: 0px 0px 5px 0px;
diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index 02d6406cf..065190bd5 100644
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -12,15 +12,18 @@
     <div style="width:100%; text-align:right; height:30px;"><%= link_to tag('span', { :class => "icon close"}), root_path, { :title => t('site.search.close_directions_title'), :class => "directions_close" } %></div>
 
     <div class="line">
-      <%= image_tag "marker-green.png", :class => 'routing_marker', :id => 'marker_from', :draggable => 'true' %>
+      <%= image_tag "marker-green.png", :class => "routing_marker", :id => "marker_from", :draggable => "true" %>
       <span class="force_width"><%= text_field_tag "route_from", params[:from], :placeholder => t('site.search.from') %></span>
     </div>
     <div class="line">
-      <%= image_tag "marker-red.png"  , :class => 'routing_marker', :id => 'marker_to'  , :draggable => 'true' %>
+      <%= image_tag "marker-red.png", :class => "routing_marker", :id => "marker_to", :draggable => "true" %>
       <span class="force_width"><%= text_field_tag "route_to"  , params[:to]  , :placeholder => t('site.search.to') %></span>
     </div>
-    <select class='routing_engines' name='routing_engines'></select>
-    <div style="width:100%; text-align:right;"><%= submit_tag t('site.search.submit_text') %></div>
+    <div class="line">
+      <select class="routing_engines" name="routing_engines"></select>
+      <%= submit_tag t('site.search.submit_text'), :class => "routing_go" %>
+    </div>
+
     <div class="loader_copy" style="display:none;"><div class="loader"><%= image_tag "searching.gif", :style => "vertical-align: middle;" %></div></div>
   </form>
 </div>

From a2527b79ff226c2ea7d5fc91552202a98e143bf1 Mon Sep 17 00:00:00 2001
From: Tom Hughes <tom@compton.nu>
Date: Sun, 1 Feb 2015 12:50:17 +0000
Subject: [PATCH 79/88] Clear old routes when the route panel is reopened

---
 app/assets/javascripts/index/directions.js.erb | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/app/assets/javascripts/index/directions.js.erb b/app/assets/javascripts/index/directions.js.erb
index 93767612b..d18fba65b 100644
--- a/app/assets/javascripts/index/directions.js.erb
+++ b/app/assets/javascripts/index/directions.js.erb
@@ -55,12 +55,13 @@ OSM.Directions = function (map) {
       // make text the same in both text boxes
       var value = e.target.value;
       endpoint.setValue(value)
-      endpoint.getGeocode();
     });
 
     endpoint.setValue = function(value) {
       endpoint.value = value;
+      delete endpoint.latlng;
       input.val(value);
+      endpoint.getGeocode();
     }
 
     endpoint.getGeocode = function() {
@@ -338,6 +339,10 @@ OSM.Directions = function (map) {
 
     if (params.from) {
       endpoints[0].setValue(params.from);
+      endpoints[1].setValue("");
+    } else {
+      endpoints[0].setValue("");
+      endpoints[1].setValue("");
     }
 
     var o = route[0] && L.latLng(route[0].split(',')),

From 41af7f5ea79889da3a462a90f4fcdc01c31ba0cc Mon Sep 17 00:00:00 2001
From: Tom Hughes <tom@compton.nu>
Date: Sun, 1 Feb 2015 12:54:56 +0000
Subject: [PATCH 80/88] Remove unused images

---
 app/assets/images/search.png          | Bin 391 -> 0 bytes
 app/assets/images/searching-small.gif | Bin 1849 -> 0 bytes
 2 files changed, 0 insertions(+), 0 deletions(-)
 delete mode 100644 app/assets/images/search.png
 delete mode 100644 app/assets/images/searching-small.gif

diff --git a/app/assets/images/search.png b/app/assets/images/search.png
deleted file mode 100644
index 15cc32e47397c475206dbf0fb23ece25edbce1e5..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 391
zcmV;20eJq2P)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmY4#WTe4#WYKD-Ig~000McNliru-U|v62qONLx_AHp0Tf9@
zK~y-)t(3uygD?<9Kd_>RNVGs1=>t(+8lZ(-xNi;1Ar&z5_cD%b$72x6NS2ND{rqju
z08t_iQBI;<M7fD_w|)`jgtH+^h;kI=Q<SW<rzpoWz%g3%E6Q1vgD5-eXPc)e{|=#<
zvp#okeJ{#Ka9V>+k+VL((*iU&ojl-Tf;k5`(Ao5h2i#0B#2|a9q}lvn`mMBaBg!2>
z2jB;QbZwJB<8Pbm0PFz7)+Cx1z{|!rFQu{wx>rfl0$6Q)_dwaPgKjPA^H=un&sy@z
z-aW^8_z0=vz~ZVw4LDi_oT-#5G%vrST4oLE{UoY?8xQ)<!-Ew0$io0F=$eo=SEBJY
lx#Y0s^s2+;m|p{yp#Lf_XVL>0kWl~t002ovPDHLkV1kGLq;LQL

diff --git a/app/assets/images/searching-small.gif b/app/assets/images/searching-small.gif
deleted file mode 100644
index 06dbc2bc21dddcf0e09b566d5b211aee89570f52..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1849
zcma*odr(tX9tZHtz31lM+(&Y`A`Ou`NeG&R#DrIfV%?hng21vs6<Qu85kn1y8d4G3
zB9aF}khfHe)haF9qWFOLm|a&8BQx4|+?A=*PIucG?9h(3mO>v>ooRQQFbk7E_K!V(
z{?5!fpZWgIZ%*d6t%i*j24bL}AZUJm9)h6R*;%L4IWse3G#VWaN1#$zSSXcBhlYlH
zJ|D}n{r&w2f+Qp)SS*&n?*G4}{}!h?td_mjU6Kad-rW*QwWYCUk7d^e+sjpZAn6kT
z5rM;`{~_}-wm+L@%+E;JphLm}C3WzQAQD0wBoY|rOTQX{(@pp-WAA8Iw0HKl|15j)
zhGh(SFWu#5zUCw^T!}C~eC}~?{xG-r7ugQC>taC+|L^xr&a%{#cgUOZXIM&v?)k^2
z1i5%0!U00wq)r4vlAwXBA_m5J5WNeuBm-XJQ5pG4GD%vc|K){+TJ{AkHqN@SJKczX
zU}QRd9n*_bf^h9<l-a&pF6v6N#Bvg}^VUOq)@d9+!HhLdY=xcv`e(fnj619`rWK_D
z@Nc;Oh3DY&5mnvcAQ!HXAt+%d5>4)6Ctv{CUfz_;qs#RDuQ$DR%y1&5G-a6rhf*4Y
zl+UOD1*GE{GQ7vv;c-tTIMkz0ovO>9j%b5hpa@a*CBJ#W!0@ndSwF|%hMkdFtXiU)
z`BEp+yhkt8ZY>tg&uyH@%^%K4jDrbA;et&vnnzZ3z22@e6<27z2Vk13kb7OtISyxv
z(XoO-LNQCZe3lfzc%*pNqU<9T+p~teThOEB+~e&U0mC|zS{Q)dJZ)!^1f7L(zg*L>
z*vSW%?dR~@@0(}x6-V^A`~ImD;)NaBUnP8;RH=bS2@pk`wp>>8r&jGjmGPy%1BW}v
zoPo}ca$~bze@efc3kapuEVW1!%teOZT3j2Tw5=hjiAf02d}7dL0oFC%@=RXp5Ow#%
z@a>+AM|YWt$n&e`>sB-32gBcuTi>R>*|8@lp`y6thc7ydyqDsuUn~YzZf|{-R@-3y
zL#wx{Ii}xxL_csiW*LBn0-A$>zp4WOmkf6=il<e?!Bom#crh0CjK%19!^g}+k}2`}
zo0Wr#;Yeg4o8zL_UVrMwWi~>rjlW?-l9+bCd7|i?*b5NTmy<<6NZ0T8$SN@mwdC2f
z6jqK=N@bS@!=YSj%>h0}*4p+%0HbTIrE$w7UMT6+AZZ&DAo*qZAAi(OtNbIfl#Dw^
zJWeiCp~zi#&t6x}m9)O^eR4HiLV3QA<<0>HZ8%$^lrSE94Wb}=+MM^!b>n#5&-JQR
zkr-CEu9C;_F*7DqDisulV6Pmg$nFL0TPn%~*m^-`Z3^BgU(sNpnx%nW(!eV9A&FvI
zHL3X3lw8Wji^6=8KbQDE-e%b?<z*f{V{H_@=6jT_Yqwt4Px-l`rX8awSWLQlCB4?y
z8Y>svdFxxdh$8r97@7$ojeI`6AL8Ob6QC$qh&>ZWVDX1F{0vJnT%%mE;GveKWR%C}
zM&4d;Jf3s9|HAA)yVUPo`Aq;0do#)uHSXi5*QF*)x@MVVHr+cN)uMZ__F|&Ta#p8d
z53TOKtce!PJUuie8UWol-S(`c2nH?UGqJP{!4RR4u$LCfn)q-hj0^f=h(VYy)T6eN
zhRO!ja-aDBTcgeyP(8Ua4IdiOog^*CQa?R(cP#9AgL9`j>EX-6Yf1lzX(!~``M1XC
zNmM<4<6d~wWZ$Xrk0K}UteTrq@LBBk#MsjkK;pbuVhe)NI7(7Pf(l?lxC7=1Z7Pzl
zMbS;nV4NI5_N{1$P)&XC)huOGQ+h^zpYUZfb*1n6>!`#*b3y52LGmi+<4sY5jyD#-
zw&$d}DTguLAfnRtjrM*JfqtHqUu6rQoU=g%1E9xk%;)TDm^2<8n-0<WJO&60lJpcB
zz|giz8_eK&)w%}Sqg)v&GE}nCr43Zw<Ore8gvs;S4CGK;h|cacP<UI~!kj9+qwS#S
zl6p|w-TKWs(PpC6*?H+-QS9z<s<>IhT<bH>sQFaek)MY}>PK4;nBk=ow4pF>vzkO&
gna%Org-kgQCf=+BeMi^RbuY;YE~rTjend;_cdi8t>i_@%


From 30a39b35e55e0b83d3261720eecfa94ed769d6e3 Mon Sep 17 00:00:00 2001
From: Tom Hughes <tom@compton.nu>
Date: Sun, 1 Feb 2015 12:56:51 +0000
Subject: [PATCH 81/88] Rename directions_engines to directions

---
 app/assets/javascripts/index/directions.js.erb                  | 2 +-
 .../index/{directions_engines => directions}/graphhopper.js     | 0
 .../index/{directions_engines => directions}/mapquest.js        | 0
 .../index/{directions_engines => directions}/osrm.js            | 0
 4 files changed, 1 insertion(+), 1 deletion(-)
 rename app/assets/javascripts/index/{directions_engines => directions}/graphhopper.js (100%)
 rename app/assets/javascripts/index/{directions_engines => directions}/mapquest.js (100%)
 rename app/assets/javascripts/index/{directions_engines => directions}/osrm.js (100%)

diff --git a/app/assets/javascripts/index/directions.js.erb b/app/assets/javascripts/index/directions.js.erb
index d18fba65b..72299ea1d 100644
--- a/app/assets/javascripts/index/directions.js.erb
+++ b/app/assets/javascripts/index/directions.js.erb
@@ -1,5 +1,5 @@
 //= require_self
-//= require_tree ./directions_engines
+//= require_tree ./directions
 
 OSM.Directions = function (map) {
   var awaitingGeocode; // true if the user has requested a route, but we're waiting on a geocode result
diff --git a/app/assets/javascripts/index/directions_engines/graphhopper.js b/app/assets/javascripts/index/directions/graphhopper.js
similarity index 100%
rename from app/assets/javascripts/index/directions_engines/graphhopper.js
rename to app/assets/javascripts/index/directions/graphhopper.js
diff --git a/app/assets/javascripts/index/directions_engines/mapquest.js b/app/assets/javascripts/index/directions/mapquest.js
similarity index 100%
rename from app/assets/javascripts/index/directions_engines/mapquest.js
rename to app/assets/javascripts/index/directions/mapquest.js
diff --git a/app/assets/javascripts/index/directions_engines/osrm.js b/app/assets/javascripts/index/directions/osrm.js
similarity index 100%
rename from app/assets/javascripts/index/directions_engines/osrm.js
rename to app/assets/javascripts/index/directions/osrm.js

From fb70a89a36e42a7e439e4e99e449a109d0c3cd86 Mon Sep 17 00:00:00 2001
From: Tom Hughes <tom@compton.nu>
Date: Sun, 1 Feb 2015 14:50:18 +0000
Subject: [PATCH 82/88] There is no routing.js to compile

---
 config/initializers/assets.rb | 1 -
 1 file changed, 1 deletion(-)

diff --git a/config/initializers/assets.rb b/config/initializers/assets.rb
index ef7efcbb9..df86f2b9d 100644
--- a/config/initializers/assets.rb
+++ b/config/initializers/assets.rb
@@ -10,7 +10,6 @@ Rails.application.config.assets.version = '1.0'
 # application.js, application.css, and all non-JS/CSS in app/assets folder are already added.
 Rails.application.config.assets.precompile += %w( index.js browse.js welcome.js fixthemap.js )
 Rails.application.config.assets.precompile += %w( user.js diary_entry.js )
-Rails.application.config.assets.precompile += %w( routing.js )
 Rails.application.config.assets.precompile += %w( large-ltr.css small-ltr.css print-ltr.css )
 Rails.application.config.assets.precompile += %w( large-rtl.css small-rtl.css print-rtl.css )
 Rails.application.config.assets.precompile += %w( leaflet-all.css leaflet.ie.css )

From 8adb0846b4834e393eafc68406b5391d7881da83 Mon Sep 17 00:00:00 2001
From: Tom Hughes <tom@compton.nu>
Date: Sun, 1 Feb 2015 15:09:15 +0000
Subject: [PATCH 83/88] Update to latest upstream polyline decoder

---
 Vendorfile                                    |   4 +
 .../javascripts/index/directions/osrm.js      |   8 +-
 vendor/assets/leaflet/leaflet.polyline.js     | 322 ++++++++++++------
 3 files changed, 222 insertions(+), 112 deletions(-)
 mode change 100755 => 100644 vendor/assets/leaflet/leaflet.polyline.js

diff --git a/Vendorfile b/Vendorfile
index 6468d5067..7da31ce46 100644
--- a/Vendorfile
+++ b/Vendorfile
@@ -33,6 +33,10 @@ folder 'vendor/assets' do
     from 'git://github.com/jfirebaugh/leaflet-osm.git' do
       file 'leaflet.osm.js', 'leaflet-osm.js'
     end
+
+    from 'git://github.com/jieter/Leaflet.encoded.git' do
+      file 'leaflet.polyline.js', 'Polyline.encoded.js'
+    end
   end
 
   folder 'ohauth' do
diff --git a/app/assets/javascripts/index/directions/osrm.js b/app/assets/javascripts/index/directions/osrm.js
index 69b78c25e..00ef24d6f 100644
--- a/app/assets/javascripts/index/directions/osrm.js
+++ b/app/assets/javascripts/index/directions/osrm.js
@@ -54,11 +54,9 @@ function OSRMEngine() {
           previousPoints = points;
           hintData = data.hint_data;
 
-          var line = L.PolylineUtil.decode(data.route_geometry);
-          for (var i = 0; i < line.length; i++) {
-            line[i].lat /= 10;
-            line[i].lng /= 10;
-          }
+          var line = L.PolylineUtil.decode(data.route_geometry, {
+            precision: 6
+          });
 
           var steps = [];
           for (i = 0; i < data.route_instructions.length; i++) {
diff --git a/vendor/assets/leaflet/leaflet.polyline.js b/vendor/assets/leaflet/leaflet.polyline.js
old mode 100755
new mode 100644
index b7e85d6c5..5f35ed0de
--- a/vendor/assets/leaflet/leaflet.polyline.js
+++ b/vendor/assets/leaflet/leaflet.polyline.js
@@ -1,127 +1,235 @@
 /*
- * L.PolylineUtil contains utilify functions for polylines, two methods
- * are added to the L.Polyline object to support creation of polylines
- * from an encoded string and converting existing polylines to an
- * encoded string.
+ * Utility functions to decode/encode numbers and array's of numbers
+ * to/from strings (Google maps polyline encoding)
  *
- *  - L.Polyline.fromEncoded(encoded [, options]) returns a L.Polyline
- *  - L.Polyline.encodePath() returns a string
+ * Extends the L.Polyline and L.Polygon object with methods to convert
+ * to and create from these strings.
  *
- * Actual code from:
- * http://facstaff.unca.edu/mcmcclur/GoogleMaps/EncodePolyline/\
+ * Jan Pieter Waagmeester <jieter@jieter.nl>
+ *
+ * Original code from:
+ * http://facstaff.unca.edu/mcmcclur/GoogleMaps/EncodePolyline/
+ * (which is down as of december 2014)
  */
 
-/*jshint browser:true, debug: true, strict:false, globalstrict:false, indent:4, white:true, smarttabs:true*/
-/*global L:true, console:true*/
+(function () {
+	'use strict';
 
-
-// Inject functionality into Leaflet
-(function (L) {
-	if (!(L.Polyline.prototype.fromEncoded)) {
-		L.Polyline.fromEncoded = function (encoded, options) {
-			return new L.Polyline(L.PolylineUtil.decode(encoded), options);
-		};
-	}
-	if (!(L.Polygon.prototype.fromEncoded)) {
-		L.Polygon.fromEncoded = function (encoded, options) {
-			return new L.Polygon(L.PolylineUtil.decode(encoded), options);
-		};
-	}
-
-	var encodeMixin = {
-		encodePath: function () {
-			return L.PolylineUtil.encode(this.getLatLngs());
+	var defaultOptions = function (options) {
+		if (typeof options === 'number') {
+			// Legacy
+			options = { precision: options };
+		} else {
+			options = options || {};
 		}
+
+		options.precision = options.precision || 5;
+		options.factor = options.factor || Math.pow(10, options.precision);
+		options.dimension = options.dimension || 2;
+		return options;
 	};
 
-	if (!L.Polyline.prototype.encodePath) {
-		L.Polyline.include(encodeMixin);
-	}
-	if (!L.Polygon.prototype.encodePath) {
-		L.Polygon.include(encodeMixin);
-	}
-})(L);
+	var PolylineUtil = {
+		encode: function (points, options) {
+			options = defaultOptions(options);
 
-// Utility functions.
-L.PolylineUtil = {};
+			var flatPoints = [];
+			for (var i = 0, len = points.length; i < len; ++i) {
+				var point = points[i];
 
-L.PolylineUtil.encode = function (latlngs) {
-	var i, dlat, dlng;
-	var plat = 0;
-	var plng = 0;
-	var encoded_points = "";
+				if (options.dimension === 2) {
+					flatPoints.push(point.lat || point[0]);
+					flatPoints.push(point.lng || point[1]);
+				} else {
+					for (var dim = 0; dim < options.dimension; ++dim) {
+						flatPoints.push(point[dim]);
+					}
+				}
+			}
 
-	for (i = 0; i < latlngs.length; i++) {
-		var lat = latlngs[i].lat;
-		var lng = latlngs[i].lng;
-		var late5 = Math.floor(lat * 1e5);
-		var lnge5 = Math.floor(lng * 1e5);
-		dlat = late5 - plat;
-		dlng = lnge5 - plng;
-		plat = late5;
-		plng = lnge5;
-		encoded_points +=
-			L.PolylineUtil.encodeSignedNumber(dlat) +
-			L.PolylineUtil.encodeSignedNumber(dlng);
-	}
-	return encoded_points;
-};
+			return this.encodeDeltas(flatPoints, options);
+		},
 
-// This function is very similar to Google's, but I added
-// some stuff to deal with the double slash issue.
-L.PolylineUtil.encodeNumber = function (num) {
-	var encodeString = "";
-	var nextValue, finalValue;
-	while (num >= 0x20) {
-		nextValue = (0x20 | (num & 0x1f)) + 63;
-		encodeString += (String.fromCharCode(nextValue));
-		num >>= 5;
-	}
-	finalValue = num + 63;
-	encodeString += (String.fromCharCode(finalValue));
-	return encodeString;
-};
+		decode: function (encoded, options) {
+			options = defaultOptions(options);
 
-// This one is Google's verbatim.
-L.PolylineUtil.encodeSignedNumber = function (num) {
-	var sgn_num = num << 1;
-	if (num < 0) {
-		sgn_num = ~(sgn_num);
-	}
-	return (L.PolylineUtil.encodeNumber(sgn_num));
-};
+			var flatPoints = this.decodeDeltas(encoded, options);
 
-L.PolylineUtil.decode = function (encoded) {
-	var len = encoded.length;
-	var index = 0;
-	var latlngs = [];
-	var lat = 0;
-	var lng = 0;
+			var points = [];
+			for (var i = 0, len = flatPoints.length; i + (options.dimension - 1) < len;) {
+				var point = [];
 
-	while (index < len) {
-		var b;
-		var shift = 0;
-		var result = 0;
-		do {
-			b = encoded.charCodeAt(index++) - 63;
-			result |= (b & 0x1f) << shift;
-			shift += 5;
-		} while (b >= 0x20);
-		var dlat = ((result & 1) ? ~(result >> 1) : (result >> 1));
-		lat += dlat;
+				for (var dim = 0; dim < options.dimension; ++dim) {
+					point.push(flatPoints[i++]);
+				}
 
-		shift = 0;
-		result = 0;
-		do {
-			b = encoded.charCodeAt(index++) - 63;
-			result |= (b & 0x1f) << shift;
-			shift += 5;
-		} while (b >= 0x20);
-		var dlng = ((result & 1) ? ~(result >> 1) : (result >> 1));
-		lng += dlng;
+				points.push(point);
+			}
 
-		latlngs.push(new L.LatLng(lat * 1e-5, lng * 1e-5));
+			return points;
+		},
+
+		encodeDeltas: function(numbers, options) {
+			options = defaultOptions(options);
+
+			var lastNumbers = [];
+
+			for (var i = 0, len = numbers.length; i < len;) {
+				for (var d = 0; d < options.dimension; ++d, ++i) {
+					var num = numbers[i];
+					var delta = num - (lastNumbers[d] || 0);
+					lastNumbers[d] = num;
+
+					numbers[i] = delta;
+				}
+			}
+
+			return this.encodeFloats(numbers, options);
+		},
+
+		decodeDeltas: function(encoded, options) {
+			options = defaultOptions(options);
+
+			var lastNumbers = [];
+
+			var numbers = this.decodeFloats(encoded, options);
+			for (var i = 0, len = numbers.length; i < len;) {
+				for (var d = 0; d < options.dimension; ++d, ++i) {
+					numbers[i] = lastNumbers[d] = numbers[i] + (lastNumbers[d] || 0);
+				}
+			}
+
+			return numbers;
+		},
+
+		encodeFloats: function(numbers, options) {
+			options = defaultOptions(options);
+
+			for (var i = 0, len = numbers.length; i < len; ++i) {
+				numbers[i] = Math.round(numbers[i] * options.factor);
+			}
+
+			return this.encodeSignedIntegers(numbers);
+		},
+
+		decodeFloats: function(encoded, options) {
+			options = defaultOptions(options);
+
+			var numbers = this.decodeSignedIntegers(encoded);
+			for (var i = 0, len = numbers.length; i < len; ++i) {
+				numbers[i] /= options.factor;
+			}
+
+			return numbers;
+		},
+
+		/* jshint bitwise:false */
+
+		encodeSignedIntegers: function(numbers) {
+			for (var i = 0, len = numbers.length; i < len; ++i) {
+				var num = numbers[i];
+				numbers[i] = (num < 0) ? ~(num << 1) : (num << 1);
+			}
+
+			return this.encodeUnsignedIntegers(numbers);
+		},
+
+		decodeSignedIntegers: function(encoded) {
+			var numbers = this.decodeUnsignedIntegers(encoded);
+
+			for (var i = 0, len = numbers.length; i < len; ++i) {
+				var num = numbers[i];
+				numbers[i] = (num & 1) ? ~(num >> 1) : (num >> 1);
+			}
+
+			return numbers;
+		},
+
+		encodeUnsignedIntegers: function(numbers) {
+			var encoded = '';
+			for (var i = 0, len = numbers.length; i < len; ++i) {
+				encoded += this.encodeUnsignedInteger(numbers[i]);
+			}
+			return encoded;
+		},
+
+		decodeUnsignedIntegers: function(encoded) {
+			var numbers = [];
+
+			var current = 0;
+			var shift = 0;
+
+			for (var i = 0, len = encoded.length; i < len; ++i) {
+				var b = encoded.charCodeAt(i) - 63;
+
+				current |= (b & 0x1f) << shift;
+
+				if (b < 0x20) {
+					numbers.push(current);
+					current = 0;
+					shift = 0;
+				} else {
+					shift += 5;
+				}
+			}
+
+			return numbers;
+		},
+
+		encodeSignedInteger: function (num) {
+			num = (num < 0) ? ~(num << 1) : (num << 1);
+			return this.encodeUnsignedInteger(num);
+		},
+
+		// This function is very similar to Google's, but I added
+		// some stuff to deal with the double slash issue.
+		encodeUnsignedInteger: function (num) {
+			var value, encoded = '';
+			while (num >= 0x20) {
+				value = (0x20 | (num & 0x1f)) + 63;
+				encoded += (String.fromCharCode(value));
+				num >>= 5;
+			}
+			value = num + 63;
+			encoded += (String.fromCharCode(value));
+
+			return encoded;
+		}
+
+		/* jshint bitwise:true */
+	};
+
+	// Export Node module
+	if (typeof module === 'object' && typeof module.exports === 'object') {
+		module.exports = PolylineUtil;
 	}
 
-	return latlngs;
-};
\ No newline at end of file
+	// Inject functionality into Leaflet
+	if (typeof L === 'object') {
+		if (!(L.Polyline.prototype.fromEncoded)) {
+			L.Polyline.fromEncoded = function (encoded, options) {
+				return new L.Polyline(PolylineUtil.decode(encoded), options);
+			};
+		}
+		if (!(L.Polygon.prototype.fromEncoded)) {
+			L.Polygon.fromEncoded = function (encoded, options) {
+				return new L.Polygon(PolylineUtil.decode(encoded), options);
+			};
+		}
+
+		var encodeMixin = {
+			encodePath: function () {
+				return PolylineUtil.encode(this.getLatLngs());
+			}
+		};
+
+		if (!L.Polyline.prototype.encodePath) {
+			L.Polyline.include(encodeMixin);
+		}
+		if (!L.Polygon.prototype.encodePath) {
+			L.Polygon.include(encodeMixin);
+		}
+
+		L.PolylineUtil = PolylineUtil;
+	}
+})();

From 7d32e50e0a6e491a38f55c6748f9ea0bb19038a1 Mon Sep 17 00:00:00 2001
From: Tom Hughes <tom@compton.nu>
Date: Sun, 1 Feb 2015 21:41:06 +0000
Subject: [PATCH 84/88] Extend https support to all three routing engines

---
 app/assets/javascripts/index/directions/graphhopper.js | 6 +++---
 app/assets/javascripts/index/directions/osrm.js        | 4 ++--
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/app/assets/javascripts/index/directions/graphhopper.js b/app/assets/javascripts/index/directions/graphhopper.js
index 8d01bcd16..356de3477 100644
--- a/app/assets/javascripts/index/directions/graphhopper.js
+++ b/app/assets/javascripts/index/directions/graphhopper.js
@@ -19,7 +19,7 @@ function GraphHopperEngine(id, vehicleParam) {
     getRoute: function (points, callback) {
       // documentation
       // https://github.com/graphhopper/graphhopper/blob/master/docs/web/api-doc.md
-      var url = "https://graphhopper.com/api/1/route?"
+      var url = document.location.protocol + "//graphhopper.com/api/1/route?"
         + vehicleParam
         + "&locale=" + I18n.currentLocale()
         + "&key=LijBPDQGfu7Iiq80w3HzwB4RUDJbMbhs6BU0dEnn"
@@ -70,5 +70,5 @@ function GraphHopperEngine(id, vehicleParam) {
   };
 }
 
-OSM.Directions.addEngine(GraphHopperEngine("graphhopper_bicycle", "vehicle=bike"), false);
-OSM.Directions.addEngine(GraphHopperEngine("graphhopper_foot", "vehicle=foot"), false);
+OSM.Directions.addEngine(GraphHopperEngine("graphhopper_bicycle", "vehicle=bike"), true);
+OSM.Directions.addEngine(GraphHopperEngine("graphhopper_foot", "vehicle=foot"), true);
diff --git a/app/assets/javascripts/index/directions/osrm.js b/app/assets/javascripts/index/directions/osrm.js
index 00ef24d6f..05cb32f20 100644
--- a/app/assets/javascripts/index/directions/osrm.js
+++ b/app/assets/javascripts/index/directions/osrm.js
@@ -31,7 +31,7 @@ function OSRMEngine() {
         I18n.t('javascripts.directions.instructions.end_oneway')        // 17
       ];
 
-      var url = "http://router.project-osrm.org/viaroute?z=14&output=json&instructions=true";
+      var url = document.location.protocol + "//router.project-osrm.org/viaroute?z=14&output=json&instructions=true";
 
       for (var i = 0; i < points.length; i++) {
         url += "&loc=" + points[i].lat + ',' + points[i].lng;
@@ -91,4 +91,4 @@ function OSRMEngine() {
   };
 }
 
-OSM.Directions.addEngine(OSRMEngine(), false);
+OSM.Directions.addEngine(OSRMEngine(), true);

From 1add511c52e21492d3dd08b5a86e1f04e73791eb Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Mon, 2 Feb 2015 01:31:08 +0000
Subject: [PATCH 85/88] OSRM and Graphhopper support HTTPS

---
 app/assets/javascripts/index/directions/graphhopper.js | 4 ++--
 app/assets/javascripts/index/directions/osrm.js        | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/index/directions/graphhopper.js b/app/assets/javascripts/index/directions/graphhopper.js
index 8d01bcd16..592be075c 100644
--- a/app/assets/javascripts/index/directions/graphhopper.js
+++ b/app/assets/javascripts/index/directions/graphhopper.js
@@ -70,5 +70,5 @@ function GraphHopperEngine(id, vehicleParam) {
   };
 }
 
-OSM.Directions.addEngine(GraphHopperEngine("graphhopper_bicycle", "vehicle=bike"), false);
-OSM.Directions.addEngine(GraphHopperEngine("graphhopper_foot", "vehicle=foot"), false);
+OSM.Directions.addEngine(GraphHopperEngine("graphhopper_bicycle", "vehicle=bike"), true);
+OSM.Directions.addEngine(GraphHopperEngine("graphhopper_foot", "vehicle=foot"), true);
diff --git a/app/assets/javascripts/index/directions/osrm.js b/app/assets/javascripts/index/directions/osrm.js
index 00ef24d6f..cc2756858 100644
--- a/app/assets/javascripts/index/directions/osrm.js
+++ b/app/assets/javascripts/index/directions/osrm.js
@@ -91,4 +91,4 @@ function OSRMEngine() {
   };
 }
 
-OSM.Directions.addEngine(OSRMEngine(), false);
+OSM.Directions.addEngine(OSRMEngine(), true);

From 6b9e70573bd21631f0e320c3aadecc7e0be70aa0 Mon Sep 17 00:00:00 2001
From: Richard Fairhurst <richard@systemeD.net>
Date: Mon, 2 Feb 2015 01:32:48 +0000
Subject: [PATCH 86/88] Use document.location.protocol for OSRM

---
 app/assets/javascripts/index/directions/osrm.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/javascripts/index/directions/osrm.js b/app/assets/javascripts/index/directions/osrm.js
index cc2756858..05cb32f20 100644
--- a/app/assets/javascripts/index/directions/osrm.js
+++ b/app/assets/javascripts/index/directions/osrm.js
@@ -31,7 +31,7 @@ function OSRMEngine() {
         I18n.t('javascripts.directions.instructions.end_oneway')        // 17
       ];
 
-      var url = "http://router.project-osrm.org/viaroute?z=14&output=json&instructions=true";
+      var url = document.location.protocol + "//router.project-osrm.org/viaroute?z=14&output=json&instructions=true";
 
       for (var i = 0; i < points.length; i++) {
         url += "&loc=" + points[i].lat + ',' + points[i].lng;

From 4cef51bcbe4f0c7cbb8f2a47b88fc7d3db7526e0 Mon Sep 17 00:00:00 2001
From: Tom Hughes <tom@compton.nu>
Date: Sat, 7 Feb 2015 12:02:42 +0000
Subject: [PATCH 87/88] Add basic tests for the directions controller

---
 .../controllers/directions_controller_test.rb | 21 +++++++++++++++++++
 1 file changed, 21 insertions(+)
 create mode 100644 test/controllers/directions_controller_test.rb

diff --git a/test/controllers/directions_controller_test.rb b/test/controllers/directions_controller_test.rb
new file mode 100644
index 000000000..f24c9d205
--- /dev/null
+++ b/test/controllers/directions_controller_test.rb
@@ -0,0 +1,21 @@
+require 'test_helper'
+
+class DirectionsControllerTest < ActionController::TestCase
+
+  ##
+  # test all routes which lead to this controller
+  def test_routes
+    assert_routing(
+      { :path => "/directions", :method => :get },
+      { :controller => "directions", :action => "search" }
+    )
+  end
+
+  ###
+  # test the search action
+  def test_search
+    get :search
+    assert_response :success
+  end
+
+end

From 91dac23254c3674bee23cfd33fbedc2c4380924b Mon Sep 17 00:00:00 2001
From: Dan Stowell <danstowell@users.sourceforge.net>
Date: Sun, 8 Feb 2015 11:11:53 +0000
Subject: [PATCH 88/88] jsrouting: don't close the smallscreen header until
 both geocodes entered

---
 app/assets/javascripts/index/directions.js.erb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/javascripts/index/directions.js.erb b/app/assets/javascripts/index/directions.js.erb
index 72299ea1d..7b1ef3c5b 100644
--- a/app/assets/javascripts/index/directions.js.erb
+++ b/app/assets/javascripts/index/directions.js.erb
@@ -163,6 +163,7 @@ OSM.Directions = function (map) {
         d = endpoints[1].latlng;
 
     if (!o || !d) return;
+    $("header").addClass("closed");
 
     var precision = OSM.zoomPrecision(map.getZoom());
 
@@ -295,7 +296,6 @@ OSM.Directions = function (map) {
 
   $(".directions_form").on("submit", function(e) {
     e.preventDefault();
-    $("header").addClass("closed");
     getRoute();
   });