{"id":10,"date":"2025-06-05T12:42:07","date_gmt":"2025-06-05T10:42:07","guid":{"rendered":"https:\/\/mtfront01.iut.uca.fr\/iotae\/?page_id=10"},"modified":"2025-08-12T15:55:15","modified_gmt":"2025-08-12T13:55:15","slug":"reseau-de-capteurs","status":"publish","type":"page","link":"https:\/\/mtfront01.iut.uca.fr\/iotae\/?page_id=10","title":{"rendered":"R\u00e9seau de capteurs"},"content":{"rendered":"\n<br><style>\n#grey{\nwidth:100%;\nbackground-color:#F1F1F1;\npadding:20px;\n}\n#withe{\npadding:20px;\n}\n\n#map-container {\n  width: 52%;\n  border: solid 2px black;\n\n}\n@media (min-width: 1000px) {\n  #map-container {\n    height: 820px;\n  }\n}\n\/*\n#map-container .leaflet-map {\n  aspect-ratio: 1 \/ 1;\n  width: 100% !important;\n  height: 100% !important;\n}*\/\n#map {\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  width: 100%;\n  height: 100%;\n}\n\n.leaflet-container {\n  width: 100% !important;\n  height: 100% !important;\n}\n\n\n#right-container{\nwidth:5%;\n}\n#left-container{\nwidth: 35%;\npadding:10px;\nmargin-left:2%;\nalign-items:center;\n}\n#container{\ndisplay: flex;\njustify-content:center;\n}\n\n\n.sidebar {\n  width: 95%;\n  background: #ffffff;\n  border-right: 1px solid #ddd;\n  font-family: sans-serif;\n  display: flex;\n  flex-direction: column;\n}\n\n.filters {\n  flex-shrink: 0;\nbackground-color: #F1F1F1;\n}\n\nh2 {\n  font-size: 18px;\n  margin-bottom: 10px;\n}\n\n.radio-group > label {\n  display: block;\n  margin-bottom: 15px;\n  font-weight: bold;\n}\n\n.search-input {\n  display: block;\n  margin-top: 5px;\n  width: 100%;\n  padding: 5px;\n  font-size: 14px;\n  border: 1px solid #ccc;\n  border-radius: 4px;\n}\n\n.checkbox-group {\n  margin-left: 20px;\n  margin-top: 5px;\n}\n\n.checkbox-group label {\n  display: block;\n  font-weight: normal;\n  margin-bottom: 5px;\n}\n\n.divider {\n  border: none;\n  border-top: 2px solid #AFAFAF;\n}\n\n.sensor-results {\n  flex-grow: 1;\n  overflow-y: auto;\n}\n\n.sensor-results h3 {\n  font-size: 16px;\n  margin-bottom: 10px;\n}\n\n.sensor-results ul {\n  list-style: none;\n  padding: 0;\n  margin: 0;\n}\n\n.sensor-results li {\n  padding: 8px;\n  border-bottom: 1px solid #eee;\n  cursor: pointer;\n  transition: background 0.2s;\n}\n\n.sensor-results li:hover {\n  background: #f4f4f4;\n}\n\n\n\n\n\n\n\n\/* Container des boutons \"fake radios\" *\/\n.radio-group {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n}\n\n\/* Style de chaque ligne de filtre *\/\n.fake-radio {\n  position: relative;\n  padding-left: 23px;\n  cursor: pointer;\n  font-weight: bold;\n  display: block;\n  line-height: 1.5;\n}\n\n\/* Cacher le vrai checkbox *\/\n.fake-radio > input[type=\"checkbox\"] {\n  position: absolute;\n  opacity: 0;\n  cursor: pointer;\n}\n\n\n\/* Cercle non coch\u00e9 *\/\n.fake-radio-box {\n  position: absolute;\n  left: 0;\n  top: 3px;\n  height: 16px;\n  width: 16px;\n  border: 2px solid #999;\n  border-radius: 50%;\n  transition: all 0.2s ease;\n}\n\n\/* Cercle rempli quand coch\u00e9 *\/\n.fake-radio input[type=\"checkbox\"]:checked + .fake-radio-box::after {\n  content: \"\";\n  position: absolute;\n  top: 1.9px;\n  left: 1.5px;\n  width: 8px;\n  height: 8px;\n  background-color: #007bff;\n  border-radius: 50%;\n}\n\n\/* Style de la barre de recherche, types et r\u00e9cence *\/\n.search-input,\n.recency-select, \n.access-select {\n  margin-top: 10px;\n  width: 100%;\n  padding: 5px;\n  font-size: 14px;\n  border: 1px solid #ccc;\n  border-radius: 4px;\n}\n\n.checkbox-group {\n  margin-top: 10px;\n  margin-left: 10px;\n}\n\n.checkbox-group label {\n  font-weight: normal;\n  display: block;\n  margin-bottom: 5px;\n}\n\n.dropdown-group {\n  margin-top: 10px;\n  margin-left: 10px;\n}\n\n\n\n\n.sensor-results {\n  flex-grow: 1;\n  overflow-y: auto;\n  max-height: 276px; \/* ou selon ta mise en page *\/\n}\n\n.sensor-results ul {\n  list-style: none;\n  padding: 0;\n}\n\n.sensor-results li {\n  padding: 8px;\n  border-bottom: 1px solid #eee;\n  cursor: pointer;\n  transition: background 0.2s;\n}\n\n.sensor-results li:hover {\n  background-color: #f2f2f2;\n}\n\n\n@media (max-width: 999px) {\n  #container {\n\t  display: flex;\n\t  justify-content: center;\n\t  flex-wrap: wrap;\n\t  flex-direction: column-reverse;\n\t  align-items: center;\n\t  margin-top:0 !important;\n  }\n\n   #left-container,\n  #map-container {\n    width: 90%;\n    margin-bottom: 10px;\n  }\n#right-container{\n    width: 0%;\nheight:0%;\npadding:0px;\nmargin:0px;\n  }\n#map-container .leaflet-map {\n  aspect-ratio: 1 \/ 1;\n  width: 100% !important;\n  height: 100% !important;\n}\n}\n<\/style>\n\n\n\n\n\n<!-- MESSAGE DE CONNEXION -->\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", function () {\n  const privateButton = document.getElementById(\"input_access\");\n  const privateButton2 = document.getElementById(\"input_group\");\n  const accessMessage = document.getElementById(\"message_access\"); \n  const accessDropdown = document.getElementById(\"select_access\"); \n  console.log(accessDropdown);\n\n  if (!window.userIsLoggedIn && privateButton) {\n    privateButton.disabled = true;\n    privateButton.title = \"Connectez-vous pour activer ce filtre.\";\n    privateButton.classList.add(\"disabled\");\n    privateButton2.disabled = true;\n    privateButton2.title = \"Connectez-vous pour activer ce filtre.\";\n    privateButton2.classList.add(\"disabled\");\n    accessMessage.style.display=\"block\";\n    accessDropdown.style.display=\"none\";\n  }\n  else{\n    privateButton.disabled = false;\n    privateButton.classList.remove(\"disabled\");\n    privateButton2.disabled = false;\n\tprivateButton2.classList.remove(\"disabled\");\n    \taccessMessage.style.display=\"none\";\n      accessDropdown.style.display=\"block\";\n}\n});\n<\/script>\n\n\n\n<div id=\"container\" style=\"margin-top:30px\">\n\n<div id=\"left-container\">\n\n\n\n<div class=\"sidebar\">\n<div id=\"grey\">\n  <!-- Section filtres -->\n  <div class=\"filters\">\n    <div class=\"radio-group\">\n      <label class=\"fake-radio\">\n    <input type=\"checkbox\" name=\"filterToggle\" value=\"name\" checked \/>\n    <span class=\"fake-radio-box\"><\/span> Filtrer par nom :\n  \n        <input type=\"text\" placeholder=\"Rechercher un capteur :\" class=\"search-input\" \/>\n      <\/label>\n      <label class=\"fake-radio\">\n    <input type=\"checkbox\" name=\"filterToggle\" value=\"radio\" checked \/>\n    <span class=\"fake-radio-box\"><\/span> Filtrer par type :\n  \n        \n        <div class=\"checkbox-group\"><label><input type=\"checkbox\" name=\"sensorType\" value=\"temperature\" \/> Temp\u00e9rature<\/label><label><input type=\"checkbox\" name=\"sensorType\" value=\"humidity\" \/> Humidit\u00e9<\/label><label><input type=\"checkbox\" name=\"sensorType\" value=\"co2\" \/> Taux de CO2 dans l'air<\/label><label><input type=\"checkbox\" name=\"sensorType\" value=\"image_data\" \/> Donn\u00e9es visuelles<\/label><\/div>\n      <\/label>\n      <label class=\"fake-radio\">\n    <input id=\"input_group\" type=\"checkbox\" name=\"filterToggle\" value=\"group\"\/>\n    <span class=\"fake-radio-box\"><\/span> Filtrer par groupe :\n  \n        \n        <div class=\"dropdown-group\">\n          \n        <\/div>\n      <\/label>\n\n\n<label class=\"fake-radio\">\n    <input id=\"input_access\" type=\"checkbox\" name=\"filterToggle\" value=\"access\"\/>\n    <span class=\"fake-radio-box\"><\/span> Filtrer par acc\u00e8s :\n  \n        \n        <div class=\"dropdown-group\">\n\t\t<select class=\"access-select\" id=\"select_access\">\n\t\t<option value=\"public\">Donn\u00e9es publiques\t\ud83d\udfe2<\/option>\n\t\t<option value=\"private\">Donn\u00e9es priv\u00e9es \t\ud83d\udd34<\/option>\n\t\t<option value=\"all\">Donn\u00e9es priv\u00e9es + publiques \t\ud83d\udd34\ud83d\udfe2<\/option>\n\t\t<\/select>\n          \n\n<p id=\"message_access\" style=\"font-size:12px;color:red;margin-top:5px;margin-block-end:0;\">Connectez-vous pour acc\u00e9der au filtrage par groupe et par acc\u00e8s<\/p>\n      <\/label><\/div>\n\n    <\/div>\n  <\/div>\n<\/div>\n  <!-- S\u00e9parateur -->\n  <hr class=\"divider\" \/>\n<div id=\"withe\">\n<h5>R\u00e9sultats :<\/h5>\n  <!-- Section r\u00e9sultats -->\n  <div class=\"sensor-results\">\n    \n    <ul>\n\n    <\/ul>\n  <\/div>\n<\/div>\n<\/div>\n\n\n\n\n\n\n<\/div>\n\n\n\n<div id=\"map-container\">\n<div class=\"leaflet-map WPLeafletMap\" style=\"height:250px; width:100%;\"><\/div><script>\nwindow.WPLeafletMapPlugin = window.WPLeafletMapPlugin || [];\nwindow.WPLeafletMapPlugin.push(function WPLeafletMapShortcode() {\/*<script>*\/\nvar baseUrl = atob('aHR0cHM6Ly90aWxlLm9wZW5zdHJlZXRtYXAub3JnL3t6fS97eH0ve3l9LnBuZw==');\nvar base = (!baseUrl && window.MQ) ?\n    window.MQ.mapLayer() : L.tileLayer(baseUrl,\n        L.Util.extend({}, {\n            detectRetina: 0,\n        },\n        {\"subdomains\":\"abc\",\"noWrap\":false,\"maxZoom\":19}        )\n    );\n    var options = L.Util.extend({}, {\n        layers: [base],\n        attributionControl: false\n    },\n    {\"zoomControl\":true,\"scrollWheelZoom\":true,\"doubleClickZoom\":true,\"fitBounds\":false,\"minZoom\":0,\"maxZoom\":19,\"maxBounds\":null,\"attribution\":\"<a href=\\\"http:\\\/\\\/leafletjs.com\\\" title=\\\"Une biblioth\\u00e8que JS pour des cartes interactives\\\">Leaflet<\\\/a>; \\u00a9 <a href=\\\"http:\\\/\\\/www.openstreetmap.org\\\/copyright\\\">OpenStreetMap<\\\/a> contributeurs\\\/contributrices\"},\n    {});\nwindow.WPLeafletMapPlugin.createMap(options).setView([46,2.8],7);});<\/script>\n\n[fullscreen position=topleft ]\n<script>const jsCapteurs = [];<\/script>\n<\/div>\n\n<div id=\"right-container\"><\/div>\n\n<\/div>\n\n\n\n<!-- GESTION DU ZOOM -->\n<script>\ndocument.addEventListener(\"wheel\", function (e) {\n  if (e.ctrlKey) {\n    e.preventDefault();  \/\/ Emp\u00eache le zoom de la page\n    console.log(\"\ud83d\uded1 Zoom page bloqu\u00e9 (Ctrl + molette)\");\n  }\n}, { passive: false }); \/\/ passive: false est n\u00e9cessaire pour pouvoir appeler preventDefault\n<\/script>\n\n\n\n<!-- FONCTIONNEMENT DES FILTRES DE RECHERCHE -->\n<script defer=\"defer\">\n  console.log(\"Donn\u00e9es capteurs :\", jsCapteurs);\n\n  document.addEventListener(\"DOMContentLoaded\", function () {\n    waitForLeafletMap(initFilters);\n  });\n\n  let attempts = 0;\nconst maxAttempts = 30; \/\/ 30 x 300ms = 9 secondes max\n\nfunction waitForLeafletMap(callback) {\n    const interval = setInterval(() => {\n        attempts++;\n        let map;\n\n        map = window.WPLeafletMapPlugin.getCurrentMap();\n\n        if (map) {\n            clearInterval(interval);\n            console.log(\"\u2705 Carte trouv\u00e9e !\", map);\n            callback(map);\n        } \n        else if (attempts >= maxAttempts) {\n            clearInterval(interval);\n            console.error(\"\u274c Carte introuvable apr\u00e8s plusieurs tentatives\");\n        }\n    }, 300);\n}\n\n  function initFilters(map) {\n    const filterToggles = document.querySelectorAll('input[name=\"filterToggle\"]');\n    const searchInput = document.querySelector(\".search-input\");\n    const typeCheckboxes = document.querySelectorAll('input[name=\"sensorType\"]');\n    const groupSelect = document.querySelector(\".group-select\");\n    const accessSelect = document.querySelector(\".access-select\");\n    const resultsContainer = document.querySelector(\".sensor-results ul\");\n\n    function getActiveFilters() {\n      const activeFilters = {};\n      filterToggles.forEach(toggle => {\n        if (toggle.checked) {\n          activeFilters[toggle.value] = true;\n        }\n      });\n      return activeFilters;\n    }\n\n    function updateDisplay() {\n  console.log(\"updateDisplay\");\n  const filters = getActiveFilters();\n  let filtered = [...jsCapteurs];\n  const filteredIds = new Set([1,2,4]);\n  console.log(\"ici\"+filtered);\n  if(accessSelect == null){\n    console.log(\"accessSelect == null\");\n  }\n  else{\n    console.log(accessSelect.value);\n  }\n  \nif(!accessSelect || (filters.access && accessSelect.value == \"public\") || !filters.access){\n    if (filters.name) {\n      const nameFilter = searchInput.value.toLowerCase();\n      filtered = filtered.filter(capteur =>\n        capteur[0] && capteur[0].name.toLowerCase().includes(nameFilter)\n      );\n    }\n\n    if (filters.radio) {\n      const selectedTypes = Array.from(typeCheckboxes)\n        .filter(cb => cb.checked)\n        .map(cb => cb.value);\n\n      filtered = filtered.filter(capteur =>\n        selectedTypes.every(type => capteur[0] && capteur[0][type] !== null)\n      );\n    }\n\n    if (filters.group) {\n      const groupValue = groupSelect.value;\n\n      if (groupValue !== \"all\") {\n        const groupId = parseInt(groupValue, 10);\n\n        filtered = filtered.filter(capteur =>\n          capteur[0] && (Array.isArray(capteur[0].group) &&\n          capteur[0].group.includes(groupId))\n        );\n      }      \n    }\n\n    console.log(\"ICIIIIIIIIIIIIII \"+filtered);\n    \/\/const filteredIds = new Set(filtered.map(capteur => \"public_\"+capteur[0].id.toString()));\n    filtered=filtered.filter(capteur => capteur[0] != null);\n    const filteredIds = new Set(filtered.map(capteur => \"public_\" + capteur[0].id.toString()));\n\n    console.log(\"LE VOILA TON TRUC BORDEL public\"+JSON.stringify([...filteredIds]));\n    \n    console.log(filtered);\n\n  \/\/ Mettre \u00e0 jour les r\u00e9sultats dans la liste\n  resultsContainer.innerHTML = \"\";\n  filtered.forEach(capteur => {\n    const li = document.createElement(\"li\");\n    li.textContent = \"\ud83d\udfe2 \"+capteur[0].name;\n\tli.style.fontWeight=\"bold\";\n    li.addEventListener(\"click\", () => {\n      const lat = parseFloat(capteur[0].lat);\n      const lng = parseFloat(capteur[0].lng);\n      console.log(\"Click on\", capteur[0].name, lat, lng);\n      map.setView([lat, lng], 14);\n    });\n    resultsContainer.appendChild(li);\n  });\n\n\n  \n  \/\/ Parcourir tous les calques de la carte\n  map.eachLayer(layer => {\n  if (layer instanceof L.Marker) {\n    const sensorId = layer.options.title;\n    if (sensorId) {\n      if (filteredIds.has(sensorId.toString())) {\n        \/\/ Affiche le marker\n        layer.setOpacity(1);\n        \/\/ Rendre cliquable (pointer events)\n        const el = layer.getElement();\n        if (el) el.style.pointerEvents = 'auto';\n        console.log(\"visible\");\n      } else {\n        \/\/ Masque le marker\n        layer.setOpacity(0);\n        if (layer.closePopup) {\n          layer.closePopup();\n        }\n        \/\/ Rendre inclicable\n        const el = layer.getElement();\n        if (el) el.style.pointerEvents = 'none';\n        console.log(\"masqu\u00e9\");\n      }\n    }\n  }\n});\n  \n}\n\n\n\nelse if(accessSelect && filters.access && accessSelect.value == \"private\"){\n    if (filters.name) {\n      const nameFilter = searchInput.value.toLowerCase();\n      filtered = filtered.filter(capteur =>\n        capteur[1] && capteur[1].name.toLowerCase().includes(nameFilter)\n      );\n    }\n\n    if (filters.radio) {\n      const selectedTypes = Array.from(typeCheckboxes)\n        .filter(cb => cb.checked)\n        .map(cb => cb.value);\n\n      filtered = filtered.filter(capteur =>\n        selectedTypes.every(type => capteur[1] && capteur[1][type] !== null)\n      );\n    }\n    if (filters.group) {\n      const groupValue = groupSelect.value;\n\n      if (groupValue !== \"all\") {\n        const groupId = parseInt(groupValue, 10);\n\n        filtered = filtered.filter(capteur =>\n          capteur[1] && (Array.isArray(capteur[1].group) &&\n          capteur[1].group.includes(groupId))\n        );\n      }      \n    }\n    \n    \n\n    filtered = filtered.filter(capteur =>\n        capteur[1]!=null\n      );\n\n      \/\/const filteredIds = new Set(filtered.map(capteur => \"private_\"+capteur[1].id.toString()));\n      filtered=filtered.filter(capteur => capteur[1] != null);\n      const filteredIds = new Set(filtered.map(capteur => \"private_\" + capteur[1].id.toString()));\n      console.log(\"LE VOILA TON TRUC BORDEL private\"+JSON.stringify([...filteredIds]));\n\n      console.log(filtered);\n\n      \/\/ Mettre \u00e0 jour les r\u00e9sultats dans la liste\n      resultsContainer.innerHTML = \"\";\n      filtered.forEach(capteur => {\n        const li = document.createElement(\"li\");\n        li.textContent = \"\ud83d\udd34 \"+capteur[1].name;\n\tli.style.fontWeight=\"bold\";\n        li.addEventListener(\"click\", () => {\n          const lat = parseFloat(capteur[1].lat);\n          const lng = parseFloat(capteur[1].lng);\n          console.log(\"Click on\", capteur[1].name, lat, lng);\n          map.setView([lat, lng], 14);\n        });\n        resultsContainer.appendChild(li);\n      });\n    \n    \n      \n      \/\/ Parcourir tous les calques de la carte\n      map.eachLayer(layer => {\n      if (layer instanceof L.Marker) {\n        const sensorId = layer.options.title;\n        if (sensorId) {\n          if (filteredIds.has(sensorId.toString())) {\n            \/\/ Affiche le marker\n            layer.setOpacity(1);\n            \/\/ Rendre cliquable (pointer events)\n            const el = layer.getElement();\n            if (el) el.style.pointerEvents = 'auto';\n            console.log(\"visible\");\n          } else {\n            \/\/ Masque le marker\n            layer.setOpacity(0);\n            if (layer.closePopup) {\n              layer.closePopup();\n            }\n            \/\/ Rendre inclicable\n            const el = layer.getElement();\n            if (el) el.style.pointerEvents = 'none';\n            console.log(\"masqu\u00e9\");\n          }\n        }\n      }\n    });\n}\n\n\nelse if(accessSelect && filters.access && accessSelect.value == \"all\"){\n\n    if (filters.name) {\n      const nameFilter = searchInput.value.toLowerCase();\n      filtered = filtered.filter(capteur =>\n\n        {\n          if (capteur[1]) {\n            return capteur[1] && capteur[1].name.toLowerCase().includes(nameFilter);\n          } else {\n            return capteur[0] && capteur[0].name.toLowerCase().includes(nameFilter);\n          }\n        }\n        \n      );\n    }\n\n    if (filters.radio) {\n      const selectedTypes = Array.from(typeCheckboxes)\n        .filter(cb => cb.checked)\n        .map(cb => cb.value);\n\n      filtered = filtered.filter(capteur =>\n        \n\n\n        {\n          if (capteur[1]) {\n            return selectedTypes.every(type => capteur[1] && capteur[1][type] !== null);\n          } else {\n            return selectedTypes.every(type => capteur[0] && capteur[0][type] !== null);\n          }\n        }\n      );\n    }\n    if (filters.group) {\n      const groupValue = groupSelect.value;\n\n      if (groupValue !== \"all\") {\n        const groupId = parseInt(groupValue, 10);\n\n        filtered = filtered.filter(capteur =>\n\n          {\n            if (capteur[1]) {\n              return capteur[1] && (Array.isArray(capteur[1].group) &&\n              capteur[1].group.includes(groupId));\n            } else {\n              return capteur[0] && (Array.isArray(capteur[0].group) &&\n              capteur[0].group.includes(groupId));\n            }\n          }\n          \n        );\n      }      \n    }\n  \n    \n    \n\n\n\n    const filteredIds = new Set(\n      filtered.map(capteur => {\n        if (capteur[1]) {\n          return \"private_\" + capteur[1].id.toString();\n        } else {\n          return \"public_\" + capteur[0].id.toString();\n        }\n      })\n    );\n    \n      console.log(\"LE VOILA TON TRUC BORDEL private\"+JSON.stringify([...filteredIds]));\n\n      console.log(filtered);\n\n      \/\/ Mettre \u00e0 jour les r\u00e9sultats dans la liste\n      resultsContainer.innerHTML = \"\";\n      filtered.forEach(capteur => {\n        if (capteur[1]) {\n        const li = document.createElement(\"li\");\n        li.textContent = \"\ud83d\udd34 \"+capteur[1].name;\n\tli.style.fontWeight=\"bold\";\n        li.addEventListener(\"click\", () => {\n          const lat = parseFloat(capteur[1].lat);\n          const lng = parseFloat(capteur[1].lng);\n          console.log(\"Click on\", capteur[1].name, lat, lng);\n          map.setView([lat, lng], 14);\n        });\n        resultsContainer.appendChild(li);\n      }\n      else{\n        const li = document.createElement(\"li\");\n        li.textContent = \"\ud83d\udfe2 \"+capteur[0].name;\n\tli.style.fontWeight=\"bold\";\n        li.addEventListener(\"click\", () => {\n          const lat = parseFloat(capteur[0].lat);\n          const lng = parseFloat(capteur[0].lng);\n          console.log(\"Click on\", capteur[0].name, lat, lng);\n          map.setView([lat, lng], 14);\n        });\n        resultsContainer.appendChild(li);\n      }\n\n\n\n      }\n    \n    \n    \n    \n    );\n    \n    \n      \n      \/\/ Parcourir tous les calques de la carte\n      map.eachLayer(layer => {\n      if (layer instanceof L.Marker) {\n        const sensorId = layer.options.title;\n        if (sensorId) {\n          if (filteredIds.has(sensorId.toString())) {\n            \/\/ Affiche le marker\n            layer.setOpacity(1);\n            \/\/ Rendre cliquable (pointer events)\n            const el = layer.getElement();\n            if (el) el.style.pointerEvents = 'auto';\n            console.log(\"visible\");\n          } else {\n            \/\/ Masque le marker\n            layer.setOpacity(0);\n            if (layer.closePopup) {\n              layer.closePopup();\n            }\n            \/\/ Rendre inclicable\n            const el = layer.getElement();\n            if (el) el.style.pointerEvents = 'none';\n            console.log(\"masqu\u00e9\");\n          }\n        }\n      }\n    });\n\n\n\n\n}\nelse{\n\n  const filteredIds = new Set([1,2,4]);\n  console.log(\"LE VOILA TON TRUC BORDEL \"+JSON.stringify([...filteredIds]));\n}\n  \n\n\n\n\n}\n\n    \/\/ \u00c9couteurs pour les filtres\n    filterToggles.forEach(toggle => toggle.addEventListener(\"change\", updateDisplay));\n    searchInput.addEventListener(\"input\", updateDisplay);\n    typeCheckboxes.forEach(cb => cb.addEventListener(\"change\", updateDisplay));\n    if(groupSelect!=null){\n      groupSelect.addEventListener(\"change\", updateDisplay);\n    }\n    if(accessSelect!=null){\n      accessSelect.addEventListener(\"change\", updateDisplay);\n    }\n\n    updateDisplay(); \/\/ Affichage initial\n  }\n<\/script>\n\n\n\n<!-- CHANGEMENT TAILLE ET ICONE AU POPUP -->\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", function () {\n    let map;\n    let attempts = 0;\n    const maxAttempts = 10;\n\n    const interval = setInterval(() => {\n        attempts++;\n        map = window.WPLeafletMapPlugin.getCurrentMap();\n\n        if (map) {\n            clearInterval(interval);\n            updateAllMarkers(map);\n        } else if (attempts >= maxAttempts) {\n            clearInterval(interval);\n        }\n    }, 300);\n\n    const publicIconConfig = {\n        default: {\n            iconUrl: 'https:\/\/mtfront01.iut.uca.fr\/iotae\/wp-content\/uploads\/2025\/06\/public_sensor.png',\n            iconSize: [50, 35],\n            iconAnchor: [30, 40],\n            popupAnchor: [0, -60]\n        },\n        active: {\n            iconUrl: 'https:\/\/mtfront01.iut.uca.fr\/iotae\/wp-content\/uploads\/2025\/06\/public2_sensor.png',\n            iconSize: [80, 50],\n            iconAnchor: [40, 60],\n            popupAnchor: [0, -60]\n        }\n    };\n\n    const privateIconConfig = {\n        default: {\n            iconUrl: 'https:\/\/mtfront01.iut.uca.fr\/iotae\/wp-content\/uploads\/2025\/06\/online_sensor.png',\n            iconSize: [50, 35],\n            iconAnchor: [30, 40],\n            popupAnchor: [0, -60]\n        },\n        active: {\n            iconUrl: 'https:\/\/mtfront01.iut.uca.fr\/iotae\/wp-content\/uploads\/2025\/06\/main_sensor.png',\n            iconSize: [80, 50],\n            iconAnchor: [40, 60],\n            popupAnchor: [0, -60]\n        }\n    };\n\n    function updateAllMarkers(map) {\n        map.eachLayer(layer => {\n            if (layer instanceof L.Marker) {\n                if (typeof layer.options.title === \"string\" && layer.options.title.slice(0, 2).toLowerCase() === \"pu\") {\n                    \/\/ Sauvegarde l'\u00e9tat original\n                    layer._originalIcon = L.icon(publicIconConfig.default);\n\n                    \/\/ \u00c9couteur pour l'ouverture du popup\n                    layer.on('popupopen', function () {\n                        layer.setIcon(L.icon(publicIconConfig.active));\n                        layer._icon.classList.add('active-marker');\n                    });\n\n                    \/\/ \u00c9couteur pour la fermeture du popup\n                    layer.on('popupclose', function () {\n                        layer.setIcon(layer._originalIcon);\n                        layer._icon.classList.remove('active-marker');\n                    });\n                }\n                if (typeof layer.options.title === \"string\" && layer.options.title.slice(0, 2).toLowerCase() === \"pr\") {\n                    \/\/ Sauvegarde l'\u00e9tat original\n                    layer._originalIcon = L.icon(privateIconConfig.default);\n\n                    \/\/ \u00c9couteur pour l'ouverture du popup\n                    layer.on('popupopen', function () {\n                        layer.setIcon(L.icon(privateIconConfig.active));\n                        layer._icon.classList.add('active-marker');\n                    });\n\n                    \/\/ \u00c9couteur pour la fermeture du popup\n                    layer.on('popupclose', function () {\n                        layer.setIcon(layer._originalIcon);\n                        layer._icon.classList.remove('active-marker');\n                    });\n                }\n                \n            }\n        });\n    }\n});\n<\/script>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-10","page","type-page","status-publish","hentry"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/mtfront01.iut.uca.fr\/iotae\/index.php?rest_route=\/wp\/v2\/pages\/10","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mtfront01.iut.uca.fr\/iotae\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mtfront01.iut.uca.fr\/iotae\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mtfront01.iut.uca.fr\/iotae\/index.php?rest_route=\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/mtfront01.iut.uca.fr\/iotae\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=10"}],"version-history":[{"count":299,"href":"https:\/\/mtfront01.iut.uca.fr\/iotae\/index.php?rest_route=\/wp\/v2\/pages\/10\/revisions"}],"predecessor-version":[{"id":1205,"href":"https:\/\/mtfront01.iut.uca.fr\/iotae\/index.php?rest_route=\/wp\/v2\/pages\/10\/revisions\/1205"}],"wp:attachment":[{"href":"https:\/\/mtfront01.iut.uca.fr\/iotae\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=10"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}