").append(directionsCloseButton)),
distanceText,
turnByTurnTable
);
@@ -166,8 +170,12 @@ OSM.Directions = function (map) {
route.steps.forEach(function (step) {
const [ll, direction, instruction, dist, lineseg] = step;
- var row = $("
|
");
- row.append("
| ");
+ const row = $("
|
");
+ if (direction) {
+ row.append("
| ");
+ } else {
+ row.append("
");
+ }
row.append(" | " + instruction);
row.append(" | " + getDistText(dist));
@@ -189,21 +197,23 @@ OSM.Directions = function (map) {
turnByTurnTable.append(row);
});
- $("#sidebar_content").append(" " +
+ const blob = new Blob([JSON.stringify(polyline.toGeoJSON())], { type: "application/json" });
+ URL.revokeObjectURL(downloadURL);
+ downloadURL = URL.createObjectURL(blob);
+
+ $("#directions_content").append(` ${
+ I18n.t("javascripts.directions.download")
+ } `);
+
+ $("#directions_content").append("" +
I18n.t("javascripts.directions.instructions.courtesy", { link: chosenEngine.creditline }) +
" ");
-
- directionsCloseButton.on("click", function () {
- map.removeLayer(polyline);
- $("#sidebar_content").html("");
- popup.close();
- map.setSidebarOverlaid(true);
- // TODO: collapse width of sidebar back to previous
- });
}).catch(function () {
map.removeLayer(polyline);
if (reportErrors) {
- $("#sidebar_content").html("" + I18n.t("javascripts.directions.errors.no_route") + " ");
+ $("#directions_content").html("" + I18n.t("javascripts.directions.errors.no_route") + " ");
}
}).finally(function () {
controller = null;
@@ -218,14 +228,26 @@ OSM.Directions = function (map) {
}
}
- var chosenEngineIndex = findEngine("fossgis_osrm_car");
- if (Cookies.get("_osm_directions_engine")) {
- chosenEngineIndex = findEngine(Cookies.get("_osm_directions_engine"));
+ function hideRoute(e) {
+ e.stopPropagation();
+ map.removeLayer(polyline);
+ $("#directions_content").html("");
+ popup.close();
+ map.setSidebarOverlaid(true);
+ // TODO: collapse width of sidebar back to previous
}
- setEngine(chosenEngineIndex);
+
+ setEngine("fossgis_osrm_car");
+ setEngine(Cookies.get("_osm_directions_engine"));
+
+ modeGroup.on("change", "input[name='modes']", function (e) {
+ setEngine(chosenEngine.provider + "_" + e.target.id);
+ Cookies.set("_osm_directions_engine", chosenEngine.id, { secure: true, expires: expiry, path: "/", samesite: "lax" });
+ getRoute(true, true);
+ });
select.on("change", function (e) {
- chosenEngine = engines[e.target.selectedIndex];
+ setEngine(e.target.value + "_" + chosenEngine.mode);
Cookies.set("_osm_directions_engine", chosenEngine.id, { secure: true, expires: expiry, path: "/", samesite: "lax" });
getRoute(true, true);
});
@@ -236,21 +258,43 @@ OSM.Directions = function (map) {
});
$(".routing_marker_column img").on("dragstart", function (e) {
- var dt = e.originalEvent.dataTransfer;
+ const dt = e.originalEvent.dataTransfer;
dt.effectAllowed = "move";
- var dragData = { type: $(this).data("type") };
+ const dragData = { type: $(this).data("type") };
dt.setData("text", JSON.stringify(dragData));
if (dt.setDragImage) {
- var img = $("![]() ").attr("src", $(e.originalEvent.target).attr("src"));
+ const img = $("![]() ").attr("src", $(e.originalEvent.target).attr("src"));
dt.setDragImage(img.get(0), 12, 21);
}
});
- var page = {};
+ function sendstartinglocation({ latlng: { lat, lng } }) {
+ map.fire("startinglocation", { latlng: [lat, lng] });
+ }
- page.pushstate = page.popstate = function () {
- $(".search_form").hide();
- $(".directions_form").show();
+ function startingLocationListener({ latlng }) {
+ if (endpoints[0].value) return;
+ endpoints[0].setValue(latlng.join(", "));
+ }
+
+ map.on("locationfound", ({ latlng: { lat, lng } }) =>
+ lastLocation = [lat, lng]
+ ).on("locateactivate", () => {
+ map.once("startinglocation", startingLocationListener);
+ });
+
+ function initializeFromParams() {
+ const params = new URLSearchParams(location.search),
+ route = (params.get("route") || "").split(";");
+
+ if (params.has("engine")) setEngine(params.get("engine"));
+
+ endpoints[0].setValue(params.get("from") || route[0] || lastLocation.join(", "));
+ endpoints[1].setValue(params.get("to") || route[1] || "");
+ }
+
+ function enableListeners() {
+ $("#sidebar_content").on("click", ".btn-close", hideRoute);
$("#map").on("dragend dragover", function (e) {
e.preventDefault();
@@ -258,47 +302,63 @@ OSM.Directions = function (map) {
$("#map").on("drop", function (e) {
e.preventDefault();
- var oe = e.originalEvent;
- 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
+ const oe = e.originalEvent;
+ const dragData = JSON.parse(oe.dataTransfer.getData("text"));
+ const type = dragData.type;
+ const pt = L.DomEvent.getMousePosition(oe, map.getContainer()); // co-ordinates of the mouse pointer at present
pt.y += 20;
- var ll = map.containerPointToLatLng(pt);
+ const ll = map.containerPointToLatLng(pt);
const llWithPrecision = OSM.cropLocation(ll, map.getZoom());
endpoints[type === "from" ? 0 : 1].setValue(llWithPrecision.join(", "));
});
- endpoints[0].enable();
- endpoints[1].enable();
+ map.on("locationfound", sendstartinglocation);
- const params = new URLSearchParams(location.search),
- route = (params.get("route") || "").split(";");
+ endpoints[0].enableListeners();
+ endpoints[1].enableListeners();
+ }
- if (params.has("engine")) {
- var engineIndex = findEngine(params.get("engine"));
+ const page = {};
- if (engineIndex >= 0) {
- setEngine(engineIndex);
- }
- }
+ page.pushstate = page.popstate = function () {
+ if ($("#directions_content").length) {
+ page.load();
+ } else {
+ initializeFromParams();
- endpoints[0].setValue(params.get("from") || route[0] || "");
- endpoints[1].setValue(params.get("to") || route[1] || "");
+ $(".search_form").hide();
+ $(".directions_form").show();
- map.setSidebarOverlaid(!endpoints[0].latlng || !endpoints[1].latlng);
+ OSM.loadSidebarContent("/directions", enableListeners);
+
+ map.setSidebarOverlaid(!endpoints[0].latlng || !endpoints[1].latlng);
+ }
};
page.load = function () {
- page.pushstate();
+ initializeFromParams();
+
+ $(".search_form").hide();
+ $(".directions_form").show();
+
+ enableListeners();
+
+ map.setSidebarOverlaid(!endpoints[0].latlng || !endpoints[1].latlng);
};
page.unload = function () {
$(".search_form").show();
$(".directions_form").hide();
+
+ $("#sidebar_content").off("click", ".btn-close", hideRoute);
$("#map").off("dragend dragover drop");
+ map.off("locationfound", sendstartinglocation);
+
+ endpoints[0].disableListeners();
+ endpoints[1].disableListeners();
- endpoints[0].disable();
- endpoints[1].disable();
+ endpoints[0].clearValue();
+ endpoints[1].clearValue();
map
.removeLayer(popup)
@@ -311,7 +371,8 @@ OSM.Directions = function (map) {
OSM.Directions.engines = [];
OSM.Directions.addEngine = function (engine, supportsHTTPS) {
- if (document.location.protocol === "http:" || supportsHTTPS) {
+ if (location.protocol === "http:" || supportsHTTPS) {
+ engine.id = engine.provider + "_" + engine.mode;
OSM.Directions.engines.push(engine);
}
};
|