Keep comparison and multi-selection visible

wwwroot/js/lme-map.js

@@ -349,7 +349,8 @@ function init(dotNetReference) {
     });
     lmeState.map.createPane("drawingsMarkerPane", lmeState.map._norotatePane || lmeState.map._mapPane);
     lmeState.map.createPane("gpsAccuracyPane", lmeState.map._rotatePane || lmeState.map._mapPane);
-    lmeState.map.createPane("comparisonPane", lmeState.map._rotatePane || lmeState.map._mapPane);
+    const comparisonPane = lmeState.map.createPane("comparisonPane", lmeState.map._rotatePane || lmeState.map._mapPane);
+    comparisonPane.style.zIndex = "680";
     const managerHighlightPane = lmeState.map.createPane("managerHighlightPane", lmeState.map._rotatePane || lmeState.map._mapPane);
     managerHighlightPane.style.zIndex = "650";
     lmeState.drawingsRenderer = L.canvas({ pane: "drawingsPane", tolerance: 14 });
@@ -395,7 +396,7 @@ function init(dotNetReference) {
             return;
         }
         hideDrawingScopeMenu();
-        clearManagerHighlight();
+        if (!multiSelectionHasObjects()) clearManagerHighlight();
         const info = await queryFeatureInfo(event.latlng);
         if (info) {
             L.popup().setLatLng(event.latlng).setContent(info).openOn(lmeState.map);
@@ -453,6 +454,10 @@ function init(dotNetReference) {
                 || selectedParent?.dataset.highlightKey === lmeState.managerHighlightedParentKey) {
                 return;
             }
+            if (multiSelectionHasObjects()) {
+                renderSelectedManagerHighlight();
+                return;
+            }
             clearManagerHighlight();
         });
         lmeState.managerOutsideSelectionBound = true;
