diff --git a/assets/josm.js b/assets/josm.js index aca7da1..c8cd1ef 100644 --- a/assets/josm.js +++ b/assets/josm.js @@ -63,11 +63,14 @@ function openInJOSM(map, map_is_loaded, osmElements) { `select=${selectParams.join(',')}`; // Utiliser le bouton caché pour ouvrir JOSM - const josmButton = document.getElementById('josmButton'); - if (!josmButton) { - console.error('Le bouton JOSM n\'existe pas dans le DOM'); - return; - } - josmButton.href = josmUrl; - josmButton.click(); -} \ No newline at end of file + // Créer un élément temporaire + const tempLink = document.createElement('a'); + tempLink.style.display = 'none'; + document.body.appendChild(tempLink); + tempLink.href = josmUrl; + + console.log('josmUrl', josmUrl); + tempLink.click(); + document.body.removeChild(tempLink); + +} diff --git a/templates/admin/stats.html.twig b/templates/admin/stats.html.twig index e00c81a..f84bdcd 100644 --- a/templates/admin/stats.html.twig +++ b/templates/admin/stats.html.twig @@ -116,7 +116,8 @@ let mapElements = []; let map_is_loaded = false; let features = []; - + let maplibre; + let map; function getCompletionColor(completion) { if (completion === undefined || completion === null) { @@ -239,6 +240,19 @@ }); } + function createJOSMQuery(elements){ + let query = ''; + elements.forEach(element => { + query += `${element.type}${element.id},`; + }); + // Enlever la virgule finale + query = query.replace(/,$/, ''); + console.log('josm query', query); + return query; + } + + let josm_elements = []; + async function loadPlaces(map) { map_is_loaded = false; try { @@ -259,6 +273,8 @@ // Mettre à jour les cercles features = []; + + josm_elements = []; data.elements.forEach(element => { const lat = element.lat || (element.center && element.center.lat); const lon = element.lon || (element.center && element.center.lon); @@ -277,6 +293,7 @@ center: [lon, lat] // Stocker le centre comme un tableau [lon, lat] }; features.push(circle); + josm_elements.push(element); } }); @@ -309,29 +326,49 @@ document.getElementById('maploader').classList.add('d-none'); } } + + +function openJOSMQuery(map, query) { + const bounds = map.getBounds(); + + const josmUrl = `http://localhost:8111/load_object?` + + + `objects=${query}`; + + // Créer un élément temporaire + const tempLink = document.createElement('a'); + tempLink.style.display = 'none'; + document.body.appendChild(tempLink); + + console.log('josmUrl', josmUrl); + + tempLink.href = josmUrl; + tempLink.click(); + document.body.removeChild(tempLink); +} + function openInJOSM() { - const selectedElements = document.querySelectorAll('input[type="checkbox"]:checked'); - if (selectedElements.length === 0) { + if (josm_elements.length === 0) { alert('Veuillez sélectionner au moins un élément'); return; } + const query = createJOSMQuery(josm_elements); + console.log('map', map); + openJOSMQuery(map, query); - const osmElements = Array.from(selectedElements).map(checkbox => { - return JSON.parse(checkbox.value); - }); - - window.openInJOSM(map, map_is_loaded, osmElements); + } document.addEventListener('DOMContentLoaded', function() { console.log('DOMContentLoaded'); - const map = new maplibregl.Map({ + maplibre = new maplibregl.Map({ container: 'map', style: 'https://api.maptiler.com/maps/streets-v2/style.json?key={{ maptiler_token }}', center: [2.3488, 48.8534], zoom: 12 }); + map = maplibre; document.getElementById('openInJOSM').addEventListener('click', openInJOSM);