Generate missing imported sheet outline

Components/Pages/Home.razor

@@ -161,7 +161,7 @@
                                 <input id="gisFileInput" type="file" accept=".kml,.kmz,.geojson,.json,application/vnd.google-earth.kml+xml,application/vnd.google-earth.kmz,application/geo+json" />
                             </label>
                             <label class="toggle-line project-save-option">
-                                <input type="checkbox" checked="@IncludeKmlSheetLayer" @onchange="ToggleKmlSheetLayer" />
+                                <input type="checkbox" @bind="IncludeKmlSheetLayer" @bind:after="ApplyKmlSheetLayerOption" />
                                 <span>KML/KMZ: includi anche il layer del foglio</span>
                             </label>
                             <small class="field-help">
@@ -170,7 +170,7 @@
                                     : "Disattivato: importa solo i poligoni delle particelle riconosciute.")
                             </small>
                             <label class="toggle-line project-save-option">
-                                <input type="checkbox" checked="@ShowImportedSheetLayer" @onchange="ToggleImportedSheetLayer" />
+                                <input type="checkbox" @bind="ShowImportedSheetLayer" @bind:after="ApplyImportedSheetLayerVisibility" />
                                 <span>Mostra cornice/layer del foglio importato</span>
                             </label>
                             <small class="field-help">La cornice grande resta separata dalle particelle e puo essere nascosta anche nei progetti salvati.</small>
@@ -295,7 +295,7 @@
                         <section class="panel-section">
                             <h2>Visualizzazione progetto</h2>
                             <label class="toggle-line project-save-option">
-                                <input type="checkbox" checked="@ShowImportedSheetLayer" @onchange="ToggleImportedSheetLayer" />
+                                <input type="checkbox" @bind="ShowImportedSheetLayer" @bind:after="ApplyImportedSheetLayerVisibility" />
                                 <span>Mostra cornice/layer del foglio importato</span>
                             </label>
                             <small class="field-help">Il comando agisce subito sulla mappa e sui dati del progetto caricato.</small>
@@ -973,18 +973,16 @@
     }
     private Task AddProjectMarker() => JS.InvokeVoidAsync("lmeMap.addProjectMarker", PoiName).AsTask();
 
-    private async Task ToggleKmlSheetLayer(ChangeEventArgs args)
+    private async Task ApplyKmlSheetLayerOption()
     {
-        IncludeKmlSheetLayer = (bool?)args.Value == true;
         ShowImportedSheetLayer = IncludeKmlSheetLayer;
         await JS.InvokeVoidAsync("lmeMap.setIncludeKmlSheetLayer", IncludeKmlSheetLayer);
         await JS.InvokeVoidAsync("lmeMap.setImportedSheetLayerVisible", ShowImportedSheetLayer);
     }
 
-    private async Task ToggleImportedSheetLayer(ChangeEventArgs args)
+    private Task ApplyImportedSheetLayerVisibility()
     {
-        ShowImportedSheetLayer = (bool?)args.Value == true;
-        await JS.InvokeVoidAsync("lmeMap.setImportedSheetLayerVisible", ShowImportedSheetLayer);
+        return JS.InvokeVoidAsync("lmeMap.setImportedSheetLayerVisible", ShowImportedSheetLayer).AsTask();
     }
 
     private async Task ToggleImportedMeasurements(ChangeEventArgs args)

LMEMappeCatastaliApp.csproj

@@ -28,8 +28,8 @@
         <ApplicationId>com.companyname.lmemappecatastaliapp</ApplicationId>
 
         <!-- Versions -->
-        <ApplicationDisplayVersion>0.2.14</ApplicationDisplayVersion>
-        <ApplicationVersion>18</ApplicationVersion>
+        <ApplicationDisplayVersion>0.2.16</ApplicationDisplayVersion>
+        <ApplicationVersion>20</ApplicationVersion>
 
         <!-- To develop, package, and publish an app to the Microsoft Store, see: https://aka.ms/MauiTemplateUnpackaged -->
         <WindowsPackageType>None</WindowsPackageType>

Services/AzureMapsService.cs

