calque affichant des infos QA

js/lcm_main.js

@@ -8,6 +8,7 @@ import lcm_config from './lcm_config.js'
 import lcm_utils from './lcm_utils.js'
 import lcm_color_utils from './lcm_color_utils.js'
 import { sendToJOSM, createJOSMEditLink } from './lcm_editor.js'
+import { valid_qa_message } from './lcm_utils.js'
 
 let geojsondata;
 let lastLatLng;
@@ -246,6 +247,7 @@ function updateURLWithMapCoordinatesAndZoom() {
 
 
 let all_stations_markers = L.layerGroup().addTo(map) // layer group pour tous les marqueurs
+let bad_tags_markers = L.layerGroup()// layer group pour les marqueurs avec des problèmes de qualité
 // let stations_much_speed_wow = L.layerGroup().addTo(map) // layer group des stations rapides
 
 var osm = L.tileLayer(lcm_config.tileServers.osm, {
@@ -680,6 +682,7 @@ function eachFeature(feature, layer, stats) {
             return;
         }
     }
+
     /**
      * bornes sans informations, suggérer d'ajouter des tags dans OSM
      */
@@ -692,7 +695,14 @@ function eachFeature(feature, layer, stats) {
     // contenu de la popup
     let html = `<span class="color-indication" style="background-color: ${lcm_color_utils.getColor(feature)};">${displayOutPowerGuessed}</span>
     
-    <span class="popup-content">${popupContent}</span>
+    <div class="popup-content">
+    <div class="socket-list">
+                ${displaySocketsList(feature)}
+            </div>
+            <div class="other-infos">
+            ${popupContent}
+            </div>
+            </div>
 
     `
 
@@ -796,6 +806,23 @@ function eachFeature(feature, layer, stats) {
         }).addTo(all_stations_markers);
     }
 
+
+    let badtags = lcm_utils.displayBadTagsFromFeature(feature);
+
+    if (badtags !== valid_qa_message) {
+        let circle_alert = L.circle(layer._latlng, {
+            color: 'red',
+            fillColor: 'orange',
+            fillOpacity: 0.5,
+            radius: radius * 1.2
+        });
+        circle_alert.bindTooltip(badtags, {
+            permanent: true,
+            direction: 'top'
+        }).addTo(bad_tags_markers);
+    }
+
+
     circle.bindPopup(html, {
         autoPan: false,
         closeOnClick: false
@@ -819,6 +846,7 @@ function eachFeature(feature, layer, stats) {
         },
     });
 
+
 }
 
 /**
@@ -1376,9 +1404,23 @@ function init() {
             refreshDisplay();
         });
     });
+    $('#filterBadTags').on('click', function () {
+        lcm_config.display_alert_bad_tags = !lcm_config.display_alert_bad_tags;
+        showActiveFilter(lcm_config.display_alert_bad_tags, '#filterBadTags');
+        if (lcm_config.display_alert_bad_tags) {
+            bad_tags_markers.clearLayers();
+            bad_tags_markers.addTo(map);
+
+        } else {
+            bad_tags_markers.remove();
+        }
+        refreshDisplay();
+    });
 
 
-    // food_places_markers.addTo(map); 
+    if (lcm_config.display_restaurants_and_cafes) {
+        food_places_markers.addTo(map);
+    }
 
     // Mettre à jour le contrôle des calques
     const overlayMaps = {
@@ -1386,7 +1428,8 @@ function init() {
         // "🗺️ Fond de carte": baseLayers,
         "⚡ Stations de recharge": all_stations_markers,
         "☕ Restaurants et cafés": food_places_markers,
-        "💡 Bornes potentielles (Osmose)": osmose_markers
+        "💡 Bornes potentielles (Osmose)": osmose_markers,
+        "💡 Problèmes de qualité": bad_tags_markers
     };
 
     const overlayControl = L.control.layers(baseLayers, overlayMaps, {