@@ -1607,7 +1612,7 @@ function setLayerOrder(order) {
     normalized.forEach((key, index) => {
         const zIndex = String(590 - index * 20);
         const paneNames = [panes[key]];
-        if (key === "drawings") paneNames.push("drawingsMarkerPane", "comparisonPane");
+        if (key === "drawings") paneNames.push("drawingsMarkerPane");
         if (key === "gpsPosition") paneNames.push("gpsAccuracyPane");
         paneNames.forEach(paneName => {
             const pane = lmeState.map.getPane(paneName);
@@ -2194,6 +2199,7 @@ function refreshLayerManager() {
             scrollHost.scrollTop = scrollTop;
         });
     }
+    if (multiSelectionHasObjects()) renderSelectedManagerHighlight();
 }
 
 function renderLayerManagerCategory(category, records) {
@@ -3261,13 +3267,15 @@ function compareSelectedGeometries() {
         const resultLayers = [];
         const addResult = (feature, name, color, role) => {
             if (!feature) return;
+            const overlapResult = role === "overlap";
             feature.properties = {
                 name,
+                _lmeSource: "Confronto confini",
                 _lmeColor: color,
                 _lmeFillColor: color,
-                _lmeWeight: 3,
+                _lmeWeight: overlapResult ? 5 : 3,
                 _lmeOpacity: 1,
-                _lmeFillOpacity: 0.48,
+                _lmeFillOpacity: overlapResult ? 0.72 : 0.48,
                 _lmeComparisonResult: true,
                 _lmeComparisonRole: role,
                 _lmeManagerId: undefined
@@ -3278,6 +3286,13 @@ function compareSelectedGeometries() {
         addResult(onlyFirst, `Solo ${managedObjectLabel(polygons[0], 0)}`, "#ef4444", "only-first");
         addResult(onlySecond, `Solo ${managedObjectLabel(polygons[1], 1)}`, "#2563eb", "only-second");
         addResult(overlap, "Sovrapposizione", "#16a34a", "overlap");
+        const comparisonIds = [...resultLayers].reverse().map(layer => managedLayerId(layer, "drawings"));
+        const previousOrder = lmeState.managerObjectOrder.drawings || [];
+        lmeState.managerObjectOrder.drawings = [
+            ...comparisonIds,
+            ...previousOrder.filter(id => !comparisonIds.includes(id))
+        ];
+        saveLayerManagerState();
         const firstArea = onlyFirst ? turf.area(onlyFirst) : 0; const secondArea = onlySecond ? turf.area(onlySecond) : 0; const overlapArea = overlap ? turf.area(overlap) : 0;
         const message = `Confronto creato. Solo primo confine: ${formatArea(firstArea)}. Solo secondo confine: ${formatArea(secondArea)}. Sovrapposizione: ${formatArea(overlapArea)}.`;
         lmeState.managerSelectedObjectIds.clear();
@@ -3358,6 +3373,10 @@ function toggleMultiSelection() {
     return lmeState.multiSelectionEnabled;
 }
 
+function multiSelectionHasObjects() {
+    return lmeState.multiSelectionEnabled && lmeState.managerSelectedObjectIds.size > 0;
+}
+
 function refreshMultipleMapSelection(preferredRecord) {
     clearManagerHighlight();
     const selectedRecords = selectedManagedRecords();
@@ -3389,8 +3408,8 @@ function showLeafletToolbarHelp() {
             <div><dt>▱</dt><dd><strong>Elimina disegni</strong>Premi il cestino e scegli Solo selezionato oppure Tutti. L'oggetto rimosso può essere recuperato con Annulla o dal cestino negli strumenti avanzati.</dd></div>
             <div><dt>✓</dt><dd><strong>Controlla e ripara</strong>Verifica gli oggetti selezionati e prova a correggere coordinate duplicate o poligoni non validi. Esempio: usalo quando un contorno importato non si esporta o si riempie male; al termine compare un riepilogo.</dd></div>
             <div><dt>◉</dt><dd><strong>Crea foro</strong>Seleziona esattamente due poligoni: prima l'area esterna, poi quella interna. Esempio: sottrai il cortile dal perimetro di un fabbricato o un'isola esclusa da un'area di lavoro.</dd></div>
-            <div><dt>☑</dt><dd><strong>Selezione multipla</strong>Attiva il comando e tocca più oggetti sulla mappa per aggiungerli o rimuoverli dalla selezione. Disattivalo per tornare alla selezione singola. È utile prima di Confronta, Unisci, Buffer e altre operazioni su più oggetti.</dd></div>
-            <div><dt>⇄</dt><dd><strong>Confronta due confini</strong>Apri il comando e scegli Confronta dopo aver selezionato esattamente due poligoni. L'app crea il solo primo in rosso, il solo secondo in blu e la sovrapposizione in verde. Usa Pulisci confronto per rimuovere soltanto questi risultati.</dd></div>
+            <div><dt>☑</dt><dd><strong>Selezione multipla</strong>Attiva il comando e tocca più oggetti sulla mappa per aggiungerli o rimuoverli dalla selezione. Gli oggetti restano evidenziati anche aprendo e chiudendo i pannelli. Disattivalo per tornare alla selezione singola.</dd></div>
+            <div><dt>⇄</dt><dd><strong>Confronta due confini</strong>Apri il comando e scegli Confronta dopo aver selezionato esattamente due poligoni. Il gruppo Confronto confini viene collocato sopra gli altri layer: rosso indica solo il primo, blu solo il secondo e verde la sovrapposizione. Usa Pulisci confronto per rimuovere soltanto questi risultati.</dd></div>
             <div><dt>PF</dt><dd><strong>Scarica Punti Fiduciali</strong>Seleziona una particella o un foglio catastale; in alternativa usa la particella rilevata dal GPS. I PF vengono aggiunti come sottogruppo del relativo foglio e richiedono LME Pro.</dd></div>
             <div><dt>?</dt><dd><strong>Guida</strong>Riapre questa descrizione. I risultati di riparazione e confronto vengono mostrati anche in una finestra; per uscire dalla visualizzazione rosso, blu e verde usa Pulisci confronto.</dd></div>
         </dl>
@@ -4050,6 +4069,13 @@ function highlightManagedParent(row, key, records) {
 }
 
 function renderSelectedManagerHighlight() {
+    if (multiSelectionHasObjects()) {
+        const selected = [...lmeState.managerSelectedObjectIds]
+            .map(id => lmeState.managerRecords.get(id))
+            .filter(Boolean);
+        renderManagerHighlight(selected);
+        return;
+    }
     if (lmeState.managerHighlightedParentRecords?.length) {
         renderManagerHighlight(lmeState.managerHighlightedParentRecords);
         return;