@@ -13,7 +13,7 @@ public sealed class AzureMapsService
 
     public AzureMapsService()
     {
-        _httpClient.DefaultRequestHeaders.UserAgent.ParseAdd("LMEMappeCatastali/0.2.14");
+        _httpClient.DefaultRequestHeaders.UserAgent.ParseAdd("LMEMappeCatastali/0.2.16");
         _httpClient.DefaultRequestHeaders.Accept.ParseAdd("application/json");
     }
 

Services/NetworkLocationService.cs

@@ -13,7 +13,7 @@ public sealed class NetworkLocationService
 
     public NetworkLocationService()
     {
-        httpClient.DefaultRequestHeaders.UserAgent.ParseAdd("LMEMappeCatastali/0.2.14");
+        httpClient.DefaultRequestHeaders.UserAgent.ParseAdd("LMEMappeCatastali/0.2.16");
     }
 
     public async Task<NetworkLocationSnapshot?> GetApproximateLocationAsync(

wwwroot/js/lme-map.js

@@ -132,6 +132,8 @@ function init() {
     });
 
     lmeState.currentBase = lmeState.baseLayers.satellite.addTo(lmeState.map);
+    const importedSheetPane = lmeState.map.createPane("importedSheetPane");
+    importedSheetPane.style.zIndex = "520";
     lmeState.imported = L.featureGroup().addTo(lmeState.map);
     lmeState.importedSheets = L.featureGroup();
     lmeState.drawings = L.featureGroup().addTo(lmeState.map);
