Further usage of URLSearchParams

diff --git a/app/assets/javascripts/index/directions-endpoint.js b/app/assets/javascripts/index/directions-endpoint.js
index 3fdae7c5413560139ada1e4150957d84523da2c5..11a70c62f051448f7b43e6d2a4b56c22902ccec9 100644 (file)
--- a/app/assets/javascripts/index/directions-endpoint.js
+++ b/app/assets/javascripts/index/directions-endpoint.js
@@ -101,8 +101,8 @@ OSM.DirectionsEndpoint = function Endpoint(map, input, iconUrl, dragCallback, ch
   };
 
   function getGeocode() {
   };
 
   function getGeocode() {

-    var viewbox = map.getBounds().toBBoxString(); // <sw lon>,<sw lat>,<ne lon>,<ne lat>
-    var geocodeUrl = OSM.NOMINATIM_URL + "search?q=" + encodeURIComponent(endpoint.value) + "&format=json&viewbox=" + viewbox;
+    const viewbox = map.getBounds().toBBoxString(), // <sw lon>,<sw lat>,<ne lon>,<ne lat>
+          geocodeUrl = OSM.NOMINATIM_URL + "search?" + new URLSearchParams({ q: endpoint.value, format: "json", viewbox });

 
     endpoint.geocodeRequest = $.getJSON(geocodeUrl, function (json) {
       delete endpoint.geocodeRequest;
 
     endpoint.geocodeRequest = $.getJSON(geocodeUrl, function (json) {
       delete endpoint.geocodeRequest;


@@ -123,8 +123,9 @@ OSM.DirectionsEndpoint = function Endpoint(map, input, iconUrl, dragCallback, ch
   }
 
   function getReverseGeocode() {
   }
 
   function getReverseGeocode() {

-    var latlng = endpoint.latlng.clone();
-    var reverseGeocodeUrl = OSM.NOMINATIM_URL + "reverse?lat=" + latlng.lat + "&lon=" + latlng.lng + "&format=json";
+    const latlng = endpoint.latlng.clone(),
+          { lat, lng } = latlng,
+          reverseGeocodeUrl = OSM.NOMINATIM_URL + "reverse?" + new URLSearchParams({ lat, lon: lng, format: "json" });

 
     endpoint.geocodeRequest = $.getJSON(reverseGeocodeUrl, function (json) {
       delete endpoint.geocodeRequest;
 
     endpoint.geocodeRequest = $.getJSON(reverseGeocodeUrl, function (json) {
       delete endpoint.geocodeRequest;

diff --git a/app/assets/javascripts/index/search.js b/app/assets/javascripts/index/search.js
index e54c5132c65ab4dca495aa72bfc9ed380718df7b..23af46145b0ae9295870bce53e778a31a93d87de 100644 (file)
--- a/app/assets/javascripts/index/search.js
+++ b/app/assets/javascripts/index/search.js
@@ -10,22 +10,18 @@ OSM.Search = function (map) {
   $(".search_form a.btn.switch_link").on("click", function (e) {
     e.preventDefault();
     var query = $(this).closest("form").find("input[name=query]").val();
   $(".search_form a.btn.switch_link").on("click", function (e) {
     e.preventDefault();
     var query = $(this).closest("form").find("input[name=query]").val();

-    if (query) {
-      OSM.router.route("/directions?from=" + encodeURIComponent(query) + OSM.formatHash(map));
-    } else {
-      OSM.router.route("/directions" + OSM.formatHash(map));
-    }
+    let search = "";
+    if (query) search = "?" + new URLSearchParams({ from: query });
+    OSM.router.route("/directions" + search + OSM.formatHash(map));

   });
 
   $(".search_form").on("submit", function (e) {
     e.preventDefault();
     $("header").addClass("closed");
     var query = $(this).find("input[name=query]").val();
   });
 
   $(".search_form").on("submit", function (e) {
     e.preventDefault();
     $("header").addClass("closed");
     var query = $(this).find("input[name=query]").val();

-    if (query) {
-      OSM.router.route("/search?query=" + encodeURIComponent(query) + OSM.formatHash(map));
-    } else {
-      OSM.router.route("/" + OSM.formatHash(map));
-    }
+    let search = "/";
+    if (query) search = "/search?" + new URLSearchParams({ query });
+    OSM.router.route(search + OSM.formatHash(map));

   });
 
   $(".describe_location").on("click", function (e) {
   });
 
   $(".describe_location").on("click", function (e) {

diff --git a/app/assets/javascripts/leaflet.share.js b/app/assets/javascripts/leaflet.share.js
index 7d8462f4614662c20900595ff23f891ec7b008da..e89608afda7dce94c127d208942be2ee9083c91e 100644 (file)
--- a/app/assets/javascripts/leaflet.share.js
+++ b/app/assets/javascripts/leaflet.share.js
@@ -349,14 +349,14 @@ L.OSM.share = function (options) {
       $("#short_link").attr("href", map.getShortUrl(marker));
       $("#long_link").attr("href", map.getUrl(marker));
 
       $("#short_link").attr("href", map.getShortUrl(marker));
       $("#long_link").attr("href", map.getUrl(marker));
 

-      var params = {
+      const params = new URLSearchParams({

         bbox: bounds.toBBoxString(),
         layer: map.getMapBaseLayerId()
         bbox: bounds.toBBoxString(),
         layer: map.getMapBaseLayerId()

-      };
+      });

 
       if (map.hasLayer(marker)) {
         var latLng = marker.getLatLng().wrap();
 
       if (map.hasLayer(marker)) {
         var latLng = marker.getLatLng().wrap();

-        params.marker = latLng.lat + "," + latLng.lng;
+        params.set("marker", latLng.lat + "," + latLng.lng);

       }
 
       $("#embed_link")
       }
 
       $("#embed_link")


@@ -369,7 +369,7 @@ L.OSM.share = function (options) {
 
       $("#embed_html").val(
         "<iframe width=\"425\" height=\"350\" src=\"" +
 
       $("#embed_html").val(
         "<iframe width=\"425\" height=\"350\" src=\"" +

-          escapeHTML(OSM.SERVER_PROTOCOL + "://" + OSM.SERVER_URL + "/export/embed.html?" + $.param(params)) +
+          escapeHTML(OSM.SERVER_PROTOCOL + "://" + OSM.SERVER_URL + "/export/embed.html?" + params) +

           "\" style=\"border: 1px solid black\"></iframe><br/>" +
           "<small><a href=\"" + escapeHTML(map.getUrl(marker)) + "\">" +
           escapeHTML(I18n.t("javascripts.share.view_larger_map")) + "</a></small>");
           "\" style=\"border: 1px solid black\"></iframe><br/>" +
           "<small><a href=\"" + escapeHTML(map.getUrl(marker)) + "\">" +
           escapeHTML(I18n.t("javascripts.share.view_larger_map")) + "</a></small>");