add filters checkboxes

index.html

@@ -116,9 +116,10 @@
                 ⚙️ Filtres:
             </h2>
             <div class="filter-group">
-                qualité
+                
-                <button id="filterUnkown">❓ kW max inconnu</button>
                 <div class="filter-group">
+                    Montrer: 
+                    <br>
                     <label>
                         <input type="checkbox" id="filterCableAttached"> Prise avec câble attaché
                     </label>
@@ -131,9 +132,29 @@
                         <input type="checkbox" id="filterType2"> Prise Type 2
                     </label>
                     <br>
+                    <label>
+                        <input type="checkbox" id="filterDomestic"> Prise domestique
+                    </label>
+                    <br>
+                    <label>
+                        <input type="checkbox" id="filterChademo"> Prise CHAdeMO
+                    </label>
+                    <br>
+                    <label>
+                        <input type="checkbox" id="filterType1"> Prise Type 1
+                    </label>
+                    <br>
+                    <label>
+                        <input type="checkbox" id="filterType3"> Prise Type 3
+                    </label>
+                    <hr>
                     <label>
                         <input type="checkbox" id="filterQuality"> Contrôle qualité
                     </label>
+                    <br>
+                    <label>
+                        <input type="checkbox" id="filterUnkown"> ❓ kW max inconnu
+                    </label>
                 </div>
 <!--
                 <br>

js/lcm_config.js

