cst1/openstreetmap-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Replace uses of var with let or const as appropriate

Browse source
This commit is contained in:
Tom Hughes 2025-01-26 19:06:27 +00:00
parent f83424aeb2
commit c47cb299a8
36 changed files with 427 additions and 430 deletions
Download patch file Download diff file Expand all files Collapse all files

4
app/assets/javascripts/application.js
View file

@ -76,7 +76,7 @@ window.updateLinks = function (loc, zoom, layers, object) {
// Disable the button group and also the buttons to avoid // Disable the button group and also the buttons to avoid
// inconsistent behaviour when zooming // inconsistent behaviour when zooming
var editDisabled = zoom < 13; const editDisabled = zoom < 13;
$("#edit_tab") $("#edit_tab")
.tooltip({ placement: "bottom" }) .tooltip({ placement: "bottom" })
.tooltip(editDisabled ? "enable" : "disable") .tooltip(editDisabled ? "enable" : "disable")
@ -97,7 +97,7 @@ $(document).ready(function () {
let moreItemWidth = 0; let moreItemWidth = 0;
function updateHeader() { function updateHeader() {
var windowWidth = $(window).width(); const windowWidth = $(window).width();
if (windowWidth < breakpointWidth) { if (windowWidth < breakpointWidth) {
$("body").addClass("small-nav"); $("body").addClass("small-nav");

8
app/assets/javascripts/diary_entry.js
View file

@ -1,5 +1,5 @@
$(document).ready(function () { $(document).ready(function () {
var marker, map; let marker, map;
function setLocation(e) { function setLocation(e) {
const latlng = e.latlng.wrap(); const latlng = e.latlng.wrap();
@ -21,9 +21,9 @@ $(document).ready(function () {
$("#map").show(); $("#map").show();
$("#usemap").hide(); $("#usemap").hide();
var params = $("#map").data(); const params = $("#map").data();
var centre = [params.lat, params.lon]; const centre = [params.lat, params.lon];
var position = $("html").attr("dir") === "rtl" ? "topleft" : "topright"; const position = $("html").attr("dir") === "rtl" ? "topleft" : "topright";
map = L.map("map", { map = L.map("map", {
attributionControl: false, attributionControl: false,

4
app/assets/javascripts/embed.js.erb
View file

@ -32,7 +32,7 @@ window.onload = function () {
<% end %> <% end %>
}; };
var map = L.map("map"); const map = L.map("map");
map.attributionControl.setPrefix(""); map.attributionControl.setPrefix("");
map.removeControl(map.attributionControl); map.removeControl(map.attributionControl);
@ -80,7 +80,7 @@ L.Control.OSMReportAProblem = L.Control.Attribution.extend({
}, },
onAdd: function (map) { onAdd: function (map) {
var container = L.Control.Attribution.prototype.onAdd.call(this, map); const container = L.Control.Attribution.prototype.onAdd.call(this, map);
map.on("moveend", this._update, this); map.on("moveend", this._update, this);

4
app/assets/javascripts/fixthemap.js
View file

@ -1,7 +1,7 @@
$(document).ready(function () { $(document).ready(function () {
var params = OSM.params(); const params = OSM.params();
var url = "/note/new"; let url = "/note/new";
if (!params.zoom) params.zoom = 17; if (!params.zoom) params.zoom = 17;
if (params.lat && params.lon) url += OSM.formatHash(params); if (params.lat && params.lon) url += OSM.formatHash(params);
$(".icon.note").attr("href", url); $(".icon.note").attr("href", url);

22
app/assets/javascripts/id.js
View file

@ -3,7 +3,7 @@
/* globals iD */ /* globals iD */
document.addEventListener("DOMContentLoaded", function () { document.addEventListener("DOMContentLoaded", function () {
var container = document.getElementById("id-container"); const container = document.getElementById("id-container");
if (typeof iD === "undefined" || !iD.utilDetect().support) { if (typeof iD === "undefined" || !iD.utilDetect().support) {
container.innerHTML = "This editor is supported " + container.innerHTML = "This editor is supported " +
@ -11,16 +11,16 @@ document.addEventListener("DOMContentLoaded", function () {
"Please upgrade your browser or use JOSM to edit the map."; "Please upgrade your browser or use JOSM to edit the map.";
container.className = "unsupported"; container.className = "unsupported";
} else { } else {
var idContext = iD.coreContext(); const idContext = iD.coreContext();
idContext.connection().apiConnections([]); idContext.connection().apiConnections([]);
var url = location.protocol + "//" + location.host; const url = location.protocol + "//" + location.host;
idContext.preauth({ idContext.preauth({
url: url, url: url,
apiUrl: url === "https://www.openstreetmap.org" ? "https://api.openstreetmap.org" : url, apiUrl: url === "https://www.openstreetmap.org" ? "https://api.openstreetmap.org" : url,
access_token: container.dataset.token access_token: container.dataset.token
}); });
var id = idContext const id = idContext
.embed(true) .embed(true)
.assetPath("iD/") .assetPath("iD/")
.assetMap(JSON.parse(container.dataset.assetMap)) .assetMap(JSON.parse(container.dataset.assetMap))
@ -33,18 +33,18 @@ document.addEventListener("DOMContentLoaded", function () {
return; return;
} }
var hashChangedAutomatically = false; let hashChangedAutomatically = false;
id.map().on("move.embed", parent.$.throttle(250, function () { id.map().on("move.embed", parent.$.throttle(250, function () {
if (id.inIntro()) return; if (id.inIntro()) return;
var zoom = ~~id.map().zoom(), const zoom = ~~id.map().zoom(),
center = id.map().center(), center = id.map().center(),
llz = { lon: center[0], lat: center[1], zoom: zoom }; llz = { lon: center[0], lat: center[1], zoom: zoom };
parent.updateLinks(llz, zoom); parent.updateLinks(llz, zoom);
// Manually resolve URL to avoid iframe JS context weirdness. // Manually resolve URL to avoid iframe JS context weirdness.
// https://gist.github.com/jfirebaugh/5439412 // https://gist.github.com/jfirebaugh/5439412
var hash = parent.OSM.formatHash(llz); const hash = parent.OSM.formatHash(llz);
if (hash !== parent.location.hash) { if (hash !== parent.location.hash) {
hashChangedAutomatically = true; hashChangedAutomatically = true;
parent.location.replace(parent.location.href.replace(/(#.*|$)/, hash)); parent.location.replace(parent.location.href.replace(/(#.*|$)/, hash));
@ -63,7 +63,7 @@ document.addEventListener("DOMContentLoaded", function () {
parent.$("body").on("click", "a.set_position", function (e) { parent.$("body").on("click", "a.set_position", function (e) {
e.preventDefault(); e.preventDefault();
var data = parent.$(this).data(); const data = parent.$(this).data();
goToLocation(data); goToLocation(data);
}); });
@ -73,7 +73,7 @@ document.addEventListener("DOMContentLoaded", function () {
return; return;
} }
e.preventDefault(); e.preventDefault();
var data = parent.OSM.mapParams(); const data = parent.OSM.mapParams();
goToLocation(data); goToLocation(data);
}); });
} }

50
app/assets/javascripts/index.js
View file

@ -25,7 +25,7 @@
//= require router //= require router
$(document).ready(function () { $(document).ready(function () {
var map = new L.OSM.Map("map", { const map = new L.OSM.Map("map", {
zoomControl: false, zoomControl: false,
layerControl: false, layerControl: false,
contextmenu: true, contextmenu: true,
@ -33,7 +33,7 @@ $(document).ready(function () {
}); });
OSM.loadSidebarContent = function (path, callback) { OSM.loadSidebarContent = function (path, callback) {
var content_path = path; let content_path = path;
map.setSidebarOverlaid(false); map.setSidebarOverlaid(false);
@ -78,7 +78,7 @@ $(document).ready(function () {
}); });
}; };
var params = OSM.mapParams(); const params = OSM.mapParams();
map.attributionControl.setPrefix(""); map.attributionControl.setPrefix("");
@ -90,19 +90,19 @@ $(document).ready(function () {
} }
}); });
var sidebar = L.OSM.sidebar("#map-ui") const sidebar = L.OSM.sidebar("#map-ui")
.addTo(map); .addTo(map);
var position = $("html").attr("dir") === "rtl" ? "topleft" : "topright"; const position = $("html").attr("dir") === "rtl" ? "topleft" : "topright";
function addControlGroup(controls) { function addControlGroup(controls) {
for (const control of controls) control.addTo(map); for (const control of controls) control.addTo(map);
var firstContainer = controls[0].getContainer(); const firstContainer = controls[0].getContainer();
$(firstContainer).find(".control-button").first() $(firstContainer).find(".control-button").first()
.addClass("control-button-first"); .addClass("control-button-first");
var lastContainer = controls[controls.length - 1].getContainer(); const lastContainer = controls[controls.length - 1].getContainer();
$(lastContainer).find(".control-button").last() $(lastContainer).find(".control-button").last()
.addClass("control-button-last"); .addClass("control-button-last");
} }
@ -166,7 +166,7 @@ $(document).ready(function () {
$(".leaflet-control .control-button").tooltip({ placement: "left", container: "body" }); $(".leaflet-control .control-button").tooltip({ placement: "left", container: "body" });
var expiry = new Date(); const expiry = new Date();
expiry.setYear(expiry.getFullYear() + 10); expiry.setYear(expiry.getFullYear() + 10);
map.on("moveend baselayerchange overlayadd overlayremove", function () { map.on("moveend baselayerchange overlayadd overlayremove", function () {
@ -188,11 +188,11 @@ $(document).ready(function () {
Cookies.set("_osm_welcome", "hide", { secure: true, expires: expiry, path: "/", samesite: "lax" }); Cookies.set("_osm_welcome", "hide", { secure: true, expires: expiry, path: "/", samesite: "lax" });
}); });
var bannerExpiry = new Date(); const bannerExpiry = new Date();
bannerExpiry.setYear(bannerExpiry.getFullYear() + 1); bannerExpiry.setYear(bannerExpiry.getFullYear() + 1);
$("#banner .btn-close").on("click", function (e) { $("#banner .btn-close").on("click", function (e) {
var cookieId = e.target.id; const cookieId = e.target.id;
$("#banner").hide(); $("#banner").hide();
e.preventDefault(); e.preventDefault();
if (cookieId) { if (cookieId) {
@ -203,7 +203,7 @@ $(document).ready(function () {
if (OSM.MATOMO) { if (OSM.MATOMO) {
map.on("baselayerchange overlayadd", function (e) { map.on("baselayerchange overlayadd", function (e) {
if (e.layer.options) { if (e.layer.options) {
var goal = OSM.MATOMO.goals[e.layer.options.layerId]; const goal = OSM.MATOMO.goals[e.layer.options.layerId];
if (goal) { if (goal) {
$("body").trigger("matomogoal", goal); $("body").trigger("matomogoal", goal);
@ -223,14 +223,14 @@ $(document).ready(function () {
} }
function remoteEditHandler(bbox, object) { function remoteEditHandler(bbox, object) {
var remoteEditHost = "http://127.0.0.1:8111", const remoteEditHost = "http://127.0.0.1:8111",
osmHost = location.protocol + "//" + location.host, osmHost = location.protocol + "//" + location.host,
query = new URLSearchParams({ query = new URLSearchParams({
left: bbox.getWest() - 0.0001, left: bbox.getWest() - 0.0001,
top: bbox.getNorth() + 0.0001, top: bbox.getNorth() + 0.0001,
right: bbox.getEast() + 0.0001, right: bbox.getEast() + 0.0001,
bottom: bbox.getSouth() - 0.0001 bottom: bbox.getSouth() - 0.0001
}); });
if (object && object.type !== "note") query.set("select", object.type + object.id); // can't select notes if (object && object.type !== "note") query.set("select", object.type + object.id); // can't select notes
sendRemoteEditCommand(remoteEditHost + "/load_and_zoom?" + query, function () { sendRemoteEditCommand(remoteEditHost + "/load_and_zoom?" + query, function () {
@ -253,7 +253,7 @@ $(document).ready(function () {
} }
$("a[data-editor=remote]").click(function (e) { $("a[data-editor=remote]").click(function (e) {
var params = OSM.mapParams(this.search); const params = OSM.mapParams(this.search);
remoteEditHandler(map.getBounds(), params.object); remoteEditHandler(map.getBounds(), params.object);
e.preventDefault(); e.preventDefault();
}); });
@ -273,7 +273,7 @@ $(document).ready(function () {
} }
OSM.Index = function (map) { OSM.Index = function (map) {
var page = {}; const page = {};
page.pushstate = page.popstate = function () { page.pushstate = page.popstate = function () {
map.setSidebarOverlaid(true); map.setSidebarOverlaid(true);
@ -295,7 +295,7 @@ $(document).ready(function () {
}; };
OSM.Browse = function (map, type) { OSM.Browse = function (map, type) {
var page = {}; const page = {};
page.pushstate = page.popstate = function (path, id) { page.pushstate = page.popstate = function (path, id) {
OSM.loadSidebarContent(path, function () { OSM.loadSidebarContent(path, function () {
@ -308,7 +308,7 @@ $(document).ready(function () {
}; };
function addObject(type, id, center) { function addObject(type, id, center) {
var hashParams = OSM.parseHash(window.location.hash); const hashParams = OSM.parseHash(window.location.hash);
map.addObject({ type: type, id: parseInt(id, 10) }, function (bounds) { map.addObject({ type: type, id: parseInt(id, 10) }, function (bounds) {
if (!hashParams.center && bounds.isValid() && if (!hashParams.center && bounds.isValid() &&
(center || !map.getBounds().contains(bounds))) { (center || !map.getBounds().contains(bounds))) {
@ -327,7 +327,7 @@ $(document).ready(function () {
}; };
OSM.OldBrowse = function () { OSM.OldBrowse = function () {
var page = {}; const page = {};
page.pushstate = page.popstate = function (path) { page.pushstate = page.popstate = function (path) {
OSM.loadSidebarContent(path); OSM.loadSidebarContent(path);
@ -336,7 +336,7 @@ $(document).ready(function () {
return page; return page;
}; };
var history = OSM.History(map); const history = OSM.History(map);
OSM.router = OSM.Router(map, { OSM.router = OSM.Router(map, {
"/": OSM.Index(map), "/": OSM.Index(map),

12
app/assets/javascripts/index/changeset.js
View file

@ -1,6 +1,6 @@
OSM.Changeset = function (map) { OSM.Changeset = function (map) {
var page = {}, const page = {},
content = $("#sidebar_content"); content = $("#sidebar_content");
page.pushstate = page.popstate = function (path) { page.pushstate = page.popstate = function (path) {
OSM.loadSidebarContent(path, function () { OSM.loadSidebarContent(path, function () {
@ -12,7 +12,7 @@ OSM.Changeset = function (map) {
const changesetData = content.find("[data-changeset]").data("changeset"); const changesetData = content.find("[data-changeset]").data("changeset");
changesetData.type = "changeset"; changesetData.type = "changeset";
var hashParams = OSM.parseHash(window.location.hash); const hashParams = OSM.parseHash(window.location.hash);
initialize(); initialize();
map.addObject(changesetData, function (bounds) { map.addObject(changesetData, function (bounds) {
if (!hashParams.center && bounds.isValid()) { if (!hashParams.center && bounds.isValid()) {
@ -24,7 +24,7 @@ OSM.Changeset = function (map) {
}; };
function updateChangeset(method, url, include_data) { function updateChangeset(method, url, include_data) {
var data; let data;
content.find("#comment-error").prop("hidden", true); content.find("#comment-error").prop("hidden", true);
content.find("button[data-method][data-url]").prop("disabled", true); content.find("button[data-method][data-url]").prop("disabled", true);
@ -56,8 +56,8 @@ OSM.Changeset = function (map) {
function initialize() { function initialize() {
content.find("button[data-method][data-url]").on("click", function (e) { content.find("button[data-method][data-url]").on("click", function (e) {
e.preventDefault(); e.preventDefault();
var data = $(e.target).data(); const data = $(e.target).data();
var include_data = e.target.name === "comment"; const include_data = e.target.name === "comment";
updateChangeset(data.method, data.url, include_data); updateChangeset(data.method, data.url, include_data);
}); });

2
app/assets/javascripts/index/contextmenu.js
View file

@ -69,7 +69,7 @@ OSM.initializeContextMenu = function (map) {
return $(input).val(); return $(input).val();
} }
var updateMenu = function updateMenu() { const updateMenu = function updateMenu() {
map.contextmenu.setDisabled(2, map.getZoom() < 12); map.contextmenu.setDisabled(2, map.getZoom() < 12);
map.contextmenu.setDisabled(4, map.getZoom() < 14); map.contextmenu.setDisabled(4, map.getZoom() < 14);
}; };

12
app/assets/javascripts/index/directions-endpoint.js
View file

@ -1,5 +1,5 @@
OSM.DirectionsEndpoint = function Endpoint(map, input, iconUrl, dragCallback, changeCallback) { OSM.DirectionsEndpoint = function Endpoint(map, input, iconUrl, dragCallback, changeCallback) {
var endpoint = {}; const endpoint = {};
endpoint.marker = L.marker([0, 0], { endpoint.marker = L.marker([0, 0], {
icon: L.icon({ icon: L.icon({
@ -52,7 +52,7 @@ OSM.DirectionsEndpoint = function Endpoint(map, input, iconUrl, dragCallback, ch
function inputChangeListener(e) { function inputChangeListener(e) {
// make text the same in both text boxes // make text the same in both text boxes
var value = e.target.value; const value = e.target.value;
endpoint.setValue(value); endpoint.setValue(value);
} }
@ -61,8 +61,8 @@ OSM.DirectionsEndpoint = function Endpoint(map, input, iconUrl, dragCallback, ch
delete endpoint.geocodeRequest; delete endpoint.geocodeRequest;
input.removeClass("is-invalid"); input.removeClass("is-invalid");
var coordinatesMatch = value.match(/^\s*([+-]?\d+(?:\.\d*)?)(?:\s+|\s*[/,]\s*)([+-]?\d+(?:\.\d*)?)\s*$/); const coordinatesMatch = value.match(/^\s*([+-]?\d+(?:\.\d*)?)(?:\s+|\s*[/,]\s*)([+-]?\d+(?:\.\d*)?)\s*$/);
var latlng = coordinatesMatch && L.latLng(coordinatesMatch[1], coordinatesMatch[2]); const latlng = coordinatesMatch && L.latLng(coordinatesMatch[1], coordinatesMatch[2]);
if (latlng && endpoint.cachedReverseGeocode && endpoint.cachedReverseGeocode.latlng.equals(latlng)) { if (latlng && endpoint.cachedReverseGeocode && endpoint.cachedReverseGeocode.latlng.equals(latlng)) {
setLatLng(latlng); setLatLng(latlng);
@ -92,8 +92,8 @@ OSM.DirectionsEndpoint = function Endpoint(map, input, iconUrl, dragCallback, ch
}; };
endpoint.swapCachedReverseGeocodes = function (otherEndpoint) { endpoint.swapCachedReverseGeocodes = function (otherEndpoint) {
var g0 = endpoint.cachedReverseGeocode; const g0 = endpoint.cachedReverseGeocode;
var g1 = otherEndpoint.cachedReverseGeocode; const g1 = otherEndpoint.cachedReverseGeocode;
delete endpoint.cachedReverseGeocode; delete endpoint.cachedReverseGeocode;
delete otherEndpoint.cachedReverseGeocode; delete otherEndpoint.cachedReverseGeocode;
if (g0) otherEndpoint.cachedReverseGeocode = g0; if (g0) otherEndpoint.cachedReverseGeocode = g0;

64
app/assets/javascripts/index/directions.js
View file

@ -4,59 +4,59 @@
OSM.Directions = function (map) { OSM.Directions = function (map) {
let controller = null; // the AbortController for the current route request if a route request is in progress let controller = null; // the AbortController for the current route request if a route request is in progress
var chosenEngine; let chosenEngine;
var popup = L.popup({ autoPanPadding: [100, 100] }); const popup = L.popup({ autoPanPadding: [100, 100] });
var polyline = L.polyline([], { const polyline = L.polyline([], {
color: "#03f", color: "#03f",
opacity: 0.3, opacity: 0.3,
weight: 10 weight: 10
}); });
var highlight = L.polyline([], { const highlight = L.polyline([], {
color: "#ff0", color: "#ff0",
opacity: 0.5, opacity: 0.5,
weight: 12 weight: 12
}); });
var endpointDragCallback = function (dragging) { const endpointDragCallback = function (dragging) {
if (!map.hasLayer(polyline)) return; if (!map.hasLayer(polyline)) return;
if (dragging && !chosenEngine.draggable) return; if (dragging && !chosenEngine.draggable) return;
if (dragging && controller) return; if (dragging && controller) return;
getRoute(false, !dragging); getRoute(false, !dragging);
}; };
var endpointChangeCallback = function () { const endpointChangeCallback = function () {
getRoute(true, true); getRoute(true, true);
}; };
var endpoints = [ const endpoints = [
OSM.DirectionsEndpoint(map, $("input[name='route_from']"), OSM.MARKER_GREEN, endpointDragCallback, endpointChangeCallback), OSM.DirectionsEndpoint(map, $("input[name='route_from']"), OSM.MARKER_GREEN, endpointDragCallback, endpointChangeCallback),
OSM.DirectionsEndpoint(map, $("input[name='route_to']"), OSM.MARKER_RED, endpointDragCallback, endpointChangeCallback) OSM.DirectionsEndpoint(map, $("input[name='route_to']"), OSM.MARKER_RED, endpointDragCallback, endpointChangeCallback)
]; ];
var expiry = new Date(); const expiry = new Date();
expiry.setYear(expiry.getFullYear() + 10); expiry.setYear(expiry.getFullYear() + 10);
var engines = OSM.Directions.engines; const engines = OSM.Directions.engines;
engines.sort(function (a, b) { engines.sort(function (a, b) {
var localised_a = I18n.t("javascripts.directions.engines." + a.id), const localised_a = I18n.t("javascripts.directions.engines." + a.id),
localised_b = I18n.t("javascripts.directions.engines." + b.id); localised_b = I18n.t("javascripts.directions.engines." + b.id);
return localised_a.localeCompare(localised_b); return localised_a.localeCompare(localised_b);
}); });
var select = $("select.routing_engines"); const select = $("select.routing_engines");
engines.forEach(function (engine, i) { engines.forEach(function (engine, i) {
select.append("<option value='" + i + "'>" + I18n.t("javascripts.directions.engines." + engine.id) + "</option>"); select.append("<option value='" + i + "'>" + I18n.t("javascripts.directions.engines." + engine.id) + "</option>");
}); });
$(".directions_form .reverse_directions").on("click", function () { $(".directions_form .reverse_directions").on("click", function () {
var coordFrom = endpoints[0].latlng, const coordFrom = endpoints[0].latlng,
coordTo = endpoints[1].latlng, coordTo = endpoints[1].latlng;
routeFrom = "", let routeFrom = "",
routeTo = ""; routeTo = "";
if (coordFrom) { if (coordFrom) {
routeFrom = coordFrom.lat + "," + coordFrom.lng; routeFrom = coordFrom.lat + "," + coordFrom.lng;
@ -90,8 +90,8 @@ OSM.Directions = function (map) {
} }
function formatTime(s) { function formatTime(s) {
var m = Math.round(s / 60); let m = Math.round(s / 60);
var h = Math.floor(m / 60); const h = Math.floor(m / 60);
m -= h * 60; m -= h * 60;
return h + ":" + (m < 10 ? "0" : "") + m; return h + ":" + (m < 10 ? "0" : "") + m;
} }
@ -136,7 +136,7 @@ OSM.Directions = function (map) {
map.fitBounds(polyline.getBounds().pad(0.05)); map.fitBounds(polyline.getBounds().pad(0.05));
} }
var distanceText = $("<p>").append( const distanceText = $("<p>").append(
I18n.t("javascripts.directions.distance") + ": " + formatDistance(route.distance) + ". " + I18n.t("javascripts.directions.distance") + ": " + formatDistance(route.distance) + ". " +
I18n.t("javascripts.directions.time") + ": " + formatTime(route.time) + "."); I18n.t("javascripts.directions.time") + ": " + formatTime(route.time) + ".");
if (typeof route.ascend !== "undefined" && typeof route.descend !== "undefined") { if (typeof route.ascend !== "undefined" && typeof route.descend !== "undefined") {
@ -146,9 +146,9 @@ OSM.Directions = function (map) {
I18n.t("javascripts.directions.descend") + ": " + formatHeight(route.descend) + "."); I18n.t("javascripts.directions.descend") + ": " + formatHeight(route.descend) + ".");
} }
var turnByTurnTable = $("<table class='table table-hover table-sm mb-3'>") const turnByTurnTable = $("<table class='table table-hover table-sm mb-3'>")
.append($("<tbody>")); .append($("<tbody>"));
var directionsCloseButton = $("<button type='button' class='btn-close'>") const directionsCloseButton = $("<button type='button' class='btn-close'>")
.attr("aria-label", I18n.t("javascripts.close")); .attr("aria-label", I18n.t("javascripts.close"));
$("#sidebar_content") $("#sidebar_content")
@ -166,7 +166,7 @@ OSM.Directions = function (map) {
route.steps.forEach(function (step) { route.steps.forEach(function (step) {
const [ll, direction, instruction, dist, lineseg] = step; const [ll, direction, instruction, dist, lineseg] = step;
var row = $("<tr class='turn'/>"); const row = $("<tr class='turn'/>");
row.append("<td class='border-0'><div class='direction i" + direction + "'/></td> "); row.append("<td class='border-0'><div class='direction i" + direction + "'/></td> ");
row.append("<td>" + instruction); row.append("<td>" + instruction);
row.append("<td class='distance text-body-secondary text-end'>" + getDistText(dist)); row.append("<td class='distance text-body-secondary text-end'>" + getDistText(dist));
@ -218,7 +218,7 @@ OSM.Directions = function (map) {
} }
} }
var chosenEngineIndex = findEngine("fossgis_osrm_car"); let chosenEngineIndex = findEngine("fossgis_osrm_car");
if (Cookies.get("_osm_directions_engine")) { if (Cookies.get("_osm_directions_engine")) {
chosenEngineIndex = findEngine(Cookies.get("_osm_directions_engine")); chosenEngineIndex = findEngine(Cookies.get("_osm_directions_engine"));
} }
@ -236,17 +236,17 @@ OSM.Directions = function (map) {
}); });
$(".routing_marker_column img").on("dragstart", function (e) { $(".routing_marker_column img").on("dragstart", function (e) {
var dt = e.originalEvent.dataTransfer; const dt = e.originalEvent.dataTransfer;
dt.effectAllowed = "move"; dt.effectAllowed = "move";
var dragData = { type: $(this).data("type") }; const dragData = { type: $(this).data("type") };
dt.setData("text", JSON.stringify(dragData)); dt.setData("text", JSON.stringify(dragData));
if (dt.setDragImage) { if (dt.setDragImage) {
var img = $("<img>").attr("src", $(e.originalEvent.target).attr("src")); const img = $("<img>").attr("src", $(e.originalEvent.target).attr("src"));
dt.setDragImage(img.get(0), 12, 21); dt.setDragImage(img.get(0), 12, 21);
} }
}); });
var page = {}; const page = {};
page.pushstate = page.popstate = function () { page.pushstate = page.popstate = function () {
$(".search_form").hide(); $(".search_form").hide();
@ -258,12 +258,12 @@ OSM.Directions = function (map) {
$("#map").on("drop", function (e) { $("#map").on("drop", function (e) {
e.preventDefault(); e.preventDefault();
var oe = e.originalEvent; const oe = e.originalEvent;
var dragData = JSON.parse(oe.dataTransfer.getData("text")); const dragData = JSON.parse(oe.dataTransfer.getData("text"));
var type = dragData.type; const type = dragData.type;
var pt = L.DomEvent.getMousePosition(oe, map.getContainer()); // co-ordinates of the mouse pointer at present const pt = L.DomEvent.getMousePosition(oe, map.getContainer()); // co-ordinates of the mouse pointer at present
pt.y += 20; pt.y += 20;
var ll = map.containerPointToLatLng(pt); const ll = map.containerPointToLatLng(pt);
const llWithPrecision = OSM.cropLocation(ll, map.getZoom()); const llWithPrecision = OSM.cropLocation(ll, map.getZoom());
endpoints[type === "from" ? 0 : 1].setValue(llWithPrecision.join(", ")); endpoints[type === "from" ? 0 : 1].setValue(llWithPrecision.join(", "));
}); });
@ -275,7 +275,7 @@ OSM.Directions = function (map) {
route = (params.get("route") || "").split(";"); route = (params.get("route") || "").split(";");
if (params.has("engine")) { if (params.has("engine")) {
var engineIndex = findEngine(params.get("engine")); const engineIndex = findEngine(params.get("engine"));
if (engineIndex >= 0) { if (engineIndex >= 0) {
setEngine(engineIndex); setEngine(engineIndex);

6
app/assets/javascripts/index/export.js
View file

@ -1,7 +1,7 @@
OSM.Export = function (map) { OSM.Export = function (map) {
var page = {}; const page = {};
var locationFilter = new L.LocationFilter({ const locationFilter = new L.LocationFilter({
enableButton: false, enableButton: false,
adjustButton: false adjustButton: false
}).on("change", update); }).on("change", update);
@ -13,7 +13,7 @@ OSM.Export = function (map) {
} }
function boundsChanged() { function boundsChanged() {
var bounds = getBounds(); const bounds = getBounds();
map.fitBounds(bounds); map.fitBounds(bounds);
locationFilter.setBounds(bounds); locationFilter.setBounds(bounds);
locationFilter.enable(); locationFilter.enable();

32
app/assets/javascripts/index/history.js
View file

@ -1,7 +1,7 @@
//= require jquery-simulate/jquery.simulate //= require jquery-simulate/jquery.simulate
OSM.History = function (map) { OSM.History = function (map) {
var page = {}; const page = {};
$("#sidebar_content") $("#sidebar_content")
.on("click", ".changeset_more a", loadMore) .on("click", ".changeset_more a", loadMore)
@ -12,7 +12,7 @@ OSM.History = function (map) {
unHighlightChangeset($(this).data("changeset").id); unHighlightChangeset($(this).data("changeset").id);
}); });
var group = L.featureGroup() const group = L.featureGroup()
.on("mouseover", function (e) { .on("mouseover", function (e) {
highlightChangeset(e.layer.id); highlightChangeset(e.layer.id);
}) })
@ -28,13 +28,13 @@ OSM.History = function (map) {
}; };
function highlightChangeset(id) { function highlightChangeset(id) {
var layer = group.getLayer(id); const layer = group.getLayer(id);
if (layer) layer.setStyle({ fillOpacity: 0.3, color: "#FF6600", weight: 3 }); if (layer) layer.setStyle({ fillOpacity: 0.3, color: "#FF6600", weight: 3 });
$("#changeset_" + id).addClass("selected"); $("#changeset_" + id).addClass("selected");
} }
function unHighlightChangeset(id) { function unHighlightChangeset(id) {
var layer = group.getLayer(id); const layer = group.getLayer(id);
if (layer) layer.setStyle({ fillOpacity: 0, color: "#FF9500", weight: 2 }); if (layer) layer.setStyle({ fillOpacity: 0, color: "#FF9500", weight: 2 });
$("#changeset_" + id).removeClass("selected"); $("#changeset_" + id).removeClass("selected");
} }
@ -49,8 +49,8 @@ OSM.History = function (map) {
function displayMoreChangesets(html) { function displayMoreChangesets(html) {
$("#sidebar_content .changeset_more").replaceWith(html); $("#sidebar_content .changeset_more").replaceWith(html);
var oldList = $("#sidebar_content .changesets ol").first(); const oldList = $("#sidebar_content .changesets ol").first();
var newList = oldList.next("ol"); const newList = oldList.next("ol");
newList.children().appendTo(oldList); newList.children().appendTo(oldList);
newList.remove(); newList.remove();
} }
@ -60,8 +60,8 @@ OSM.History = function (map) {
if (window.location.pathname === "/history") { if (window.location.pathname === "/history") {
data.set("bbox", map.getBounds().wrap().toBBoxString()); data.set("bbox", map.getBounds().wrap().toBBoxString());
var feedLink = $("link[type=\"application/atom+xml\"]"), const feedLink = $("link[type=\"application/atom+xml\"]"),
feedHref = feedLink.attr("href").split("?")[0]; feedHref = feedLink.attr("href").split("?")[0];
feedLink.attr("href", feedHref + "?" + data); feedLink.attr("href", feedHref + "?" + data);
} }
@ -79,7 +79,7 @@ OSM.History = function (map) {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
var div = $(this).parents(".changeset_more"); const div = $(this).parents(".changeset_more");
$(this).hide(); $(this).hide();
div.find(".loader").show(); div.find(".loader").show();
@ -90,17 +90,17 @@ OSM.History = function (map) {
}); });
} }
var changesets = []; let changesets = [];
function updateBounds() { function updateBounds() {
group.clearLayers(); group.clearLayers();
for (const changeset of changesets) { for (const changeset of changesets) {
var bottomLeft = map.project(L.latLng(changeset.bbox.minlat, changeset.bbox.minlon)), const bottomLeft = map.project(L.latLng(changeset.bbox.minlat, changeset.bbox.minlon)),
topRight = map.project(L.latLng(changeset.bbox.maxlat, changeset.bbox.maxlon)), topRight = map.project(L.latLng(changeset.bbox.maxlat, changeset.bbox.maxlon)),
width = topRight.x - bottomLeft.x, width = topRight.x - bottomLeft.x,
height = bottomLeft.y - topRight.y, height = bottomLeft.y - topRight.y,
minSize = 20; // Min width/height of changeset in pixels minSize = 20; // Min width/height of changeset in pixels
if (width < minSize) { if (width < minSize) {
bottomLeft.x -= ((minSize - width) / 2); bottomLeft.x -= ((minSize - width) / 2);
@ -138,7 +138,7 @@ OSM.History = function (map) {
updateBounds(); updateBounds();
if (window.location.pathname !== "/history") { if (window.location.pathname !== "/history") {
var bounds = group.getBounds(); const bounds = group.getBounds();
if (bounds.isValid()) map.fitBounds(bounds); if (bounds.isValid()) map.fitBounds(bounds);
} }
} }

8
app/assets/javascripts/index/layers/data.js
View file

@ -40,7 +40,7 @@ OSM.initializeDataLayer = function (map) {
}); });
function updateData() { function updateData() {
var bounds = map.getBounds(); const bounds = map.getBounds();
if (!loadedBounds || !loadedBounds.contains(bounds)) { if (!loadedBounds || !loadedBounds.contains(bounds)) {
getData(); getData();
} }
@ -78,8 +78,8 @@ OSM.initializeDataLayer = function (map) {
} }
function getData() { function getData() {
var bounds = map.getBounds(); const bounds = map.getBounds();
var url = "/api/" + OSM.API_VERSION + "/map.json?bbox=" + bounds.toBBoxString(); const url = "/api/" + OSM.API_VERSION + "/map.json?bbox=" + bounds.toBBoxString();
/* /*
* Modern browsers are quite happy showing far more than 100 features in * Modern browsers are quite happy showing far more than 100 features in
@ -102,7 +102,7 @@ OSM.initializeDataLayer = function (map) {
.then(function (data) { .then(function (data) {
dataLayer.clearLayers(); dataLayer.clearLayers();
var features = dataLayer.buildFeatures(data); const features = dataLayer.buildFeatures(data);
function addFeatures() { function addFeatures() {
$("#browse_status").empty(); $("#browse_status").empty();

16
app/assets/javascripts/index/layers/notes.js
View file

@ -3,7 +3,7 @@ OSM.initializeNotesLayer = function (map) {
const noteLayer = map.noteLayer; const noteLayer = map.noteLayer;
let notes = {}; let notes = {};
var noteIcons = { const noteIcons = {
"new": L.icon({ "new": L.icon({
iconUrl: OSM.NEW_NOTE_MARKER, iconUrl: OSM.NEW_NOTE_MARKER,
iconSize: [25, 40], iconSize: [25, 40],
@ -39,7 +39,7 @@ OSM.initializeNotesLayer = function (map) {
}); });
function updateMarker(old_marker, feature) { function updateMarker(old_marker, feature) {
var marker = old_marker; let marker = old_marker;
if (marker) { if (marker) {
marker.setIcon(noteIcons[feature.properties.status]); marker.setIcon(noteIcons[feature.properties.status]);
} else { } else {
@ -67,11 +67,11 @@ OSM.initializeNotesLayer = function (map) {
}; };
function loadNotes() { function loadNotes() {
var bounds = map.getBounds(); const bounds = map.getBounds();
var size = bounds.getSize(); const size = bounds.getSize();
if (size <= OSM.MAX_NOTE_REQUEST_AREA) { if (size <= OSM.MAX_NOTE_REQUEST_AREA) {
var url = "/api/" + OSM.API_VERSION + "/notes.json?bbox=" + bounds.toBBoxString(); const url = "/api/" + OSM.API_VERSION + "/notes.json?bbox=" + bounds.toBBoxString();
if (noteLoader) noteLoader.abort(); if (noteLoader) noteLoader.abort();
@ -84,15 +84,15 @@ OSM.initializeNotesLayer = function (map) {
} }
function success(json) { function success(json) {
var oldNotes = notes; const oldNotes = notes;
notes = {}; notes = {};
for (const feature of json.features) { for (const feature of json.features) {
var marker = oldNotes[feature.properties.id]; const marker = oldNotes[feature.properties.id];
delete oldNotes[feature.properties.id]; delete oldNotes[feature.properties.id];
notes[feature.properties.id] = updateMarker(marker, feature); notes[feature.properties.id] = updateMarker(marker, feature);
} }
for (var id in oldNotes) { for (const id in oldNotes) {
noteLayer.removeLayer(oldNotes[id]); noteLayer.removeLayer(oldNotes[id]);
} }
} }

18
app/assets/javascripts/index/new_note.js
View file

@ -1,12 +1,12 @@
OSM.NewNote = function (map) { OSM.NewNote = function (map) {
var noteLayer = map.noteLayer, const noteLayer = map.noteLayer,
content = $("#sidebar_content"), content = $("#sidebar_content"),
page = {}, page = {},
addNoteButton = $(".control-note .control-button"), addNoteButton = $(".control-note .control-button");
newNoteMarker, let newNoteMarker,
halo; halo;
var noteIcons = { const noteIcons = {
"new": L.icon({ "new": L.icon({
iconUrl: OSM.NEW_NOTE_MARKER, iconUrl: OSM.NEW_NOTE_MARKER,
iconSize: [25, 40], iconSize: [25, 40],
@ -48,7 +48,7 @@ OSM.NewNote = function (map) {
} }
function addCreatedNoteMarker(feature) { function addCreatedNoteMarker(feature) {
var marker = L.marker(feature.geometry.coordinates.reverse(), { const marker = L.marker(feature.geometry.coordinates.reverse(), {
icon: noteIcons[feature.properties.status], icon: noteIcons[feature.properties.status],
opacity: 0.9, opacity: 0.9,
interactive: true interactive: true
@ -132,7 +132,7 @@ OSM.NewNote = function (map) {
map.addLayer(noteLayer); map.addLayer(noteLayer);
const params = new URLSearchParams(path.substring(path.indexOf("?"))); const params = new URLSearchParams(path.substring(path.indexOf("?")));
var markerLatlng; let markerLatlng;
if (params.has("lat") && params.has("lon")) { if (params.has("lat") && params.has("lon")) {
markerLatlng = L.latLng(params.get("lat"), params.get("lon")); markerLatlng = L.latLng(params.get("lat"), params.get("lon"));
@ -161,7 +161,7 @@ OSM.NewNote = function (map) {
createNote(location, text, (feature) => { createNote(location, text, (feature) => {
if (typeof OSM.user === "undefined") { if (typeof OSM.user === "undefined") {
var anonymousNotesCount = Number(Cookies.get("_osm_anonymous_notes_count")) || 0; const anonymousNotesCount = Number(Cookies.get("_osm_anonymous_notes_count")) || 0;
Cookies.set("_osm_anonymous_notes_count", anonymousNotesCount + 1, { secure: true, expires: 30, path: "/", samesite: "lax" }); Cookies.set("_osm_anonymous_notes_count", anonymousNotesCount + 1, { secure: true, expires: 30, path: "/", samesite: "lax" });
} }
content.find("textarea").val(""); content.find("textarea").val("");

26
app/assets/javascripts/index/note.js
View file

@ -1,8 +1,8 @@
OSM.Note = function (map) { OSM.Note = function (map) {
var content = $("#sidebar_content"), const content = $("#sidebar_content"),
page = {}; page = {};
var noteIcons = { const noteIcons = {
"new": L.icon({ "new": L.icon({
iconUrl: OSM.NEW_NOTE_MARKER, iconUrl: OSM.NEW_NOTE_MARKER,
iconSize: [25, 40], iconSize: [25, 40],
@ -22,9 +22,9 @@ OSM.Note = function (map) {
page.pushstate = page.popstate = function (path, id) { page.pushstate = page.popstate = function (path, id) {
OSM.loadSidebarContent(path, function () { OSM.loadSidebarContent(path, function () {
var data = $(".details").data(); const data = $(".details").data();
if (!data) return; if (!data) return;
var latLng = L.latLng(data.coordinates.split(",")); const latLng = L.latLng(data.coordinates.split(","));
initialize(path, id, map.getBounds().contains(latLng)); initialize(path, id, map.getBounds().contains(latLng));
}); });
}; };
@ -36,9 +36,9 @@ OSM.Note = function (map) {
function initialize(path, id, skipMoveToNote) { function initialize(path, id, skipMoveToNote) {
content.find("button[name]").on("click", function (e) { content.find("button[name]").on("click", function (e) {
e.preventDefault(); e.preventDefault();
var data = $(e.target).data(); const data = $(e.target).data();
var name = $(e.target).attr("name"); const name = $(e.target).attr("name");
var ajaxSettings = { const ajaxSettings = {
url: data.url, url: data.url,
type: data.method, type: data.method,
oauth: true, oauth: true,
@ -70,10 +70,10 @@ OSM.Note = function (map) {
content.find("textarea").val("").trigger("input"); content.find("textarea").val("").trigger("input");
var data = $(".details").data(); const data = $(".details").data();
if (data) { if (data) {
var hashParams = OSM.parseHash(window.location.hash); const hashParams = OSM.parseHash(window.location.hash);
map.addObject({ map.addObject({
type: "note", type: "note",
id: parseInt(id, 10), id: parseInt(id, 10),
@ -81,7 +81,7 @@ OSM.Note = function (map) {
icon: noteIcons[data.status] icon: noteIcons[data.status]
}, function () { }, function () {
if (!hashParams.center && !skipMoveToNote) { if (!hashParams.center && !skipMoveToNote) {
var latLng = L.latLng(data.coordinates.split(",")); const latLng = L.latLng(data.coordinates.split(","));
OSM.router.withoutMoveListener(function () { OSM.router.withoutMoveListener(function () {
map.setView(latLng, 15, { reset: true }); map.setView(latLng, 15, { reset: true });
}); });
@ -91,8 +91,8 @@ OSM.Note = function (map) {
} }
function updateButtons() { function updateButtons() {
var resolveButton = content.find("button[name='close']"); const resolveButton = content.find("button[name='close']");
var commentButton = content.find("button[name='comment']"); const commentButton = content.find("button[name='comment']");
content.find("button[name]").prop("disabled", false); content.find("button[name]").prop("disabled", false);
if (content.find("textarea").val() === "") { if (content.find("textarea").val() === "") {

93
app/assets/javascripts/index/query.js
View file

@ -1,11 +1,11 @@
OSM.Query = function (map) { OSM.Query = function (map) {
var url = OSM.OVERPASS_URL, const url = OSM.OVERPASS_URL,
credentials = OSM.OVERPASS_CREDENTIALS, credentials = OSM.OVERPASS_CREDENTIALS,
queryButton = $(".control-query .control-button"), queryButton = $(".control-query .control-button"),
uninterestingTags = ["source", "source_ref", "source:ref", "history", "attribution", "created_by", "tiger:county", "tiger:tlid", "tiger:upload_uuid", "KSJ2:curve_id", "KSJ2:lat", "KSJ2:lon", "KSJ2:coordinate", "KSJ2:filename", "note:ja"], uninterestingTags = ["source", "source_ref", "source:ref", "history", "attribution", "created_by", "tiger:county", "tiger:tlid", "tiger:upload_uuid", "KSJ2:curve_id", "KSJ2:lat", "KSJ2:lon", "KSJ2:coordinate", "KSJ2:filename", "note:ja"];
marker; let marker;
var featureStyle = { const featureStyle = {
color: "#FF6200", color: "#FF6200",
weight: 4, weight: 4,
opacity: 1, opacity: 1,
@ -37,13 +37,13 @@ OSM.Query = function (map) {
}); });
function showResultGeometry() { function showResultGeometry() {
var geometry = $(this).data("geometry"); const geometry = $(this).data("geometry");
if (geometry) map.addLayer(geometry); if (geometry) map.addLayer(geometry);
$(this).addClass("selected"); $(this).addClass("selected");
} }
function hideResultGeometry() { function hideResultGeometry() {
var geometry = $(this).data("geometry"); const geometry = $(this).data("geometry");
if (geometry) map.removeLayer(geometry); if (geometry) map.removeLayer(geometry);
$(this).removeClass("selected"); $(this).removeClass("selected");
} }
@ -54,7 +54,7 @@ OSM.Query = function (map) {
function interestingFeature(feature) { function interestingFeature(feature) {
if (feature.tags) { if (feature.tags) {
for (var key in feature.tags) { for (const key in feature.tags) {
if (uninterestingTags.indexOf(key) < 0) { if (uninterestingTags.indexOf(key) < 0) {
return true; return true;
} }
@ -65,19 +65,18 @@ OSM.Query = function (map) {
} }
function featurePrefix(feature) { function featurePrefix(feature) {
var tags = feature.tags; const tags = feature.tags;
var prefix = ""; let prefix = "";
if (tags.boundary === "administrative" && tags.admin_level) { if (tags.boundary === "administrative" && tags.admin_level) {
prefix = I18n.t("geocoder.search_osm_nominatim.admin_levels.level" + tags.admin_level, { prefix = I18n.t("geocoder.search_osm_nominatim.admin_levels.level" + tags.admin_level, {
defaultValue: I18n.t("geocoder.search_osm_nominatim.prefix.boundary.administrative") defaultValue: I18n.t("geocoder.search_osm_nominatim.prefix.boundary.administrative")
}); });
} else { } else {
var prefixes = I18n.t("geocoder.search_osm_nominatim.prefix"); const prefixes = I18n.t("geocoder.search_osm_nominatim.prefix");
var key, value;
for (key in tags) { for (const key in tags) {
value = tags[key]; const value = tags[key];
if (prefixes[key]) { if (prefixes[key]) {
if (prefixes[key][value]) { if (prefixes[key][value]) {
@ -86,12 +85,12 @@ OSM.Query = function (map) {
} }
} }
for (key in tags) { for (const key in tags) {
value = tags[key]; const value = tags[key];
if (prefixes[key]) { if (prefixes[key]) {
var first = value.slice(0, 1).toUpperCase(), const first = value.slice(0, 1).toUpperCase(),
rest = value.slice(1).replace(/_/g, " "); rest = value.slice(1).replace(/_/g, " ");
return first + rest; return first + rest;
} }
@ -106,8 +105,8 @@ OSM.Query = function (map) {
} }
function featureName(feature) { function featureName(feature) {
var tags = feature.tags, const tags = feature.tags,
locales = OSM.preferred_languages; locales = OSM.preferred_languages;
for (const locale of locales) { for (const locale of locales) {
if (tags["name:" + locale]) { if (tags["name:" + locale]) {
@ -128,7 +127,7 @@ OSM.Query = function (map) {
} }
function featureGeometry(feature) { function featureGeometry(feature) {
var geometry; let geometry;
if (feature.type === "node" && feature.lat && feature.lon) { if (feature.type === "node" && feature.lat && feature.lon) {
geometry = L.circleMarker([feature.lat, feature.lon], featureStyle); geometry = L.circleMarker([feature.lat, feature.lon], featureStyle);
@ -148,7 +147,7 @@ OSM.Query = function (map) {
} }
function runQuery(latlng, radius, query, $section, merge, compare) { function runQuery(latlng, radius, query, $section, merge, compare) {
var $ul = $section.find("ul"); const $ul = $section.find("ul");
$ul.empty(); $ul.empty();
$section.show(); $section.show();
@ -168,13 +167,13 @@ OSM.Query = function (map) {
}) })
.then(response => response.json()) .then(response => response.json())
.then(function (results) { .then(function (results) {
var elements; let elements;
$section.find(".loader").hide(); $section.find(".loader").hide();
if (merge) { if (merge) {
elements = results.elements.reduce(function (hash, element) { elements = results.elements.reduce(function (hash, element) {
var key = element.type + element.id; const key = element.type + element.id;
if ("geometry" in element) { if ("geometry" in element) {
delete element.bounds; delete element.bounds;
} }
@ -196,7 +195,7 @@ OSM.Query = function (map) {
for (const element of elements) { for (const element of elements) {
if (!interestingFeature(element)) continue; if (!interestingFeature(element)) continue;
var $li = $("<li>") const $li = $("<li>")
.addClass("list-group-item list-group-item-action") .addClass("list-group-item list-group-item-action")
.text(featurePrefix(element) + " ") .text(featurePrefix(element) + " ")
.appendTo($ul); .appendTo($ul);
@ -236,12 +235,12 @@ OSM.Query = function (map) {
} }
function compareSize(feature1, feature2) { function compareSize(feature1, feature2) {
var width1 = feature1.bounds.maxlon - feature1.bounds.minlon, const width1 = feature1.bounds.maxlon - feature1.bounds.minlon,
height1 = feature1.bounds.maxlat - feature1.bounds.minlat, height1 = feature1.bounds.maxlat - feature1.bounds.minlat,
area1 = width1 * height1, area1 = width1 * height1,
width2 = feature2.bounds.maxlat - feature2.bounds.minlat, width2 = feature2.bounds.maxlat - feature2.bounds.minlat,
height2 = feature2.bounds.maxlat - feature2.bounds.minlat, height2 = feature2.bounds.maxlat - feature2.bounds.minlat,
area2 = width2 * height2; area2 = width2 * height2;
return area1 - area2; return area1 - area2;
} }
@ -267,20 +266,20 @@ OSM.Query = function (map) {
* for each object. * for each object.
*/ */
function queryOverpass(lat, lng) { function queryOverpass(lat, lng) {
var latlng = L.latLng(lat, lng).wrap(), const latlng = L.latLng(lat, lng).wrap(),
bounds = map.getBounds().wrap(), bounds = map.getBounds().wrap(),
zoom = map.getZoom(), zoom = map.getZoom(),
bbox = [bounds.getSouthWest(), bounds.getNorthEast()] bbox = [bounds.getSouthWest(), bounds.getNorthEast()]
.map(c => OSM.cropLocation(c, zoom)) .map(c => OSM.cropLocation(c, zoom))
.join(), .join(),
geombbox = "geom(" + bbox + ");", geombbox = "geom(" + bbox + ");",
radius = 10 * Math.pow(1.5, 19 - zoom), radius = 10 * Math.pow(1.5, 19 - zoom),
around = "(around:" + radius + "," + lat + "," + lng + ")", around = "(around:" + radius + "," + lat + "," + lng + ")",
nodes = "node" + around, nodes = "node" + around,
ways = "way" + around, ways = "way" + around,
relations = "relation" + around, relations = "relation" + around,
nearby = "(" + nodes + ";" + ways + ";);out tags " + geombbox + relations + ";out " + geombbox, nearby = "(" + nodes + ";" + ways + ";);out tags " + geombbox + relations + ";out " + geombbox,
isin = "is_in(" + lat + "," + lng + ")->.a;way(pivot.a);out tags bb;out ids " + geombbox + "relation(pivot.a);out tags bb;"; isin = "is_in(" + lat + "," + lng + ")->.a;way(pivot.a);out tags bb;out ids " + geombbox + "relation(pivot.a);out tags bb;";
$("#sidebar_content .query-intro") $("#sidebar_content .query-intro")
.hide(); .hide();
@ -315,7 +314,7 @@ OSM.Query = function (map) {
queryButton.removeClass("active"); queryButton.removeClass("active");
} }
var page = {}; const page = {};
page.pushstate = page.popstate = function (path) { page.pushstate = page.popstate = function (path) {
OSM.loadSidebarContent(path, function () { OSM.loadSidebarContent(path, function () {

46
app/assets/javascripts/index/search.js
View file

@ -9,7 +9,7 @@ OSM.Search = function (map) {
$(".search_form a.btn.switch_link").on("click", function (e) { $(".search_form a.btn.switch_link").on("click", function (e) {
e.preventDefault(); e.preventDefault();
var query = $(this).closest("form").find("input[name=query]").val(); const query = $(this).closest("form").find("input[name=query]").val();
let search = ""; let search = "";
if (query) search = "?" + new URLSearchParams({ from: query }); if (query) search = "?" + new URLSearchParams({ from: query });
OSM.router.route("/directions" + search + OSM.formatHash(map)); OSM.router.route("/directions" + search + OSM.formatHash(map));
@ -18,7 +18,7 @@ OSM.Search = function (map) {
$(".search_form").on("submit", function (e) { $(".search_form").on("submit", function (e) {
e.preventDefault(); e.preventDefault();
$("header").addClass("closed"); $("header").addClass("closed");
var query = $(this).find("input[name=query]").val(); const query = $(this).find("input[name=query]").val();
let search = "/"; let search = "/";
if (query) search = "/search?" + new URLSearchParams({ query }); if (query) search = "/search?" + new URLSearchParams({ query });
OSM.router.route(search + OSM.formatHash(map)); OSM.router.route(search + OSM.formatHash(map));
@ -38,16 +38,16 @@ OSM.Search = function (map) {
.on("mouseover", "li.search_results_entry:has(a.set_position)", showSearchResult) .on("mouseover", "li.search_results_entry:has(a.set_position)", showSearchResult)
.on("mouseout", "li.search_results_entry:has(a.set_position)", hideSearchResult); .on("mouseout", "li.search_results_entry:has(a.set_position)", hideSearchResult);
var markers = L.layerGroup().addTo(map); const markers = L.layerGroup().addTo(map);
function clickSearchMore(e) { function clickSearchMore(e) {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
var div = $(this).parents(".search_more"), const div = $(this).parents(".search_more"),
csrf_param = $("meta[name=csrf-param]").attr("content"), csrf_param = $("meta[name=csrf-param]").attr("content"),
csrf_token = $("meta[name=csrf-token]").attr("content"), csrf_token = $("meta[name=csrf-token]").attr("content"),
params = new URLSearchParams(); params = new URLSearchParams();
$(this).hide(); $(this).hide();
div.find(".loader").show(); div.find(".loader").show();
@ -63,10 +63,10 @@ OSM.Search = function (map) {
} }
function showSearchResult() { function showSearchResult() {
var marker = $(this).data("marker"); let marker = $(this).data("marker");
if (!marker) { if (!marker) {
var data = $(this).find("a.set_position").data(); const data = $(this).find("a.set_position").data();
marker = L.marker([data.lat, data.lon], { icon: OSM.getUserIcon() }); marker = L.marker([data.lat, data.lon], { icon: OSM.getUserIcon() });
@ -77,7 +77,7 @@ OSM.Search = function (map) {
} }
function hideSearchResult() { function hideSearchResult() {
var marker = $(this).data("marker"); const marker = $(this).data("marker");
if (marker) { if (marker) {
markers.removeLayer(marker); markers.removeLayer(marker);
@ -93,7 +93,7 @@ OSM.Search = function (map) {
} }
function clickSearchResult(e) { function clickSearchResult(e) {
var data = $(this).data(); const data = $(this).data();
panToSearchResult(data); panToSearchResult(data);
@ -104,7 +104,7 @@ OSM.Search = function (map) {
e.stopPropagation(); e.stopPropagation();
} }
var page = {}; const page = {};
page.pushstate = page.popstate = function (path) { page.pushstate = page.popstate = function (path) {
const params = new URLSearchParams(path.substring(path.indexOf("?"))); const params = new URLSearchParams(path.substring(path.indexOf("?")));
@ -120,16 +120,16 @@ OSM.Search = function (map) {
page.load = function () { page.load = function () {
$(".search_results_entry").each(function (index) { $(".search_results_entry").each(function (index) {
var entry = $(this), const entry = $(this),
csrf_param = $("meta[name=csrf-param]").attr("content"), csrf_param = $("meta[name=csrf-param]").attr("content"),
csrf_token = $("meta[name=csrf-token]").attr("content"), csrf_token = $("meta[name=csrf-token]").attr("content"),
params = new URLSearchParams({ params = new URLSearchParams({
zoom: map.getZoom(), zoom: map.getZoom(),
minlon: map.getBounds().getWest(), minlon: map.getBounds().getWest(),
minlat: map.getBounds().getSouth(), minlat: map.getBounds().getSouth(),
maxlon: map.getBounds().getEast(), maxlon: map.getBounds().getEast(),
maxlat: map.getBounds().getNorth() maxlat: map.getBounds().getNorth()
}); });
params.set(csrf_param, csrf_token); params.set(csrf_param, csrf_token);
fetch(entry.data("href"), { fetch(entry.data("href"), {
method: "POST", method: "POST",
@ -140,7 +140,7 @@ OSM.Search = function (map) {
entry.html(html); entry.html(html);
// go to first result of first geocoder // go to first result of first geocoder
if (index === 0) { if (index === 0) {
var firstResult = entry.find("*[data-lat][data-lon]:first").first(); const firstResult = entry.find("*[data-lat][data-lon]:first").first();
if (firstResult.length) { if (firstResult.length) {
panToSearchResult(firstResult.data()); panToSearchResult(firstResult.data());
} }

12
app/assets/javascripts/leaflet.key.js
View file

@ -1,8 +1,8 @@
L.OSM.key = function (options) { L.OSM.key = function (options) {
var control = L.OSM.sidebarPane(options, "key", null, "javascripts.key.title"); const control = L.OSM.sidebarPane(options, "key", null, "javascripts.key.title");
control.onAddPane = function (map, button, $ui) { control.onAddPane = function (map, button, $ui) {
var $section = $("<div>") const $section = $("<div>")
.attr("class", "p-3") .attr("class", "p-3")
.appendTo($ui); .appendTo($ui);
@ -24,7 +24,7 @@ L.OSM.key = function (options) {
} }
function updateButton() { function updateButton() {
var disabled = OSM.LAYERS_WITH_MAP_KEY.indexOf(map.getMapBaseLayerId()) === -1; const disabled = OSM.LAYERS_WITH_MAP_KEY.indexOf(map.getMapBaseLayerId()) === -1;
button button
.toggleClass("disabled", disabled) .toggleClass("disabled", disabled)
.attr("data-bs-original-title", .attr("data-bs-original-title",
@ -34,11 +34,11 @@ L.OSM.key = function (options) {
} }
function update() { function update() {
var layerId = map.getMapBaseLayerId(), const layerId = map.getMapBaseLayerId(),
zoom = map.getZoom(); zoom = map.getZoom();
$(".mapkey-table-entry").each(function () { $(".mapkey-table-entry").each(function () {
var data = $(this).data(); const data = $(this).data();
$(this).toggle( $(this).toggle(
layerId === data.layer && layerId === data.layer &&
(!data.zoomMin || zoom >= data.zoomMin) && (!data.zoomMin || zoom >= data.zoomMin) &&

34
app/assets/javascripts/leaflet.layers.js
View file

@ -1,34 +1,34 @@
L.OSM.layers = function (options) { L.OSM.layers = function (options) {
var control = L.OSM.sidebarPane(options, "layers", "javascripts.map.layers.title", "javascripts.map.layers.header"); const control = L.OSM.sidebarPane(options, "layers", "javascripts.map.layers.title", "javascripts.map.layers.header");
control.onAddPane = function (map, button, $ui, toggle) { control.onAddPane = function (map, button, $ui, toggle) {
var layers = options.layers; const layers = options.layers;
var baseSection = $("<div>") const baseSection = $("<div>")
.attr("class", "base-layers d-grid gap-3 p-3 border-bottom border-secondary-subtle") .attr("class", "base-layers d-grid gap-3 p-3 border-bottom border-secondary-subtle")
.appendTo($ui); .appendTo($ui);
layers.forEach(function (layer, i) { layers.forEach(function (layer, i) {
var id = "map-ui-layer-" + i; const id = "map-ui-layer-" + i;
var buttonContainer = $("<div class='position-relative'>") const buttonContainer = $("<div class='position-relative'>")
.appendTo(baseSection); .appendTo(baseSection);
var mapContainer = $("<div class='position-absolute top-0 start-0 bottom-0 end-0 z-0 bg-body-secondary'>") const mapContainer = $("<div class='position-absolute top-0 start-0 bottom-0 end-0 z-0 bg-body-secondary'>")
.appendTo(buttonContainer); .appendTo(buttonContainer);
var input = $("<input type='radio' class='btn-check' name='layer'>") const input = $("<input type='radio' class='btn-check' name='layer'>")
.prop("id", id) .prop("id", id)
.prop("checked", map.hasLayer(layer)) .prop("checked", map.hasLayer(layer))
.appendTo(buttonContainer); .appendTo(buttonContainer);
var item = $("<label class='btn btn-outline-primary border-4 rounded-3 bg-transparent position-absolute p-0 h-100 w-100 overflow-hidden'>") const item = $("<label class='btn btn-outline-primary border-4 rounded-3 bg-transparent position-absolute p-0 h-100 w-100 overflow-hidden'>")
.prop("for", id) .prop("for", id)
.append($("<span class='badge position-absolute top-0 start-0 rounded-top-0 rounded-start-0 py-1 px-2 bg-body bg-opacity-75 text-body text-wrap text-start fs-6 lh-base'>").append(layer.options.name)) .append($("<span class='badge position-absolute top-0 start-0 rounded-top-0 rounded-start-0 py-1 px-2 bg-body bg-opacity-75 text-body text-wrap text-start fs-6 lh-base'>").append(layer.options.name))
.appendTo(buttonContainer); .appendTo(buttonContainer);
map.whenReady(function () { map.whenReady(function () {
var miniMap = L.map(mapContainer[0], { attributionControl: false, zoomControl: false, keyboard: false }) const miniMap = L.map(mapContainer[0], { attributionControl: false, zoomControl: false, keyboard: false })
.addLayer(new layer.constructor(layer.options)); .addLayer(new layer.constructor(layer.options));
miniMap.dragging.disable(); miniMap.dragging.disable();
@ -76,7 +76,7 @@ L.OSM.layers = function (options) {
}); });
if (OSM.STATUS !== "api_offline" && OSM.STATUS !== "database_offline") { if (OSM.STATUS !== "api_offline" && OSM.STATUS !== "database_offline") {
var overlaySection = $("<div>") const overlaySection = $("<div>")
.attr("class", "overlay-layers p-3") .attr("class", "overlay-layers p-3")
.appendTo($ui); .appendTo($ui);
@ -85,11 +85,11 @@ L.OSM.layers = function (options) {
.attr("class", "text-body-secondary small mb-2") .attr("class", "text-body-secondary small mb-2")
.appendTo(overlaySection); .appendTo(overlaySection);
var overlays = $("<ul class='list-unstyled form-check'>") const overlays = $("<ul class='list-unstyled form-check'>")
.appendTo(overlaySection); .appendTo(overlaySection);
var addOverlay = function (layer, name, maxArea) { const addOverlay = function (layer, name, maxArea) {
var item = $("<li>") const item = $("<li>")
.appendTo(overlays); .appendTo(overlays);
if (name === "notes" || name === "data") { if (name === "notes" || name === "data") {
@ -98,13 +98,13 @@ L.OSM.layers = function (options) {
.tooltip("disable"); .tooltip("disable");
} }
var label = $("<label>") const label = $("<label>")
.attr("class", "form-check-label") .attr("class", "form-check-label")
.appendTo(item); .appendTo(item);
var checked = map.hasLayer(layer); let checked = map.hasLayer(layer);
var input = $("<input>") const input = $("<input>")
.attr("type", "checkbox") .attr("type", "checkbox")
.attr("class", "form-check-input") .attr("class", "form-check-input")
.prop("checked", checked) .prop("checked", checked)
@ -126,7 +126,7 @@ L.OSM.layers = function (options) {
}); });
map.on("zoomend", function () { map.on("zoomend", function () {
var disabled = map.getBounds().getSize() >= maxArea; const disabled = map.getBounds().getSize() >= maxArea;
$(input).prop("disabled", disabled); $(input).prop("disabled", disabled);
if (disabled && $(input).is(":checked")) { if (disabled && $(input).is(":checked")) {

4
app/assets/javascripts/leaflet.locate.js
View file

@ -1,5 +1,5 @@
L.OSM.locate = function (options) { L.OSM.locate = function (options) {
var control = L.control.locate({ const control = L.control.locate({
icon: "icon geolocate", icon: "icon geolocate",
iconLoading: "icon geolocate", iconLoading: "icon geolocate",
strings: { strings: {
@ -12,7 +12,7 @@ L.OSM.locate = function (options) {
}); });
control.onAdd = function (map) { control.onAdd = function (map) {
var container = Object.getPrototypeOf(this).onAdd.apply(this, [map]); const container = Object.getPrototypeOf(this).onAdd.apply(this, [map]);
$(container) $(container)
.removeClass("leaflet-control-locate leaflet-bar") .removeClass("leaflet-control-locate leaflet-bar")
.addClass("control-locate") .addClass("control-locate")

68
app/assets/javascripts/leaflet.map.js
View file

@ -128,7 +128,7 @@ L.OSM.Map = L.Map.extend({
}, },
getLayersCode: function () { getLayersCode: function () {
var layerConfig = ""; let layerConfig = "";
this.eachLayer(function (layer) { this.eachLayer(function (layer) {
if (layer.options && layer.options.code) { if (layer.options && layer.options.code) {
layerConfig += layer.options.code; layerConfig += layer.options.code;
@ -155,9 +155,9 @@ L.OSM.Map = L.Map.extend({
[params.mlat, params.mlon] = OSM.cropLocation(marker.getLatLng(), this.getZoom()); [params.mlat, params.mlon] = OSM.cropLocation(marker.getLatLng(), this.getZoom());
} }
var url = window.location.protocol + "//" + OSM.SERVER_URL + "/", let url = window.location.protocol + "//" + OSM.SERVER_URL + "/";
query = new URLSearchParams(params), const query = new URLSearchParams(params),
hash = OSM.formatHash(this); hash = OSM.formatHash(this);
if (query) url += "?" + query; if (query) url += "?" + query;
if (hash) url += hash; if (hash) url += hash;
@ -166,33 +166,31 @@ L.OSM.Map = L.Map.extend({
}, },
getShortUrl: function (marker) { getShortUrl: function (marker) {
var zoom = this.getZoom(), const zoom = this.getZoom(),
latLng = marker && this.hasLayer(marker) ? marker.getLatLng().wrap() : this.getCenter().wrap(), latLng = marker && this.hasLayer(marker) ? marker.getLatLng().wrap() : this.getCenter().wrap(),
str = window.location.protocol + "//" + window.location.hostname.replace(/^www\.openstreetmap\.org/i, "osm.org") + "/go/", char_array = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789_~",
char_array = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789_~", x = Math.round((latLng.lng + 180.0) * ((1 << 30) / 90.0)),
x = Math.round((latLng.lng + 180.0) * ((1 << 30) / 90.0)), y = Math.round((latLng.lat + 90.0) * ((1 << 30) / 45.0)),
y = Math.round((latLng.lat + 90.0) * ((1 << 30) / 45.0)), // JavaScript only has to keep 32 bits of bitwise operators, so this has to be
// JavaScript only has to keep 32 bits of bitwise operators, so this has to be // done in two parts. each of the parts c1/c2 has 30 bits of the total in it
// done in two parts. each of the parts c1/c2 has 30 bits of the total in it // and drops the last 4 bits of the full 64 bit Morton code.
// and drops the last 4 bits of the full 64 bit Morton code. c1 = interlace(x >>> 17, y >>> 17),
c1 = interlace(x >>> 17, y >>> 17), c2 = interlace((x >>> 2) & 0x7fff, (y >>> 2) & 0x7fff);
c2 = interlace((x >>> 2) & 0x7fff, (y >>> 2) & 0x7fff), let str = window.location.protocol + "//" + window.location.hostname.replace(/^www\.openstreetmap\.org/i, "osm.org") + "/go/";
digit,
i;
for (i = 0; i < Math.ceil((zoom + 8) / 3.0) && i < 5; ++i) { for (let i = 0; i < Math.ceil((zoom + 8) / 3.0) && i < 5; ++i) {
digit = (c1 >> (24 - (6 * i))) & 0x3f; const digit = (c1 >> (24 - (6 * i))) & 0x3f;
str += char_array.charAt(digit); str += char_array.charAt(digit);
} }
for (i = 5; i < Math.ceil((zoom + 8) / 3.0); ++i) { for (let i = 5; i < Math.ceil((zoom + 8) / 3.0); ++i) {
digit = (c2 >> (24 - (6 * (i - 5)))) & 0x3f; const digit = (c2 >> (24 - (6 * (i - 5)))) & 0x3f;
str += char_array.charAt(digit); str += char_array.charAt(digit);
} }
for (i = 0; i < ((zoom + 8) % 3); ++i) str += "-"; for (let i = 0; i < ((zoom + 8) % 3); ++i) str += "-";
// Called to interlace the bits in x and y, making a Morton code. // Called to interlace the bits in x and y, making a Morton code.
function interlace(x, y) { function interlace(x, y) {
var interlaced_x = x, let interlaced_x = x,
interlaced_y = y; interlaced_y = y;
interlaced_x = (interlaced_x | (interlaced_x << 8)) & 0x00ff00ff; interlaced_x = (interlaced_x | (interlaced_x << 8)) & 0x00ff00ff;
interlaced_x = (interlaced_x | (interlaced_x << 4)) & 0x0f0f0f0f; interlaced_x = (interlaced_x | (interlaced_x << 4)) & 0x0f0f0f0f;
@ -206,7 +204,7 @@ L.OSM.Map = L.Map.extend({
} }
const params = new URLSearchParams(); const params = new URLSearchParams();
var layers = this.getLayersCode().replace("M", ""); const layers = this.getLayersCode().replace("M", "");
if (layers) { if (layers) {
params.set("layers", layers); params.set("layers", layers);
@ -240,14 +238,14 @@ L.OSM.Map = L.Map.extend({
}, },
addObject: function (object, callback) { addObject: function (object, callback) {
var objectStyle = { const objectStyle = {
color: "#FF6200", color: "#FF6200",
weight: 4, weight: 4,
opacity: 1, opacity: 1,
fillOpacity: 0.5 fillOpacity: 0.5
}; };
var changesetStyle = { const changesetStyle = {
weight: 4, weight: 4,
color: "#FF9500", color: "#FF9500",
opacity: 1, opacity: 1,
@ -255,7 +253,7 @@ L.OSM.Map = L.Map.extend({
interactive: false interactive: false
}; };
var haloStyle = { const haloStyle = {
weight: 2.5, weight: 2.5,
radius: 20, radius: 20,
fillOpacity: 0.5, fillOpacity: 0.5,
@ -292,7 +290,7 @@ L.OSM.Map = L.Map.extend({
if (callback) callback(this._objectLayer.getBounds()); if (callback) callback(this._objectLayer.getBounds());
this.fire("overlayadd", { layer: this._objectLayer }); this.fire("overlayadd", { layer: this._objectLayer });
} else { // element handled by L.OSM.DataLayer } else { // element handled by L.OSM.DataLayer
var map = this; const map = this;
this._objectLoader = new AbortController(); this._objectLoader = new AbortController();
fetch(OSM.apiUrl(object), { fetch(OSM.apiUrl(object), {
headers: { accept: "application/json" }, headers: { accept: "application/json" },
@ -347,10 +345,10 @@ L.OSM.Map = L.Map.extend({
}, },
setSidebarOverlaid: function (overlaid) { setSidebarOverlaid: function (overlaid) {
var mediumDeviceWidth = window.getComputedStyle(document.documentElement).getPropertyValue("--bs-breakpoint-md"); const mediumDeviceWidth = window.getComputedStyle(document.documentElement).getPropertyValue("--bs-breakpoint-md");
var isMediumDevice = window.matchMedia(`(max-width: ${mediumDeviceWidth})`).matches; const isMediumDevice = window.matchMedia(`(max-width: ${mediumDeviceWidth})`).matches;
var sidebarWidth = $("#sidebar").width(); const sidebarWidth = $("#sidebar").width();
var sidebarHeight = $("#sidebar").height(); const sidebarHeight = $("#sidebar").height();
if (overlaid && !$("#content").hasClass("overlay-sidebar")) { if (overlaid && !$("#content").hasClass("overlay-sidebar")) {
$("#content").addClass("overlay-sidebar"); $("#content").addClass("overlay-sidebar");
this.invalidateSize({ pan: false }); this.invalidateSize({ pan: false });
@ -384,15 +382,15 @@ L.extend(L.Icon.Default.prototype, {
_oldGetIconUrl: L.Icon.Default.prototype._getIconUrl, _oldGetIconUrl: L.Icon.Default.prototype._getIconUrl,
_getIconUrl: function (name) { _getIconUrl: function (name) {
var url = this._oldGetIconUrl(name); const url = this._oldGetIconUrl(name);
return L.Icon.Default.imageUrls[url]; return L.Icon.Default.imageUrls[url];
} }
}); });
OSM.isDarkMap = function () { OSM.isDarkMap = function () {
var mapTheme = $("body").attr("data-map-theme"); const mapTheme = $("body").attr("data-map-theme");
if (mapTheme) return mapTheme === "dark"; if (mapTheme) return mapTheme === "dark";
var siteTheme = $("html").attr("data-bs-theme"); const siteTheme = $("html").attr("data-bs-theme");
if (siteTheme) return siteTheme === "dark"; if (siteTheme) return siteTheme === "dark";
return window.matchMedia("(prefers-color-scheme: dark)").matches; return window.matchMedia("(prefers-color-scheme: dark)").matches;
}; };

10
app/assets/javascripts/leaflet.note.js
View file

@ -1,11 +1,11 @@
L.OSM.note = function (options) { L.OSM.note = function (options) {
var control = L.control(options); const control = L.control(options);
control.onAdd = function (map) { control.onAdd = function (map) {
var $container = $("<div>") const $container = $("<div>")
.attr("class", "control-note"); .attr("class", "control-note");
var link = $("<a>") const link = $("<a>")
.attr("class", "control-button") .attr("class", "control-button")
.attr("href", "#") .attr("href", "#")
.html("<span class=\"icon note\"></span>") .html("<span class=\"icon note\"></span>")
@ -14,8 +14,8 @@ L.OSM.note = function (options) {
map.on("zoomend", update); map.on("zoomend", update);
function update() { function update() {
var wasDisabled = link.hasClass("disabled"), const wasDisabled = link.hasClass("disabled"),
isDisabled = OSM.STATUS === "database_offline" || map.getZoom() < 12; isDisabled = OSM.STATUS === "database_offline" || map.getZoom() < 12;
link link
.toggleClass("disabled", isDisabled) .toggleClass("disabled", isDisabled)
.attr("data-bs-original-title", I18n.t(isDisabled ? .attr("data-bs-original-title", I18n.t(isDisabled ?

10
app/assets/javascripts/leaflet.query.js
View file

@ -1,11 +1,11 @@
L.OSM.query = function (options) { L.OSM.query = function (options) {
var control = L.control(options); const control = L.control(options);
control.onAdd = function (map) { control.onAdd = function (map) {
var $container = $("<div>") const $container = $("<div>")
.attr("class", "control-query"); .attr("class", "control-query");
var link = $("<a>") const link = $("<a>")
.attr("class", "control-button") .attr("class", "control-button")
.attr("href", "#") .attr("href", "#")
.html("<span class=\"icon query\"></span>") .html("<span class=\"icon query\"></span>")
@ -14,8 +14,8 @@ L.OSM.query = function (options) {
map.on("zoomend", update); map.on("zoomend", update);
function update() { function update() {
var wasDisabled = link.hasClass("disabled"), const wasDisabled = link.hasClass("disabled"),
isDisabled = map.getZoom() < 14; isDisabled = map.getZoom() < 14;
link link
.toggleClass("disabled", isDisabled) .toggleClass("disabled", isDisabled)
.attr("data-bs-original-title", I18n.t(isDisabled ? .attr("data-bs-original-title", I18n.t(isDisabled ?

58
app/assets/javascripts/leaflet.share.js
View file

@ -1,16 +1,16 @@
L.OSM.share = function (options) { L.OSM.share = function (options) {
var control = L.OSM.sidebarPane(options, "share", "javascripts.share.title", "javascripts.share.title"), const control = L.OSM.sidebarPane(options, "share", "javascripts.share.title", "javascripts.share.title"),
marker = L.marker([0, 0], { draggable: true }), marker = L.marker([0, 0], { draggable: true }),
locationFilter = new L.LocationFilter({ locationFilter = new L.LocationFilter({
enableButton: false, enableButton: false,
adjustButton: false adjustButton: false
}); });
control.onAddPane = function (map, button, $ui) { control.onAddPane = function (map, button, $ui) {
// Link / Embed // Link / Embed
$("#content").addClass("overlay-right-sidebar"); $("#content").addClass("overlay-right-sidebar");
var $linkSection = $("<div>") const $linkSection = $("<div>")
.attr("class", "share-link p-3 border-bottom border-secondary-subtle") .attr("class", "share-link p-3 border-bottom border-secondary-subtle")
.appendTo($ui); .appendTo($ui);
@ -18,7 +18,7 @@ L.OSM.share = function (options) {
.text(I18n.t("javascripts.share.link")) .text(I18n.t("javascripts.share.link"))
.appendTo($linkSection); .appendTo($linkSection);
var $form = $("<form>") let $form = $("<form>")
.appendTo($linkSection); .appendTo($linkSection);
$("<div>") $("<div>")
@ -54,7 +54,7 @@ L.OSM.share = function (options) {
.on("click", "a", function (e) { .on("click", "a", function (e) {
e.preventDefault(); e.preventDefault();
if (!$(this).hasClass("btn-primary")) return; if (!$(this).hasClass("btn-primary")) return;
var id = "#" + $(this).attr("for"); const id = "#" + $(this).attr("for");
$(this).siblings("a") $(this).siblings("a")
.removeClass("active"); .removeClass("active");
$(this).addClass("active"); $(this).addClass("active");
@ -104,7 +104,7 @@ L.OSM.share = function (options) {
// Geo URI // Geo URI
var $geoUriSection = $("<div>") const $geoUriSection = $("<div>")
.attr("class", "share-geo-uri p-3 border-bottom border-secondary-subtle") .attr("class", "share-geo-uri p-3 border-bottom border-secondary-subtle")
.appendTo($ui); .appendTo($ui);
@ -119,7 +119,7 @@ L.OSM.share = function (options) {
// Image // Image
var $imageSection = $("<div>") const $imageSection = $("<div>")
.attr("class", "share-image p-3") .attr("class", "share-image p-3")
.appendTo($ui); .appendTo($ui);
@ -227,8 +227,8 @@ L.OSM.share = function (options) {
.appendTo($form); .appendTo($form);
} }
var csrf_param = $("meta[name=csrf-param]").attr("content"), const csrf_param = $("meta[name=csrf-param]").attr("content"),
csrf_token = $("meta[name=csrf-token]").attr("content"); csrf_token = $("meta[name=csrf-token]").attr("content");
$("<input>") $("<input>")
.attr("name", csrf_param) .attr("name", csrf_param)
@ -236,7 +236,7 @@ L.OSM.share = function (options) {
.attr("type", "hidden") .attr("type", "hidden")
.appendTo($form); .appendTo($form);
var args = { const args = {
layer: "<span id=\"mapnik_image_layer\"></span>", layer: "<span id=\"mapnik_image_layer\"></span>",
width: "<span id=\"mapnik_image_width\"></span>", width: "<span id=\"mapnik_image_width\"></span>",
height: "<span id=\"mapnik_image_height\"></span>" height: "<span id=\"mapnik_image_height\"></span>"
@ -319,7 +319,7 @@ L.OSM.share = function (options) {
} }
function escapeHTML(string) { function escapeHTML(string) {
var htmlEscapes = { const htmlEscapes = {
"&": "&amp;", "&": "&amp;",
"<": "&lt;", "<": "&lt;",
">": "&gt;", ">": "&gt;",
@ -333,8 +333,8 @@ L.OSM.share = function (options) {
function update() { function update() {
const layer = map.getMapBaseLayer(); const layer = map.getMapBaseLayer();
var canEmbed = Boolean(layer && layer.options.canEmbed); const canEmbed = Boolean(layer && layer.options.canEmbed);
var bounds = map.getBounds(); let bounds = map.getBounds();
$("#link_marker") $("#link_marker")
.prop("checked", map.hasLayer(marker)); .prop("checked", map.hasLayer(marker));
@ -355,7 +355,7 @@ L.OSM.share = function (options) {
}); });
if (map.hasLayer(marker)) { if (map.hasLayer(marker)) {
var latLng = marker.getLatLng().wrap(); const latLng = marker.getLatLng().wrap();
params.set("marker", latLng.lat + "," + latLng.lng); params.set("marker", latLng.lat + "," + latLng.lng);
} }
@ -386,10 +386,10 @@ L.OSM.share = function (options) {
bounds = locationFilter.getBounds(); bounds = locationFilter.getBounds();
} }
var scale = $("#mapnik_scale").val(), let scale = $("#mapnik_scale").val();
size = L.bounds(L.CRS.EPSG3857.project(bounds.getSouthWest()), const size = L.bounds(L.CRS.EPSG3857.project(bounds.getSouthWest()),
L.CRS.EPSG3857.project(bounds.getNorthEast())).getSize(), L.CRS.EPSG3857.project(bounds.getNorthEast())).getSize(),
maxScale = Math.floor(Math.sqrt(size.x * size.y / 0.3136)); maxScale = Math.floor(Math.sqrt(size.x * size.y / 0.3136));
$("#mapnik_minlon").val(bounds.getWest()); $("#mapnik_minlon").val(bounds.getWest());
$("#mapnik_minlat").val(bounds.getSouth()); $("#mapnik_minlat").val(bounds.getSouth());
@ -427,17 +427,17 @@ L.OSM.share = function (options) {
} }
function getScale() { function getScale() {
var bounds = map.getBounds(), const bounds = map.getBounds(),
centerLat = bounds.getCenter().lat, centerLat = bounds.getCenter().lat,
halfWorldMeters = 6378137 * Math.PI * Math.cos(centerLat * Math.PI / 180), halfWorldMeters = 6378137 * Math.PI * Math.cos(centerLat * Math.PI / 180),
meters = halfWorldMeters * (bounds.getEast() - bounds.getWest()) / 180, meters = halfWorldMeters * (bounds.getEast() - bounds.getWest()) / 180,
pixelsPerMeter = map.getSize().x / meters, pixelsPerMeter = map.getSize().x / meters,
metersPerPixel = 1 / (92 * 39.3701); metersPerPixel = 1 / (92 * 39.3701);
return Math.round(1 / (pixelsPerMeter * metersPerPixel)); return Math.round(1 / (pixelsPerMeter * metersPerPixel));
} }
function roundScale(scale) { function roundScale(scale) {
var precision = 5 * Math.pow(10, Math.floor(Math.LOG10E * Math.log(scale)) - 2); const precision = 5 * Math.pow(10, Math.floor(Math.LOG10E * Math.log(scale)) - 2);
return precision * Math.ceil(scale / precision); return precision * Math.ceil(scale / precision);
} }
}; };

8
app/assets/javascripts/leaflet.sidebar-pane.js
View file

@ -1,11 +1,11 @@
L.OSM.sidebarPane = function (options, uiClass, buttonTitle, paneTitle) { L.OSM.sidebarPane = function (options, uiClass, buttonTitle, paneTitle) {
var control = L.control(options); const control = L.control(options);
control.onAdd = function (map) { control.onAdd = function (map) {
var $container = $("<div>") const $container = $("<div>")
.attr("class", "control-" + uiClass); .attr("class", "control-" + uiClass);
var button = $("<a>") const button = $("<a>")
.attr("class", "control-button") .attr("class", "control-button")
.attr("href", "#") .attr("href", "#")
.html("<span class=\"icon " + uiClass + "\"></span>") .html("<span class=\"icon " + uiClass + "\"></span>")
@ -17,7 +17,7 @@ L.OSM.sidebarPane = function (options, uiClass, buttonTitle, paneTitle) {
button.appendTo($container); button.appendTo($container);
var $ui = $("<div>") const $ui = $("<div>")
.attr("class", uiClass + "-ui"); .attr("class", uiClass + "-ui");
$("<div class='d-flex p-3 pb-0'>") $("<div class='d-flex p-3 pb-0'>")

12
app/assets/javascripts/leaflet.sidebar.js
View file

@ -1,7 +1,7 @@
L.OSM.sidebar = function (selector) { L.OSM.sidebar = function (selector) {
var control = {}, const control = {},
sidebar = $(selector), sidebar = $(selector);
current = $(), let current = $(),
currentButton = $(), currentButton = $(),
map; map;
@ -17,9 +17,9 @@ L.OSM.sidebar = function (selector) {
}; };
control.togglePane = function (pane, button) { control.togglePane = function (pane, button) {
var mediumDeviceWidth = window.getComputedStyle(document.documentElement).getPropertyValue("--bs-breakpoint-md"); const mediumDeviceWidth = window.getComputedStyle(document.documentElement).getPropertyValue("--bs-breakpoint-md");
var isMediumDevice = window.matchMedia(`(max-width: ${mediumDeviceWidth})`).matches; const isMediumDevice = window.matchMedia(`(max-width: ${mediumDeviceWidth})`).matches;
var paneWidth = 250; const paneWidth = 250;
current current
.hide() .hide()

12
app/assets/javascripts/leaflet.zoom.js
View file

@ -4,8 +4,8 @@ L.OSM.Zoom = L.Control.extend({
}, },
onAdd: function (map) { onAdd: function (map) {
var zoomName = "zoom", const zoomName = "zoom",
container = L.DomUtil.create("div", zoomName); container = L.DomUtil.create("div", zoomName);
this._map = map; this._map = map;
@ -32,14 +32,14 @@ L.OSM.Zoom = L.Control.extend({
}, },
_createButton: function (html, title, className, container, fn, context) { _createButton: function (html, title, className, container, fn, context) {
var link = L.DomUtil.create("a", "control-button " + className, container); const link = L.DomUtil.create("a", "control-button " + className, container);
link.innerHTML = html; link.innerHTML = html;
link.href = "#"; link.href = "#";
link.title = title; link.title = title;
L.DomUtil.create("span", "icon " + className, link); L.DomUtil.create("span", "icon " + className, link);
var stop = L.DomEvent.stopPropagation; const stop = L.DomEvent.stopPropagation;
L.DomEvent L.DomEvent
.on(link, "click", stop) .on(link, "click", stop)
@ -52,8 +52,8 @@ L.OSM.Zoom = L.Control.extend({
}, },
_updateDisabled: function () { _updateDisabled: function () {
var map = this._map, const map = this._map,
className = "disabled"; className = "disabled";
L.DomUtil.removeClass(this._zoomInButton, className); L.DomUtil.removeClass(this._zoomInButton, className);
L.DomUtil.removeClass(this._zoomOutButton, className); L.DomUtil.removeClass(this._zoomOutButton, className);

6
app/assets/javascripts/matomo.js
View file

@ -1,9 +1,9 @@
if (OSM.MATOMO) { if (OSM.MATOMO) {
$(document).ready(function () { $(document).ready(function () {
var base = document.location.protocol + "//" + OSM.MATOMO.location + "/"; const base = document.location.protocol + "//" + OSM.MATOMO.location + "/";
var matomoTracker; let matomoTracker;
var matomoLoader = $.ajax({ const matomoLoader = $.ajax({
url: base + "matomo.js", url: base + "matomo.js",
dataType: "script", dataType: "script",
cache: true, cache: true,

2
app/assets/javascripts/oauth.js
View file

@ -1,5 +1,5 @@
$(document).ready(function () { $(document).ready(function () {
var application_data = $("head").data(); const application_data = $("head").data();
if (application_data.oauthToken) { if (application_data.oauthToken) {
$.ajaxPrefilter(function (options) { $.ajaxPrefilter(function (options) {

44
app/assets/javascripts/osm.js.erb
View file

@ -44,8 +44,8 @@ OSM = {
CLOSED_NOTE_MARKER: <%= image_path("closed_note_marker.svg").to_json %>, CLOSED_NOTE_MARKER: <%= image_path("closed_note_marker.svg").to_json %>,
apiUrl: function (object) { apiUrl: function (object) {
var apiType = object.type === "note" ? "notes" : object.type; const apiType = object.type === "note" ? "notes" : object.type;
var url = "/api/" + OSM.API_VERSION + "/" + apiType + "/" + object.id; let url = "/api/" + OSM.API_VERSION + "/" + apiType + "/" + object.id;
if (object.type === "way" || object.type === "relation") { if (object.type === "way" || object.type === "relation") {
url += "/full"; url += "/full";
@ -57,13 +57,13 @@ OSM = {
}, },
params: function (search) { params: function (search) {
var query = search || window.location.search; const query = search || window.location.search;
return Object.fromEntries(new URLSearchParams(query)); return Object.fromEntries(new URLSearchParams(query));
}, },
mapParams: function (search) { mapParams: function (search) {
var params = OSM.params(search), const params = OSM.params(search),
mapParams = {}; mapParams = {};
if (params.mlon && params.mlat) { if (params.mlon && params.mlat) {
mapParams.marker = true; mapParams.marker = true;
@ -78,7 +78,7 @@ OSM = {
} }
} }
var hash = OSM.parseHash(location.hash); const hash = OSM.parseHash(location.hash);
const loc = Cookies.get("_osm_location")?.split("|"); const loc = Cookies.get("_osm_location")?.split("|");
@ -120,7 +120,7 @@ OSM = {
mapParams.layers = hash.layers || (loc && loc[3]) || ""; mapParams.layers = hash.layers || (loc && loc[3]) || "";
var scale = parseFloat(params.scale); const scale = parseFloat(params.scale);
if (scale > 0) { if (scale > 0) {
mapParams.zoom = Math.log(360.0 / (scale * 512.0)) / Math.log(2.0); mapParams.zoom = Math.log(360.0 / (scale * 512.0)) / Math.log(2.0);
} }
@ -129,19 +129,19 @@ OSM = {
}, },
parseHash: function (hash) { parseHash: function (hash) {
var args = {}; const args = {};
var i = hash.indexOf("#"); const i = hash.indexOf("#");
if (i < 0) { if (i < 0) {
return args; return args;
} }
const hashParams = new URLSearchParams(hash.slice(i + 1)); const hashParams = new URLSearchParams(hash.slice(i + 1));
var map = (hashParams.get("map") || "").split("/"), const map = (hashParams.get("map") || "").split("/"),
zoom = parseInt(map[0], 10), zoom = parseInt(map[0], 10),
lat = parseFloat(map[1]), lat = parseFloat(map[1]),
lon = parseFloat(map[2]); lon = parseFloat(map[2]);
if (!isNaN(zoom) && !isNaN(lat) && !isNaN(lon)) { if (!isNaN(zoom) && !isNaN(lat) && !isNaN(lon)) {
args.center = new L.LatLng(lat, lon); args.center = new L.LatLng(lat, lon);
@ -156,7 +156,7 @@ OSM = {
}, },
formatHash: function (args) { formatHash: function (args) {
var center, zoom, layers; let center, zoom, layers;
if (args instanceof L.Map) { if (args instanceof L.Map) {
center = args.getCenter(); center = args.getCenter();
@ -180,8 +180,8 @@ OSM = {
}, },
zoomPrecision: function (zoom) { zoomPrecision: function (zoom) {
var pixels = Math.pow(2, 8 + zoom); const pixels = Math.pow(2, 8 + zoom);
var degrees = 180; const degrees = 180;
return Math.ceil(Math.log10(pixels / degrees)); return Math.ceil(Math.log10(pixels / degrees));
}, },
@ -198,12 +198,12 @@ OSM = {
}, },
distance: function (latlng1, latlng2) { distance: function (latlng1, latlng2) {
var lat1 = latlng1.lat * Math.PI / 180, const lat1 = latlng1.lat * Math.PI / 180,
lng1 = latlng1.lng * Math.PI / 180, lng1 = latlng1.lng * Math.PI / 180,
lat2 = latlng2.lat * Math.PI / 180, lat2 = latlng2.lat * Math.PI / 180,
lng2 = latlng2.lng * Math.PI / 180, lng2 = latlng2.lng * Math.PI / 180,
latdiff = lat2 - lat1, latdiff = lat2 - lat1,
lngdiff = lng2 - lng1; lngdiff = lng2 - lng1;
return 6372795 * 2 * Math.asin( return 6372795 * 2 * Math.asin(
Math.sqrt( Math.sqrt(

24
app/assets/javascripts/richtext.js
View file

@ -5,8 +5,8 @@
* the user next switches to it. * the user next switches to it.
*/ */
$(document).on("change", ".richtext_container textarea", function () { $(document).on("change", ".richtext_container textarea", function () {
var container = $(this).closest(".richtext_container"); const container = $(this).closest(".richtext_container");
var preview = container.find(".tab-pane[id$='_preview']"); const preview = container.find(".tab-pane[id$='_preview']");
preview.children(".richtext_placeholder").attr("hidden", true).removeClass("delayed-fade-in"); preview.children(".richtext_placeholder").attr("hidden", true).removeClass("delayed-fade-in");
preview.children(".richtext").empty(); preview.children(".richtext").empty();
@ -17,10 +17,10 @@
* when switching away from an edit pane * when switching away from an edit pane
*/ */
$(document).on("hide.bs.tab", ".richtext_container button[data-bs-target$='_edit']", function () { $(document).on("hide.bs.tab", ".richtext_container button[data-bs-target$='_edit']", function () {
var container = $(this).closest(".richtext_container"); const container = $(this).closest(".richtext_container");
var editor = container.find("textarea"); const editor = container.find("textarea");
var preview = container.find(".tab-pane[id$='_preview']"); const preview = container.find(".tab-pane[id$='_preview']");
var minHeight = editor.outerHeight() - preview.outerHeight() + preview.height(); const minHeight = editor.outerHeight() - preview.outerHeight() + preview.height();
preview.css("min-height", minHeight + "px"); preview.css("min-height", minHeight + "px");
}); });
@ -29,9 +29,9 @@
* Install a handler to switch to preview mode * Install a handler to switch to preview mode
*/ */
$(document).on("show.bs.tab", ".richtext_container button[data-bs-target$='_preview']", function () { $(document).on("show.bs.tab", ".richtext_container button[data-bs-target$='_preview']", function () {
var container = $(this).closest(".richtext_container"); const container = $(this).closest(".richtext_container");
var editor = container.find("textarea"); const editor = container.find("textarea");
var preview = container.find(".tab-pane[id$='_preview']"); const preview = container.find(".tab-pane[id$='_preview']");
if (preview.children(".richtext").contents().length === 0) { if (preview.children(".richtext").contents().length === 0) {
preview.children(".richtext_placeholder").removeAttr("hidden").addClass("delayed-fade-in"); preview.children(".richtext_placeholder").removeAttr("hidden").addClass("delayed-fade-in");
@ -50,18 +50,18 @@
}); });
function invalidTextareaListener() { function invalidTextareaListener() {
var container = $(this).closest(".richtext_container"); const container = $(this).closest(".richtext_container");
container.find("button[data-bs-target$='_edit']").tab("show"); container.find("button[data-bs-target$='_edit']").tab("show");
} }
function updateHelp() { function updateHelp() {
$(".richtext_container .richtext_help_sidebar:not(:visible):not(:empty)").each(function () { $(".richtext_container .richtext_help_sidebar:not(:visible):not(:empty)").each(function () {
var container = $(this).closest(".richtext_container"); const container = $(this).closest(".richtext_container");
$(this).children().appendTo(container.find(".tab-pane[id$='_help']")); $(this).children().appendTo(container.find(".tab-pane[id$='_help']"));
}); });
$(".richtext_container .richtext_help_sidebar:visible:empty").each(function () { $(".richtext_container .richtext_help_sidebar:visible:empty").each(function () {
var container = $(this).closest(".richtext_container"); const container = $(this).closest(".richtext_container");
container.find(".tab-pane[id$='_help']").children().appendTo($(this)); container.find(".tab-pane[id$='_help']").children().appendTo($(this));
if (container.find("button[data-bs-target$='_help'].active").length) { if (container.find("button[data-bs-target$='_help'].active").length) {
container.find("button[data-bs-target$='_edit']").tab("show"); container.find("button[data-bs-target$='_edit']").tab("show");

38
app/assets/javascripts/router.js
View file

@ -47,13 +47,13 @@
move the map without the hash changing. move the map without the hash changing.
*/ */
OSM.Router = function (map, rts) { OSM.Router = function (map, rts) {
var escapeRegExp = /[-{}[\]+?.,\\^$|#\s]/g; const escapeRegExp = /[-{}[\]+?.,\\^$|#\s]/g;
var optionalParam = /\((.*?)\)/g; const optionalParam = /\((.*?)\)/g;
var namedParam = /(\(\?)?:\w+/g; const namedParam = /(\(\?)?:\w+/g;
var splatParam = /\*\w+/g; const splatParam = /\*\w+/g;
function Route(path, controller) { function Route(path, controller) {
var regexp = new RegExp("^" + const regexp = new RegExp("^" +
path.replace(escapeRegExp, "\\$&") path.replace(escapeRegExp, "\\$&")
.replace(optionalParam, "(?:$1)?") .replace(optionalParam, "(?:$1)?")
.replace(namedParam, function (match, optional) { .replace(namedParam, function (match, optional) {
@ -61,14 +61,14 @@ OSM.Router = function (map, rts) {
}) })
.replace(splatParam, "(.*?)") + "(?:\\?.*)?$"); .replace(splatParam, "(.*?)") + "(?:\\?.*)?$");
var route = {}; const route = {};
route.match = function (path) { route.match = function (path) {
return regexp.test(path); return regexp.test(path);
}; };
route.run = function (action, path) { route.run = function (action, path) {
var params = []; let params = [];
if (path) { if (path) {
params = regexp.exec(path).map(function (param, i) { params = regexp.exec(path).map(function (param, i) {
@ -93,15 +93,15 @@ OSM.Router = function (map, rts) {
} }
}; };
var currentPath = window.location.pathname.replace(/(.)\/$/, "$1") + window.location.search, let currentPath = window.location.pathname.replace(/(.)\/$/, "$1") + window.location.search,
currentRoute = routes.recognize(currentPath), currentRoute = routes.recognize(currentPath),
currentHash = location.hash || OSM.formatHash(map); currentHash = location.hash || OSM.formatHash(map);
var router = {}; const router = {};
function updateSecondaryNav() { function updateSecondaryNav() {
$("header nav.secondary > ul > li > a").each(function () { $("header nav.secondary > ul > li > a").each(function () {
var active = $(this).attr("href") === window.location.pathname; const active = $(this).attr("href") === window.location.pathname;
$(this) $(this)
.toggleClass("text-secondary", !active) .toggleClass("text-secondary", !active)
@ -111,8 +111,8 @@ OSM.Router = function (map, rts) {
$(window).on("popstate", function (e) { $(window).on("popstate", function (e) {
if (!e.originalEvent.state) return; // Is it a real popstate event or just a hash change? if (!e.originalEvent.state) return; // Is it a real popstate event or just a hash change?
var path = window.location.pathname + window.location.search, const path = window.location.pathname + window.location.search,
route = routes.recognize(path); route = routes.recognize(path);
if (path === currentPath) return; if (path === currentPath) return;
currentRoute.run("unload", null, route === currentRoute); currentRoute.run("unload", null, route === currentRoute);
currentPath = path; currentPath = path;
@ -123,11 +123,11 @@ OSM.Router = function (map, rts) {
}); });
router.route = function (url) { router.route = function (url) {
var path = url.replace(/#.*/, ""), const path = url.replace(/#.*/, ""),
route = routes.recognize(path); route = routes.recognize(path);
if (!route) return false; if (!route) return false;
currentRoute.run("unload", null, route === currentRoute); currentRoute.run("unload", null, route === currentRoute);
var state = OSM.parseHash(url); const state = OSM.parseHash(url);
map.setState(state); map.setState(state);
window.history.pushState(state, document.title, url); window.history.pushState(state, document.title, url);
currentPath = path; currentPath = path;
@ -147,17 +147,17 @@ OSM.Router = function (map, rts) {
}; };
router.updateHash = function () { router.updateHash = function () {
var hash = OSM.formatHash(map); const hash = OSM.formatHash(map);
if (hash === currentHash) return; if (hash === currentHash) return;
currentHash = hash; currentHash = hash;
router.stateChange(OSM.parseHash(hash)); router.stateChange(OSM.parseHash(hash));
}; };
router.hashUpdated = function () { router.hashUpdated = function () {
var hash = location.hash; const hash = location.hash;
if (hash === currentHash) return; if (hash === currentHash) return;
currentHash = hash; currentHash = hash;
var state = OSM.parseHash(hash); const state = OSM.parseHash(hash);
map.setState(state); map.setState(state);
router.stateChange(state, hash); router.stateChange(state, hash);
}; };
@ -176,7 +176,7 @@ OSM.Router = function (map, rts) {
}; };
router.load = function () { router.load = function () {
var loadState = currentRoute.run("load", currentPath); const loadState = currentRoute.run("load", currentPath);
router.stateChange(loadState || {}); router.stateChange(loadState || {});
}; };

40
app/assets/javascripts/user.js
View file

@ -7,8 +7,8 @@
}()); }());
$(document).ready(function () { $(document).ready(function () {
var defaultHomeZoom = 12; const defaultHomeZoom = 12;
var map, marker, deleted_lat, deleted_lon; let map, marker, deleted_lat, deleted_lon;
if ($("#map").length) { if ($("#map").length) {
map = L.map("map", { map = L.map("map", {
@ -16,12 +16,12 @@ $(document).ready(function () {
zoomControl: false zoomControl: false
}).addLayer(new L.OSM.Mapnik()); }).addLayer(new L.OSM.Mapnik());
var position = $("html").attr("dir") === "rtl" ? "topleft" : "topright"; const position = $("html").attr("dir") === "rtl" ? "topleft" : "topright";
L.OSM.zoom({ position: position }) L.OSM.zoom({ position: position })
.addTo(map); .addTo(map);
var locate = L.control.locate({ const locate = L.control.locate({
position: position, position: position,
icon: "icon geolocate", icon: "icon geolocate",
iconLoading: "icon geolocate", iconLoading: "icon geolocate",
@ -33,7 +33,7 @@ $(document).ready(function () {
} }
}).addTo(map); }).addTo(map);
var locateContainer = locate.getContainer(); const locateContainer = locate.getContainer();
$(locateContainer) $(locateContainer)
.removeClass("leaflet-control-locate leaflet-bar") .removeClass("leaflet-control-locate leaflet-bar")
@ -73,9 +73,9 @@ $(document).ready(function () {
deleted_lon = null; deleted_lon = null;
respondToHomeUpdate(); respondToHomeUpdate();
}).on("moveend", function () { }).on("moveend", function () {
var lat = $("#home_lat").val().trim(), const lat = $("#home_lat").val().trim(),
lon = $("#home_lon").val().trim(), lon = $("#home_lon").val().trim();
location; let location;
try { try {
if (lat && lon) { if (lat && lon) {
@ -95,15 +95,15 @@ $(document).ready(function () {
}); });
$("#home_show").click(function () { $("#home_show").click(function () {
var lat = $("#home_lat").val(), const lat = $("#home_lat").val(),
lon = $("#home_lon").val(); lon = $("#home_lon").val();
map.setView([lat, lon], defaultHomeZoom); map.setView([lat, lon], defaultHomeZoom);
}); });
$("#home_delete").click(function () { $("#home_delete").click(function () {
var lat = $("#home_lat").val(), const lat = $("#home_lat").val(),
lon = $("#home_lon").val(); lon = $("#home_lon").val();
$("#home_lat, #home_lon").val(""); $("#home_lat, #home_lon").val("");
deleted_lat = lat; deleted_lat = lat;
@ -122,7 +122,7 @@ $(document).ready(function () {
}); });
} else { } else {
$("[data-user]").each(function () { $("[data-user]").each(function () {
var user = $(this).data("user"); const user = $(this).data("user");
if (user.lon && user.lat) { if (user.lon && user.lat) {
L.marker([user.lat, user.lon], { icon: OSM.getUserIcon(user.icon) }).addTo(map) L.marker([user.lat, user.lon], { icon: OSM.getUserIcon(user.icon) }).addTo(map)
.bindPopup(user.description, { minWidth: 200 }); .bindPopup(user.description, { minWidth: 200 });
@ -132,9 +132,9 @@ $(document).ready(function () {
} }
function respondToHomeUpdate() { function respondToHomeUpdate() {
var lat = $("#home_lat").val().trim(), const lat = $("#home_lat").val().trim(),
lon = $("#home_lon").val().trim(), lon = $("#home_lon").val().trim();
location; let location;
try { try {
if (lat && lon) { if (lat && lon) {
@ -160,14 +160,14 @@ $(document).ready(function () {
} }
function isCloseEnoughToMapCenter(location) { function isCloseEnoughToMapCenter(location) {
var inputPt = map.latLngToContainerPoint(location), const inputPt = map.latLngToContainerPoint(location),
centerPt = map.latLngToContainerPoint(map.getCenter()); centerPt = map.latLngToContainerPoint(map.getCenter());
return centerPt.distanceTo(inputPt) < 10; return centerPt.distanceTo(inputPt) < 10;
} }
function updateAuthUID() { function updateAuthUID() {
var provider = $("select#user_auth_provider").val(); const provider = $("select#user_auth_provider").val();
if (provider === "openid") { if (provider === "openid") {
$("input#user_auth_uid").show().prop("disabled", false); $("input#user_auth_uid").show().prop("disabled", false);
@ -210,7 +210,7 @@ $(document).ready(function () {
}); });
$("input[name=legale]").change(function () { $("input[name=legale]").change(function () {
var url = $(this).data("url"); const url = $(this).data("url");
$("#contributorTerms").html("<div class='spinner-border' role='status'><span class='visually-hidden'>" + I18n.t("browse.start_rjs.loading") + "</span></div>"); $("#contributorTerms").html("<div class='spinner-border' role='status'><span class='visually-hidden'>" + I18n.t("browse.start_rjs.loading") + "</span></div>");
$("#contributorTerms").load(url); $("#contributorTerms").load(url);

4
app/assets/javascripts/welcome.js
View file

@ -1,8 +1,8 @@
$(document).ready(function () { $(document).ready(function () {
var params = OSM.params(); const params = OSM.params();
if (params.lat && params.lon) { if (params.lat && params.lon) {
var url = "/edit"; let url = "/edit";
if (params.editor) url += "?editor=" + params.editor; if (params.editor) url += "?editor=" + params.editor;
if (!params.zoom) params.zoom = 17; if (!params.zoom) params.zoom = 17;

44
test/javascripts/osm_test.js
View file

@ -23,7 +23,7 @@ describe("OSM", function () {
describe(".params", function () { describe(".params", function () {
it("parses params", function () { it("parses params", function () {
var params = OSM.params("?foo=a&bar=b"); const params = OSM.params("?foo=a&bar=b");
expect(params).to.have.property("foo", "a"); expect(params).to.have.property("foo", "a");
expect(params).to.have.property("bar", "b"); expect(params).to.have.property("bar", "b");
}); });
@ -41,14 +41,14 @@ describe("OSM", function () {
}); });
it("parses marker params", function () { it("parses marker params", function () {
var params = OSM.mapParams("?mlat=57.6247&mlon=-3.6845"); const params = OSM.mapParams("?mlat=57.6247&mlon=-3.6845");
expect(params).to.have.property("mlat", 57.6247); expect(params).to.have.property("mlat", 57.6247);
expect(params).to.have.property("mlon", -3.6845); expect(params).to.have.property("mlon", -3.6845);
expect(params).to.have.property("marker", true); expect(params).to.have.property("marker", true);
}); });
it("parses object params", function () { it("parses object params", function () {
var params = OSM.mapParams("?node=1"); let params = OSM.mapParams("?node=1");
expect(params).to.have.property("object"); expect(params).to.have.property("object");
expect(params.object).to.eql({ type: "node", id: 1 }); expect(params.object).to.eql({ type: "node", id: 1 });
@ -62,8 +62,8 @@ describe("OSM", function () {
}); });
it("parses bbox params", function () { it("parses bbox params", function () {
var expected = L.latLngBounds([57.6247, -3.6845], [57.7247, -3.7845]); const expected = L.latLngBounds([57.6247, -3.6845], [57.7247, -3.7845]);
var params = OSM.mapParams("?bbox=-3.6845,57.6247,-3.7845,57.7247"); let params = OSM.mapParams("?bbox=-3.6845,57.6247,-3.7845,57.7247");
expect(params).to.have.property("bounds").deep.equal(expected); expect(params).to.have.property("bounds").deep.equal(expected);
params = OSM.mapParams("?minlon=-3.6845&minlat=57.6247&maxlon=-3.7845&maxlat=57.7247"); params = OSM.mapParams("?minlon=-3.6845&minlat=57.6247&maxlon=-3.7845&maxlat=57.7247");
@ -71,7 +71,7 @@ describe("OSM", function () {
}); });
it("parses mlat/mlon/zoom params", function () { it("parses mlat/mlon/zoom params", function () {
var params = OSM.mapParams("?mlat=57.6247&mlon=-3.6845"); let params = OSM.mapParams("?mlat=57.6247&mlon=-3.6845");
expect(params).to.have.property("lat", 57.6247); expect(params).to.have.property("lat", 57.6247);
expect(params).to.have.property("lon", -3.6845); expect(params).to.have.property("lon", -3.6845);
expect(params).to.have.property("zoom", 12); expect(params).to.have.property("zoom", 12);
@ -92,21 +92,21 @@ describe("OSM", function () {
it("sets lat/lon from OSM.home", function () { it("sets lat/lon from OSM.home", function () {
OSM.home = { lat: 57.6247, lon: -3.6845 }; OSM.home = { lat: 57.6247, lon: -3.6845 };
var params = OSM.mapParams("?"); const params = OSM.mapParams("?");
expect(params).to.have.property("lat", 57.6247); expect(params).to.have.property("lat", 57.6247);
expect(params).to.have.property("lon", -3.6845); expect(params).to.have.property("lon", -3.6845);
}); });
it("sets bbox from OSM.location", function () { it("sets bbox from OSM.location", function () {
OSM.location = { minlon: -3.6845, minlat: 57.6247, maxlon: -3.7845, maxlat: 57.7247 }; OSM.location = { minlon: -3.6845, minlat: 57.6247, maxlon: -3.7845, maxlat: 57.7247 };
var expected = L.latLngBounds([57.6247, -3.6845], [57.7247, -3.7845]); const expected = L.latLngBounds([57.6247, -3.6845], [57.7247, -3.7845]);
var params = OSM.mapParams("?"); const params = OSM.mapParams("?");
expect(params).to.have.property("bounds").deep.equal(expected); expect(params).to.have.property("bounds").deep.equal(expected);
}); });
it("parses params from the _osm_location cookie", function () { it("parses params from the _osm_location cookie", function () {
document.cookie = "_osm_location=-3.6845|57.6247|5|M"; document.cookie = "_osm_location=-3.6845|57.6247|5|M";
var params = OSM.mapParams("?"); const params = OSM.mapParams("?");
expect(params).to.have.property("lat", 57.6247); expect(params).to.have.property("lat", 57.6247);
expect(params).to.have.property("lon", -3.6845); expect(params).to.have.property("lon", -3.6845);
expect(params).to.have.property("zoom", 5); expect(params).to.have.property("zoom", 5);
@ -114,7 +114,7 @@ describe("OSM", function () {
}); });
it("defaults lat/lon to London", function () { it("defaults lat/lon to London", function () {
var params = OSM.mapParams("?"); let params = OSM.mapParams("?");
expect(params).to.have.property("lat", 51.5); expect(params).to.have.property("lat", 51.5);
expect(params).to.have.property("lon", -0.1); expect(params).to.have.property("lon", -0.1);
expect(params).to.have.property("zoom", 5); expect(params).to.have.property("zoom", 5);
@ -126,7 +126,7 @@ describe("OSM", function () {
}); });
it("parses layers param", function () { it("parses layers param", function () {
var params = OSM.mapParams("?"); let params = OSM.mapParams("?");
expect(params).to.have.property("layers", ""); expect(params).to.have.property("layers", "");
document.cookie = "_osm_location=-3.6845|57.6247|5|C"; document.cookie = "_osm_location=-3.6845|57.6247|5|C";
@ -141,25 +141,25 @@ describe("OSM", function () {
describe(".parseHash", function () { describe(".parseHash", function () {
it("parses lat/lon/zoom params", function () { it("parses lat/lon/zoom params", function () {
var args = OSM.parseHash("#map=5/57.6247/-3.6845&layers=M"); const args = OSM.parseHash("#map=5/57.6247/-3.6845&layers=M");
expect(args).to.have.property("center").deep.equal(L.latLng(57.6247, -3.6845)); expect(args).to.have.property("center").deep.equal(L.latLng(57.6247, -3.6845));
expect(args).to.have.property("zoom", 5); expect(args).to.have.property("zoom", 5);
}); });
it("parses layers params", function () { it("parses layers params", function () {
var args = OSM.parseHash("#map=5/57.6247/-3.6845&layers=M"); const args = OSM.parseHash("#map=5/57.6247/-3.6845&layers=M");
expect(args).to.have.property("layers", "M"); expect(args).to.have.property("layers", "M");
}); });
}); });
describe(".formatHash", function () { describe(".formatHash", function () {
it("formats lat/lon/zoom params", function () { it("formats lat/lon/zoom params", function () {
var args = { center: L.latLng(57.6247, -3.6845), zoom: 9 }; const args = { center: L.latLng(57.6247, -3.6845), zoom: 9 };
expect(OSM.formatHash(args)).to.eq("#map=9/57.625/-3.685"); expect(OSM.formatHash(args)).to.eq("#map=9/57.625/-3.685");
}); });
it("respects zoomPrecision", function () { it("respects zoomPrecision", function () {
var args = { center: L.latLng(57.6247, -3.6845), zoom: 5 }; let args = { center: L.latLng(57.6247, -3.6845), zoom: 5 };
expect(OSM.formatHash(args)).to.eq("#map=5/57.62/-3.68"); expect(OSM.formatHash(args)).to.eq("#map=5/57.62/-3.68");
@ -172,12 +172,12 @@ describe("OSM", function () {
}); });
it("formats layers params", function () { it("formats layers params", function () {
var args = { center: L.latLng(57.6247, -3.6845), zoom: 9, layers: "C" }; const args = { center: L.latLng(57.6247, -3.6845), zoom: 9, layers: "C" };
expect(OSM.formatHash(args)).to.eq("#map=9/57.625/-3.685&layers=C"); expect(OSM.formatHash(args)).to.eq("#map=9/57.625/-3.685&layers=C");
}); });
it("ignores default layers", function () { it("ignores default layers", function () {
var args = { center: L.latLng(57.6247, -3.6845), zoom: 9, layers: "M" }; const args = { center: L.latLng(57.6247, -3.6845), zoom: 9, layers: "M" };
expect(OSM.formatHash(args)).to.eq("#map=9/57.625/-3.685"); expect(OSM.formatHash(args)).to.eq("#map=9/57.625/-3.685");
}); });
}); });
@ -230,14 +230,14 @@ describe("OSM", function () {
describe(".locationCookie", function () { describe(".locationCookie", function () {
it("creates a location cookie value", function () { it("creates a location cookie value", function () {
$("body").html($("<div id='map'>")); $("body").html($("<div id='map'>"));
var map = new L.OSM.Map("map", { center: [57.6247, -3.6845], zoom: 9 }); const map = new L.OSM.Map("map", { center: [57.6247, -3.6845], zoom: 9 });
map.updateLayers(""); map.updateLayers("");
expect(OSM.locationCookie(map)).to.eq("-3.685|57.625|9|M"); expect(OSM.locationCookie(map)).to.eq("-3.685|57.625|9|M");
}); });
it("respects zoomPrecision", function () { it("respects zoomPrecision", function () {
$("body").html($("<div id='map'>")); $("body").html($("<div id='map'>"));
var map = new L.OSM.Map("map", { center: [57.6247, -3.6845], zoom: 9 }); const map = new L.OSM.Map("map", { center: [57.6247, -3.6845], zoom: 9 });
map.updateLayers(""); map.updateLayers("");
expect(OSM.locationCookie(map)).to.eq("-3.685|57.625|9|M"); expect(OSM.locationCookie(map)).to.eq("-3.685|57.625|9|M");
// map.setZoom() doesn't update the zoom level for some reason // map.setZoom() doesn't update the zoom level for some reason
@ -249,8 +249,8 @@ describe("OSM", function () {
describe(".distance", function () { describe(".distance", function () {
it("computes distance between points", function () { it("computes distance between points", function () {
var latlng1 = L.latLng(51.76712, -0.00484), const latlng1 = L.latLng(51.76712, -0.00484),
latlng2 = L.latLng(51.7675159, -0.0078329); latlng2 = L.latLng(51.7675159, -0.0078329);
expect(OSM.distance(latlng1, latlng2)).to.be.closeTo(210.664, 0.005); expect(OSM.distance(latlng1, latlng2)).to.be.closeTo(210.664, 0.005);
expect(OSM.distance(latlng2, latlng1)).to.be.closeTo(210.664, 0.005); expect(OSM.distance(latlng2, latlng1)).to.be.closeTo(210.664, 0.005);