@@ -469,23 +471,9 @@ function bindFileImport() {
         try {
             const result = await readGisFile(file);
             const geojson = result.geojson;
-            const parcelLayer = L.geoJSON(geojson, {
-                style: { color: "#22c55e", weight: 3, opacity: 0.95, fillOpacity: 0.18 },
-                pointToLayer: (feature, latlng) => L.circleMarker(latlng, { radius: 7, color: "#22c55e", fillColor: "#ffffff", fillOpacity: 0.9 }),
-                onEachFeature: (feature, layer) => {
-                    const name = feature?.properties?.name || file.name;
-                    layer.bindPopup(`<strong>${escapeHtml(name)}</strong>`);
-                }
-            }).addTo(lmeState.imported);
+            const parcelLayer = addImportedFeatures(geojson);
             const sheetGeojson = result.sheetGeojson || emptyFeatureCollection();
-            const sheetLayer = L.geoJSON(sheetGeojson, {
-                style: { color: "#15803d", weight: 3, opacity: 0.85, fillOpacity: 0.04, dashArray: "9 7" },
-                pointToLayer: (feature, latlng) => L.circleMarker(latlng, { radius: 6, color: "#15803d", fillOpacity: 0.25 }),
-                onEachFeature: (feature, layer) => {
-                    const name = feature?.properties?.name || "Foglio catastale importato";
-                    layer.bindPopup(`<strong>${escapeHtml(name)}</strong>`);
-                }
-            }).addTo(lmeState.importedSheets);
+            const sheetLayer = addImportedSheetFeatures(sheetGeojson);
             applyImportedSheetVisibility();
             fitLayer(geojson.features.length ? parcelLayer : sheetLayer);
             refreshImportedMeasurements();
@@ -901,13 +889,76 @@ function setIncludeKmlSheetLayer(enabled) {
 function setImportedSheetLayerVisible(enabled) {
     migrateMisclassifiedImportedSheets();
     lmeState.importedSheetsVisible = Boolean(enabled);
+    const generated = lmeState.importedSheetsVisible && ensureImportedSheetOutline();
     applyImportedSheetVisibility();
     const count = lmeState.importedSheets?.toGeoJSON()?.features?.length || 0;
     setInfo(lmeState.importedSheetsVisible
-        ? (count ? `Layer del foglio importato visibile (${count} elementi).` : "Il layer del foglio sara visibile quando verra importato.")
+        ? (count
+            ? `${generated ? "Cornice generata dai dati importati" : "Layer del foglio importato visibile"} (${count} elementi).`
+            : "Nessun dato importato da cui ricavare la cornice del foglio.")
         : "Layer del foglio importato nascosto; le particelle restano visibili.");
 }
 
+function ensureImportedSheetOutline() {
+    if (!lmeState.imported || !lmeState.importedSheets) {
+        return false;
+    }
+
+    const currentSheets = lmeState.importedSheets.toGeoJSON();
+    const hasAreaOutline = (currentSheets.features || []).some(feature =>
+        ["Polygon", "MultiPolygon"].includes(feature?.geometry?.type));
+    if (hasAreaOutline) {
+        return false;
+    }
+
+    const imported = lmeState.imported.toGeoJSON();
+    const points = collectGeoJsonCoordinates(imported);
+    if (!points.length) {
+        return false;
+    }
+
+    const bounds = points.reduce((result, point) => ({
+        west: Math.min(result.west, point[0]),
+        south: Math.min(result.south, point[1]),
+        east: Math.max(result.east, point[0]),
+        north: Math.max(result.north, point[1])
+    }), { west: Infinity, south: Infinity, east: -Infinity, north: -Infinity });
+    if (!Number.isFinite(bounds.west)
+        || !Number.isFinite(bounds.south)
+        || bounds.east <= bounds.west
+        || bounds.north <= bounds.south) {
+        return false;
+    }
+
+    const longitudePadding = Math.max((bounds.east - bounds.west) * 0.01, 0.000001);
+    const latitudePadding = Math.max((bounds.north - bounds.south) * 0.01, 0.000001);
+    const west = bounds.west - longitudePadding;
+    const south = bounds.south - latitudePadding;
+    const east = bounds.east + longitudePadding;
+    const north = bounds.north + latitudePadding;
+    addImportedSheetFeatures({
+        type: "FeatureCollection",
+        features: [{
+            type: "Feature",
+            properties: {
+                name: "Cornice del foglio importato",
+                _lmeGeneratedSheetOutline: true
+            },
+            geometry: {
+                type: "Polygon",
+                coordinates: [[
+                    [west, south],
+                    [east, south],
+                    [east, north],
+                    [west, north],
+                    [west, south]
+                ]]
+            }
+        }]
+    });
+    return true;
+}
+
 function migrateMisclassifiedImportedSheets() {
     if (!lmeState.imported || !lmeState.importedSheets) {
         return 0;
@@ -942,11 +993,14 @@ function addImportedFeatures(geojson) {
 
 function addImportedSheetFeatures(geojson) {
     return L.geoJSON(geojson || emptyFeatureCollection(), {
-        style: { color: "#15803d", weight: 3, opacity: 0.85, fillOpacity: 0.04, dashArray: "9 7" },
+        pane: "importedSheetPane",
+        style: { color: "#f59e0b", weight: 4, opacity: 1, fillOpacity: 0.03, dashArray: "10 6" },
         pointToLayer: (feature, latlng) => L.circleMarker(latlng, {
-            radius: 6,
-            color: "#15803d",
-            fillOpacity: 0.25
+            pane: "importedSheetPane",
+            radius: 7,
+            color: "#f59e0b",
+            fillColor: "#ffffff",
+            fillOpacity: 0.85
         }),
         onEachFeature: bindStoredFeaturePopup
     }).addTo(lmeState.importedSheets);
@@ -960,8 +1014,7 @@ function applyImportedSheetVisibility() {
         if (!lmeState.map.hasLayer(lmeState.importedSheets)) {
             lmeState.importedSheets.addTo(lmeState.map);
         }
-        lmeState.importedSheets.bringToBack();
-        lmeState.imported.bringToFront();
+        lmeState.importedSheets.bringToFront();
         return;
     }
     if (lmeState.map.hasLayer(lmeState.importedSheets)) {
@@ -1578,6 +1631,9 @@ function loadProjectSnapshot(raw, projectName) {
         lmeState.importedSheetsVisible = projectDisplayOptions
             ? Boolean(projectDisplayOptions.importedSheetsVisible)
             : data.schemaVersion >= 2 && Boolean(data.importedSheetsVisible);
+        if (lmeState.importedSheetsVisible) {
+            ensureImportedSheetOutline();
+        }
         applyImportedSheetVisibility();
         L.geoJSON(data.selectedParcels || emptyFeatureCollection(), {
             style: { color: "#ef4444", weight: 4, opacity: 1, fillColor: "#fbbf24", fillOpacity: 0.26 },