From f727712bfa084f1ded75a39b8a91b660c17c738c Mon Sep 17 00:00:00 2001
From: Dan Albert <dan@gingerhq.net>
Date: Wed, 16 Jun 2021 17:20:08 -0700
Subject: [PATCH] Make non-interactive map elements unobstructive.

This makes most of the lines and polygons on the map non-interactive so
they don't capture mouse events, and also makes the culling exclusion
zones unfilled so they don't obscure real map objects in dense areas.

Fixes https://github.com/dcs-liberation/dcs_liberation/issues/1217
---
 changelog.md            |  1 +
 resources/ui/map/map.js | 19 ++++++++++++++++---
 2 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/changelog.md b/changelog.md
index a68966a2..80f765e1 100644
--- a/changelog.md
+++ b/changelog.md
@@ -19,6 +19,7 @@ Saves from 3.x are not compatible with 4.0.
 
 * **[Campaign AI]** Fix procurement for factions that lack some unit types.
 * **[Mission Generation]** Fixed problem with mission load when control point name contained an apostrophe.
+* **[UI]** Made non-interactive map elements less obstructive.
 
 # 3.0.0
 
diff --git a/resources/ui/map/map.js b/resources/ui/map/map.js
index 5a8dee3d..9cfed8c6 100644
--- a/resources/ui/map/map.js
+++ b/resources/ui/map/map.js
@@ -428,6 +428,7 @@ class ControlPoint {
     return L.polyline([this.cp.position, destination], {
       color: Colors.Green,
       weight: 1,
+      interactive: false,
     });
   }
 
@@ -519,6 +520,7 @@ class TheaterGroundObject {
         color: detectionColor,
         fill: false,
         weight: 1,
+        interactive: false,
       }).addTo(detectionLayer);
     });
 
@@ -528,6 +530,7 @@ class TheaterGroundObject {
         color: threatColor,
         fill: false,
         weight: 2,
+        interactive: false,
       }).addTo(threatLayer);
     });
   }
@@ -737,12 +740,15 @@ class Flight {
     const color = this.flight.blue ? Colors.Blue : Colors.Red;
     const layer = this.flightPlanLayer();
     if (this.flight.selected) {
-      this.path = L.polyline(path, { color: Colors.Highlight })
+      this.path = L.polyline(path, {
+        color: Colors.Highlight,
+        interactive: false,
+      })
         .addTo(selectedFlightPlansLayer)
         .addTo(layer)
         .addTo(allFlightPlansLayer);
     } else {
-      this.path = L.polyline(path, { color: color })
+      this.path = L.polyline(path, { color: color, interactive: false })
         .addTo(layer)
         .addTo(allFlightPlansLayer);
     }
@@ -760,6 +766,7 @@ class Flight {
         this.commitBoundary = L.polyline(this.flight.commitBoundary, {
           color: Colors.Highlight,
           weight: 1,
+          interactive: false,
         })
           .addTo(selectedFlightPlansLayer)
           .addTo(this.flightPlanLayer())
@@ -819,6 +826,7 @@ function _drawThreatZones(zones, layer, player) {
       fill: true,
       fillOpacity: 0.4,
       noClip: true,
+      interactive: false,
     }).addTo(layer);
   }
 }
@@ -874,6 +882,7 @@ function drawNavmesh(zones, layer) {
       color: "#000000",
       weight: 1,
       fill: false,
+      interactive: false,
     }).addTo(layer);
   }
 }
@@ -896,6 +905,7 @@ function drawMapZones() {
       color: "#344455",
       fillColor: "#344455",
       fillOpacity: 1,
+      interactive: false,
     }).addTo(seaZones);
   }
 
@@ -904,6 +914,7 @@ function drawMapZones() {
       color: "#969696",
       fillColor: "#4b4b4b",
       fillOpacity: 1,
+      interactive: false,
     }).addTo(inclusionZones);
   }
 
@@ -912,6 +923,7 @@ function drawMapZones() {
       color: "#969696",
       fillColor: "#303030",
       fillOpacity: 1,
+      interactive: false,
     }).addTo(exclusionZones);
   }
 }
@@ -923,7 +935,8 @@ function drawUnculledZones() {
     L.circle(zone.position, {
       radius: zone.radius,
       color: "#b4ff8c",
-      stroke: false,
+      fill: false,
+      interactive: false,
     }).addTo(unculledZones);
   }
 }