@@ -12,12 +12,21 @@ const lcm_config = {
 	filterCCS: false,
 	filterType2: false,
 	filterQuality: false,
+	filterDomestic: false,
+	filterChademo: false,
+	filterType1: false,
+	filterType3: false,
 	// Configuration des filtres
 	filterConfigs: {
-		'filterCableAttached': false,
+		'filterUnknownOutput': true,
-		'filterCCS': false, 
+		'filterCableAttached': true,
-		'filterType2': false,
+		'filterCCS': true, 
-		'filterQuality': false
+		'filterType2': true,
+		'filterQuality': true,
+		'filterDomestic': true,
+		'filterChademo': true,
+		'filterType1': true,
+		'filterType3': true
 	},
 	tileServers: {
 		osm: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',

js/lcm_main.js

@@ -12,6 +12,7 @@ import { sendToJOSM, createJOSMEditLink } from './lcm_editor.js'
 let geojsondata;
 let lastLatLng;
 let searchLocationMarker = null;
+let count_hidden_by_filters = 0;
 
 
 
@@ -354,8 +355,15 @@ function displayStatsFromGeoJson(resultAsGeojson) {
     let count_estimated_type2combo = 0;
     let count_found_type2combo = 0;
     let count_found_type2 = 0;
+    let count_hidden_by_filters = 0;
 
-    $('#count_features_fond').html('⚡' + count + ' stations');
+    // Compter les filtres désactivés
+    let disabledFilters = 0;
+    Object.keys(lcm_config.filterConfigs).forEach(filterId => {
+        if (!lcm_config.filterConfigs[filterId]) disabledFilters++;
+    });
+    
+    $('#count_features_fond').html('⚡' + count + ' stations' + (disabledFilters > 0 ? ` (${disabledFilters} filtre${disabledFilters > 1 ? 's' : ''} désactivé${disabledFilters > 1 ? 's' : ''}, ${count_hidden_by_filters} masqué${count_hidden_by_filters > 1 ? 's' : ''})` : ''));
 
     resultAsGeojson.features.map(feature => {
         let found_type2_combo = false;
@@ -570,6 +578,63 @@ function eachFeature(feature, layer) {
     let outPowerGuessed = lcm_utils.guessOutputPowerFromFeature(feature);
     let color = lcm_color_utils.getColor(feature);
     let displayOutPowerGuessed = '? kW';
+
+    // Vérifier les filtres activés
+    if (lcm_config.filterCCS && !feature.properties.tags['socket:type2_combo']) {
+        count_hidden_by_filters++;
+        return;
+    }
+
+    if (lcm_config.filterType2 && !feature.properties.tags['socket:type2']) {
+        count_hidden_by_filters++;
+        return;
+    }
+
+    if (lcm_config.filterDomestic && !feature.properties.tags['socket:typee']) {
+        count_hidden_by_filters++;
+        return;
+    }
+
+    if (lcm_config.filterChademo && !feature.properties.tags['socket:chademo']) {
+        count_hidden_by_filters++;
+        return;
+    }
+
+    if (lcm_config.filterType1 && !feature.properties.tags['socket:type1']) {
+        count_hidden_by_filters++;
+        return;
+    }
+
+    if (lcm_config.filterType3 && !feature.properties.tags['socket:type3']) {
+        count_hidden_by_filters++;
+        return;
+    }
+
+    if (lcm_config.filterCableAttached) {
+        let hasCableAttached = false;
+        // Vérifier si une des prises a un câble attaché
+        ['socket:type2:cable', 'socket:type2_combo:cable', 'socket:chademo:cable', 'socket:typee:cable', 'socket:type1:cable', 'socket:type3:cable'].forEach(tag => {
+            if (feature.properties.tags[tag] === 'yes') {
+                hasCableAttached = true;
+            }
+        });
+        if (!hasCableAttached) {
+            count_hidden_by_filters++;
+            return;
+        }
+    }
+
+    if (lcm_config.filterQuality) {
+        // Vérifier si les informations minimales de qualité sont présentes
+        let hasQualityInfo = feature.properties.tags['operator'] || 
+                            feature.properties.tags['authentication:none'] ||
+                            feature.properties.tags['payment:none'] ||
+                            feature.properties.tags['opening_hours'];
+        if (!hasQualityInfo) {
+            count_hidden_by_filters++;
+            return;
+        }
+    }
     if (outPowerGuessed) {
         displayOutPowerGuessed = outPowerGuessed + ' kW max';
         if (display_unknown_max_power_station === 'show_only') {
@@ -704,7 +769,10 @@ function eachFeature(feature, layer) {
         }).addTo(all_stations_markers);
     }
 
-    circle.bindPopup(html);
+    circle.bindPopup(html, {
+        autoPan: false,
+        closeOnClick: false
+    });
     circle.on({
         mouseover: function () {
             this.openPopup();
@@ -811,7 +879,15 @@ function loadOverpassQuery() {
 
 function refreshDisplay(convert_points_to_osm = false) {
     supprimerMarqueurs();
+    count_hidden_by_filters = 0; // Réinitialiser le compteur
     displayPointsFromApi(geojsondata, convert_points_to_osm);
+    // Mettre à jour le compteur dans la popup
+    let count = geojsondata.features.length;
+    let disabledFilters = 0;
+    Object.keys(lcm_config.filterConfigs).forEach(filterId => {
+        if (!lcm_config.filterConfigs[filterId]) disabledFilters++;
+    });
+    $('#count_features_fond').html('⚡' + count + ' stations' + (disabledFilters > 0 ? ` (${disabledFilters} filtre${disabledFilters > 1 ? 's' : ''} désactivé${disabledFilters > 1 ? 's' : ''}, ${count_hidden_by_filters} masqué${count_hidden_by_filters > 1 ? 's' : ''})` : ''));
 }
 
 
@@ -866,55 +942,7 @@ setCoordinatesOfLeafletMapFromQueryParameters()
 
 
 $(document).ready(function () {
-    bindEventsOnJosmRemote();
+    init()
-    onMapMoveEnd();
-    map.on('moveend', onMapMoveEnd);
-    $('#spinning_icon').hide();
-
-    /**
-     * boutons de changement de filtres et de rechargement des bornes à l'affichage
-     */
-    $('#removeMarkers').on('click', function () {
-        supprimerMarqueurs();
-    });
-    $('#load').on('click', function () {
-        loadOverpassQuery();
-    });
-    $('#toggleSidePanel').on('click', function () {
-        $('body').toggleClass('side-panel-open');
-    });
-    $('#chercherButton').on('click', function () {
-        supprimerMarqueurs();
-        loadOverpassQuery();
-    });
-    $('#setRandomView').on('click', function () {
-        setRandomView();
-        loadOverpassQuery();
-    });
-    $('#filterUnkown').on('click', function () {
-        display_unknown_max_power_station = cycleVariableState(display_unknown_max_power_station, '#filterUnkown');
-        showActiveFilter(display_unknown_max_power_station, '#filterUnkown');
-        refreshDisplay();
-    });
-    /**
-     * toggle des alertes de tags décrivant la présence de cable
-     */
-    $('#cableMissing').on('click', function () {
-        display_alert_cable_missing = !display_alert_cable_missing;
-        showActiveFilter(display_alert_cable_missing, '#cableMissing');
-        refreshDisplay();
-    });
-    showActiveFilter(display_unknown_max_power_station, '#filterUnkown');
-
-    $('#shareUrl').on('click', copyCurrentUrl);
-
-    // Écouteurs pour les nouveaux filtres
-    Object.keys(lcm_config.filterConfigs).forEach(filterId => {
-        $(`#${filterId}`).on('change', function() {
-            lcm_config[lcm_config.filterConfigs[filterId]] = this.checked;
-            refreshDisplay();
-        });
-    });
 });
 
 function showActiveFilter(filterVariableName, selectorId) {
@@ -1105,7 +1133,7 @@ function searchOsmoseIssues(map) {
                     });
 
                     if (tooClose) {
-                        console.log(`Marqueur Osmose ignoré car trop proche d'une station existante: ${lat},${lon}`);
+                      //  console.log(`Marqueur Osmose ignoré car trop proche d'une station existante: ${lat},${lon}`);
                         return;
                     }
                 }
@@ -1222,6 +1250,61 @@ function handleMarkerClick(marker, map) {
 
 // Ajouter un écouteur d'événements pour le changement de visibilité des calques
 function init() {
+    bindEventsOnJosmRemote();
+    onMapMoveEnd();
+    map.on('moveend', onMapMoveEnd);
+    $('#spinning_icon').hide();
+
+    /**
+     * boutons de changement de filtres et de rechargement des bornes à l'affichage
+     */
+    $('#removeMarkers').on('click', function () {
+        supprimerMarqueurs();
+    });
+    $('#load').on('click', function () {
+        loadOverpassQuery();
+    });
+    $('#toggleSidePanel').on('click', function () {
+        $('body').toggleClass('side-panel-open');
+    });
+    $('#chercherButton').on('click', function () {
+        supprimerMarqueurs();
+        loadOverpassQuery();
+    });
+    $('#setRandomView').on('click', function () {
+        setRandomView();
+        loadOverpassQuery();
+    });
+    $('#filterUnkown').on('click', function () {
+        display_unknown_max_power_station = cycleVariableState(display_unknown_max_power_station, '#filterUnkown');
+        showActiveFilter(display_unknown_max_power_station, '#filterUnkown');
+        refreshDisplay();
+    });
+    /**
+     * toggle des alertes de tags décrivant la présence de cable
+     */
+    $('#cableMissing').on('click', function () {
+        display_alert_cable_missing = !display_alert_cable_missing;
+        showActiveFilter(display_alert_cable_missing, '#cableMissing');
+        refreshDisplay();
+    });
+    showActiveFilter(display_unknown_max_power_station, '#filterUnkown');
+
+    $('#shareUrl').on('click', copyCurrentUrl);
+
+    // Initialisation des états des checkboxes des filtres selon les valeurs de configuration
+    Object.keys(lcm_config.filterConfigs).forEach(filterId => {
+        console.log("checbox ", $(`#${filterId}`) , lcm_config.filterConfigs[filterId] , lcm_config)
+        $(`#${filterId}`).prop('checked', lcm_config.filterConfigs[filterId]);
+    });
+    // Écouteurs pour les filtres
+    Object.keys(lcm_config.filterConfigs).forEach(filterId => {
+        $(`#${filterId}`).on('change', function() {
+            lcm_config[lcm_config.filterConfigs[filterId]] = this.checked;
+            refreshDisplay();
+        });
+    });
+    
     food_places_markers.addTo(map);
     $('#found_charging_stations').hide();