Also apply filters to the local/bounding box search, fix an issue whe…

…re the search did not succeed because of an empty comments array (openstreetmap/openstreetmap-website#2146)

js/common.js

@@ -195,10 +195,9 @@ const UI = (function() {
   };
 
   me.getAgeOfNote = function(date) {
-    const today = new Date();
-    //see https://stackoverflow.com/a/3257513
+    // See https://stackoverflow.com/a/3257513
     date = new Date(date.replace(/-/g, '/'));
-    const difference = Math.abs(today.getTime() - date.getTime());
+    const difference = Math.abs(new Date().getTime() - date.getTime());
 
     const age = {
       seconds: Math.round(difference / (1000)),
@@ -251,7 +250,7 @@ const UI = (function() {
     }
 
     return {
-      badge: '<span class="new badge ' + color + '" data-badge-caption="' + caption + '">' + amount + '</span>',
+      badge: `<span class="new badge ${color}" data-badge-caption="${caption}" title="${date.toLocaleDateString()}">${amount}</span>`,
       icon: icon
     };
   };
@@ -319,6 +318,7 @@ const UI = (function() {
     M.Datepicker.init(document.querySelectorAll('.datepicker'), {
       format: 'yyyy-mm-d',
       firstDay: 1,
+      showClearBtn: true,
       i18n: {
         cancel: Localizer.getMessage('action.cancel'),
         clear: Localizer.getMessage('action.clear'),
@@ -335,7 +335,7 @@ const UI = (function() {
       startSearch();
     });
 
-    // other things
+    // Other things
     storage();
     searchParams();
     UI.tooltip();
@@ -353,7 +353,7 @@ const Localizer = (function() {
   let fallback;
 
   function replaceI18n(elem, tag) {
-    // localize main content
+    // Localize main content
     if (tag !== '') {
       const isHTML = tag.startsWith('[html]');
       if (isHTML) {
@@ -414,7 +414,7 @@ const Localizer = (function() {
           replaceI18n(currentElem, contentString);
         });
 
-        // replace html lang attribut after translation
+        // Replace html lang attribut after translation
         document.querySelector('html').setAttribute('lang', locale);
 
         if (typeof callback === 'function') {
@@ -612,6 +612,11 @@ const Permalink = (function() { // eslint-disable-line no-unused-vars
 })();
 
 function startSearch() {
+  // Don't start a new search if the geocoding input is focused
+  if (Mode.get() === Mode.MAPS && document.querySelector('.leaflet-control-geocoder-form input') == document.activeElement) {
+    return;
+  }
+
   const query = UI.queryInput.value;
   let limit = UI.limitInput.value;
   const searchClosed = UI.searchClosed.checked;
@@ -624,11 +629,6 @@ function startSearch() {
     closed = '-1';
   }
 
-  // don't start a new search if the geocoding input is focused
-  if (Mode.get() === Mode.MAPS && document.querySelector('.leaflet-control-geocoder-form input') == document.activeElement) {
-    return;
-  }
-
   if (limit > 10000) {
     limit = 10000;
     UI.limitInput.value = 10000;

js/expert.js

@@ -27,6 +27,13 @@ const Expert = (function() { // eslint-disable-line no-unused-vars
         const note = feature.properties;
         const geometry = feature.geometry;
         const comment = note.comments[0];
+
+        /* Exclude invalid notes
+        See also https://github.com/openstreetmap/openstreetmap-website/issues/2146 */
+        if (note.comments.length === 0) {
+          continue;
+        }
+
         if (ids.indexOf(note.id) === -1) {
           if (['anonymous', Localizer.getMessage('note.anonymous')].includes(user) && typeof comment.user !== 'undefined') {
             continue;

js/map.js

@@ -20,13 +20,16 @@ function search(query, limit, closed, user, from, to) {
     url = [];
 
     if (size < 0.25) {
+      // Search only in one bounding box
       url = Request.buildURL(Maps.getBBox(), limit, closed, user, from, to, true);
     } else if (size >= 0.25 && size <= 1) {
+      // Split the bounding box into four parts and make the requests after each other
       const split = Maps.splitBBox(Maps.getBounds());
       for (let i = 0; i < split.length; i++) {
         url.push(Request.buildURL(split[i].toBBoxString(), limit, closed, user, from, to, true));
       }
     } else if (size >= 1 && size <= 4) {
+      // Split the bounding box into sixteen parts and make the requests after each other
       let split = [];
       const firstSplit = Maps.splitBBox(Maps.getBounds());
       for (let i = 0; i < firstSplit.length; i++) {
@@ -45,10 +48,10 @@ function search(query, limit, closed, user, from, to) {
 
     let ids = [];
 
-    //Prepare the GeoJSON layer and bind the popups
+    // Prepare the GeoJSON layer and bind the popups
     const geoJSONLayer = L.geoJSON(result, {
       filter: function(feature) {
-        return filterGeoJSON(feature, useNormalApi, ids, query);
+        return filterGeoJSON(feature.properties, useNormalApi, ids, query, user, from, to);
       },
       onEachFeature: function(feature, layer) {
         const note = feature.properties;
@@ -124,11 +127,18 @@ function search(query, limit, closed, user, from, to) {
   });
 }
 
-function filterGeoJSON(feature, useNormalApi, ids, query) {
+function filterGeoJSON(note, useNormalApi, ids, query, user, from, to) {
   if (useNormalApi) {
-    return ids.indexOf(feature.properties.id) === -1 && feature.properties.comments[0].text.toLocaleUpperCase().includes(query.toLocaleUpperCase());
+    from = from === '' ? new Date(0) : new Date(from);
+    to = to === '' ? new Date() : new Date(to);
+    const created = new Date(note.date_created.replace(/-/g, '/'));
+
+    return (ids.indexOf(note.id) === -1) && // Check whether the note is not yet in the array
+           (note.comments[0].text.toLocaleUpperCase().includes(query.toLocaleUpperCase())) && // Check whether the query is included in the comment
+           (created > from && created < to) && // Check whether the note was created during the correct range
+           (user !== '' ? user.localeCompare(note.comments[0].user || Localizer.getMessage('note.anonymous')) === 0 : true); // Check whether the specified user also created the note
   }
-  return ids.indexOf(feature.properties.id) === -1;
+  return ids.indexOf(note.id) === -1;
 }
 
 const Maps = (function() {

package.json

@@ -15,7 +15,7 @@
   },
   "license": "GPL-3.0",
   "devDependencies": {
-    "eslint": "^5.11.1",
+    "eslint": "^5.14.1",
     "html-minifier": "^3.5.21",
     "mustache": "^3.0.1"
   },