From 18ad7cad7e9d8ce4516cb50552e1b49f25c8bd15 Mon Sep 17 00:00:00 2001
From: ISA <Ismail.ali@littwin-systemtechnik.de>
Date: Thu, 15 Aug 2024 12:10:01 +0200
Subject: [PATCH] =?UTF-8?q?addEventListener=20Error=20Problem=20gel=C3=B6s?=
 =?UTF-8?q?t=20bei=20der=20Linien=20und=20die=20Klicks?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 utils/mapFeatures.js | 61 +++++++++-----------------------------------
 1 file changed, 12 insertions(+), 49 deletions(-)

diff --git a/utils/mapFeatures.js b/utils/mapFeatures.js
index 6d8a8cf93..2135d9ed0 100644
--- a/utils/mapFeatures.js
+++ b/utils/mapFeatures.js
@@ -58,7 +58,7 @@ export const setupMarkers = async (
             popupAnchor: [1, -34],
           }),
           draggable: canDrag,
-          id: location.idPoi,
+          idLD: location.idLD, // Füge die idLD zum Marker hinzu
           name: location.name,
           description: location.description,
         }).bindContextMenu({
@@ -135,9 +135,9 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents,
 
   const checkMouseOverMenu = () => {
     if (!isMouseOverMenuItem) {
-      showContextMenuItemByIndex(map, 0);
-      showContextMenuItemByIndex(map, 1);
-      closeContextMenu(); // Kontextmenü schließen, wenn die Maus nicht mehr darüber ist
+      //showContextMenuItemByIndex(map, 0);
+      //showContextMenuItemByIndex(map, 1);
+      //closeContextMenu(); // Kontextmenü schließen, wenn die Maus nicht mehr darüber ist
     }
   };
 
@@ -160,11 +160,11 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents,
   const handleOutsideClick = (event) => {
     const contextMenuElement = document.querySelector(".leaflet-contextmenu");
     if (contextMenuElement && !contextMenuElement.contains(event.target)) {
-      closeContextMenu(); // Kontextmenü schließen, wenn der Klick außerhalb stattfindet
+      //closeContextMenu(); // Kontextmenü schließen, wenn der Klick außerhalb stattfindet
     }
   };
 
-  document.addEventListener("mousedown", handleOutsideClick);
+  //document.addEventListener("mousedown", handleOutsideClick);
 
   linePositions.forEach((lineData, lineIndex) => {
     const lineMarkers = [];
@@ -270,17 +270,9 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents,
     const polyline = L.polyline(lineData.coordinates, {
       color: lineColors[`${lineData.idLD}-${lineData.idModul}`] || "#000000",
       contextmenu: true,
+      idLD: lineData.idLD, // Füge die idLD zur Polyline hinzu
+      idModul: lineData.idModul, // Füge die idModul zur Polyline hinzu
       contextmenuItems: [
-        {
-          text: "Station öffnen (Tab)",
-          icon: "/img/screen_new.png",
-          callback: (e) => {
-            console.log("lineData idLD:", lineData.idLD);
-            const idLD = lineData.idLD; // Angenommen, die ID der Station ist in lineData vorhanden
-            const link = `${process.env.NEXT_PUBLIC_SERVER_URL}/talas5/devices/cpl.aspx?id=${idLD}`;
-            window.open(link, "_blank"); // Öffne direkt den Link in einem neuen Tab
-          },
-        },
         {
           text: "Stützpunkt hinzufügen",
           icon: "/img/icons/gisLines/add-support-point.svg",
@@ -299,23 +291,21 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents,
     }).addTo(map);
 
     polyline.on("mouseover", (e) => {
-      polyline.setStyle({ weight: 20 });
-      hideContextMenuItemByIndex(map, 0);
-      hideContextMenuItemByIndex(map, 1);
+      polyline.setStyle({ weight: 15 });
     });
 
     polyline.on("mousedown", (e) => {
-      polyline.setStyle({ weight: 20 });
+      polyline.setStyle({ weight: 15 });
     });
 
     polyline.on("mouseup", (e) => {
-      polyline.setStyle({ weight: 20 });
+      polyline.setStyle({ weight: 15 });
     });
 
     polyline.on("mouseout", (e) => {
       polyline.setStyle({ weight: 3 });
       polyline.setStyle({ color: lineColors[`${lineData.idLD}-${lineData.idModul}`] || "#000000" });
-      setTimeout(checkMouseOverMenu, 500);
+      //setTimeout(checkMouseOverMenu, 500);
     });
 
     polyline.bindTooltip(tooltipContents[`${lineData.idLD}-${lineData.idModul}`] || "Standard-Tooltip-Inhalt", {
@@ -330,32 +320,5 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents,
   // Add listeners to the context menu items
   const contextMenuElement = document.querySelector(".leaflet-contextmenu"); // Assuming the context menu class is 'leaflet-contextmenu'
 
-  if (contextMenuElement) {
-    contextMenuElement.addEventListener("mouseover", handleMouseOverMenuItem);
-    contextMenuElement.addEventListener("mouseout", handleMouseOutMenuItem);
-  }
-
   return { markers, polylines };
 };
-
-// Funktion zum Ausblenden eines Kontextmenüelements nach Index
-const hideContextMenuItemByIndex = (map, index) => {
-  const items = map.contextmenu._items;
-  if (index >= 0 && index < items.length) {
-    const itemElement = items[index].el;
-    if (itemElement) {
-      itemElement.style.display = "none"; // Verstecke das Element
-    }
-  }
-};
-
-// Funktion zum Einblenden eines Kontextmenüelements nach Index
-const showContextMenuItemByIndex = (map, index) => {
-  const items = map.contextmenu._items;
-  if (index >= 0 && index < items.length) {
-    const itemElement = items[index].el;
-    if (itemElement) {
-      itemElement.style.display = ""; // Zeige das Element wieder an
-    }
-  }
-};