").append(directionsCloseButton)),
+ distanceText,
+ turnByTurnTable
+ );
// 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;
+ var ll = step[0],
+ direction = step[1],
+ instruction = step[2],
+ dist = step[3],
+ lineseg = step[4];
if (dist < 5) {
dist = "";
} else if (dist < 200) {
- dist = Math.round(dist / 10) * 10 + "m";
+ dist = String(Math.round(dist / 10) * 10) + "m";
} else if (dist < 1500) {
- dist = Math.round(dist / 100) * 100 + "m";
+ dist = String(Math.round(dist / 100) * 100) + "m";
} else if (dist < 5000) {
- dist = Math.round(dist / 100) / 10 + "km";
+ dist = String(Math.round(dist / 100) / 10) + "km";
} else {
- dist = Math.round(dist / 1000) + "km";
+ dist = String(Math.round(dist / 1000)) + "km";
}
var row = $("
|
");
- row.append("
| ");
- row.append("
" + instruction);
- row.append(" | " + dist);
+ row.append(" | | ");
+ row.append("
" + instruction);
+ row.append(" | " + dist);
- row.on('click', function () {
+ row.on("click", function () {
popup
.setLatLng(ll)
.setContent(" " + instruction + " ")
@@ -254,116 +234,100 @@ OSM.Directions = function (map) {
map.removeLayer(highlight);
});
- $('#turnbyturn').append(row);
+ turnByTurnTable.append(row);
});
- $('#sidebar_content').append('' +
- I18n.t('javascripts.directions.instructions.courtesy', {link: chosenEngine.creditline}) +
- ' ');
+ $("#sidebar_content").append("" +
+ I18n.t("javascripts.directions.instructions.courtesy", { link: chosenEngine.creditline }) +
+ " ");
- $('#sidebar_content a.geolink').on('click', function(e) {
- e.preventDefault();
+ directionsCloseButton.on("click", function () {
map.removeLayer(polyline);
- $('#sidebar_content').html('');
+ $("#sidebar_content").html("");
map.setSidebarOverlaid(true);
// TODO: collapse width of sidebar back to previous
});
});
}
- 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("");
- });
-
- setEngine('osrm_car');
+ var chosenEngineIndex = findEngine("fossgis_osrm_car");
+ if (Cookies.get("_osm_directions_engine")) {
+ chosenEngineIndex = findEngine(Cookies.get("_osm_directions_engine"));
+ }
+ setEngine(chosenEngineIndex);
select.on("change", function (e) {
chosenEngine = engines[e.target.selectedIndex];
- if (map.hasLayer(polyline)) {
- getRoute();
- }
+ Cookies.set("_osm_directions_engine", chosenEngine.id, { secure: true, expires: expiry, path: "/", samesite: "lax" });
+ getRoute(true, true);
});
- $(".directions_form").on("submit", function(e) {
+ $(".directions_form").on("submit", function (e) {
e.preventDefault();
- getRoute();
+ getRoute(true, true);
});
- $(".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);
+ $(".routing_marker_column img").on("dragstart", function (e) {
+ var dt = e.originalEvent.dataTransfer;
+ dt.effectAllowed = "move";
+ var dragData = { type: $(this).data("type") };
+ dt.setData("text", JSON.stringify(dragData));
+ if (dt.setDragImage) {
+ var img = $("![]() ").attr("src", $(e.originalEvent.target).attr("src"));
+ dt.setDragImage(img.get(0), 12, 21);
+ }
});
var page = {};
- page.pushstate = page.popstate = function() {
+ page.pushstate = page.popstate = function () {
$(".search_form").hide();
$(".directions_form").show();
- $("#map").on('dragend dragover', function (e) {
+ $("#map").on("dragend dragover", function (e) {
e.preventDefault();
});
- $("#map").on('drop', function (e) {
+ $("#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 dragData = JSON.parse(oe.dataTransfer.getData("text"));
+ var type = dragData.type;
+ var pt = L.DomEvent.getMousePosition(oe, map.getContainer()); // co-ordinates of the mouse pointer at present
+ pt.y += 20;
var ll = map.containerPointToLatLng(pt);
- endpoints[id === 'marker_from' ? 0 : 1].setLatLng(ll);
- getRoute();
+ var precision = OSM.zoomPrecision(map.getZoom());
+ var value = ll.lat.toFixed(precision) + ", " + ll.lng.toFixed(precision);
+ endpoints[type === "from" ? 0 : 1].setValue(value, ll);
});
- var params = querystring.parse(location.search.substring(1)),
- route = (params.route || '').split(';');
+ var params = Qs.parse(location.search.substring(1)),
+ route = (params.route || "").split(";"),
+ from = route[0] && L.latLng(route[0].split(",")),
+ to = route[1] && L.latLng(route[1].split(","));
if (params.engine) {
- setEngine(params.engine);
- }
+ var engineIndex = findEngine(params.engine);
- if (params.from) {
- endpoints[0].setValue(params.from);
- endpoints[1].setValue("");
- } else {
- endpoints[0].setValue("");
- endpoints[1].setValue("");
+ if (engineIndex >= 0) {
+ setEngine(engineIndex);
+ }
}
- 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);
+ endpoints[0].setValue(params.from || "", from);
+ endpoints[1].setValue(params.to || "", to);
- getRoute();
+ map.setSidebarOverlaid(!from || !to);
};
- page.load = function() {
+ page.load = function () {
page.pushstate();
};
- page.unload = function() {
+ page.unload = function () {
$(".search_form").show();
$(".directions_form").hide();
- $("#map").off('dragend dragover drop');
+ $("#map").off("dragend dragover drop");
map
.removeLayer(popup)
|