Jetzt muss noch Links für polylines mit localStorage oder Recoil gelöst werden, alle Links für alle Geräte funktionieren gut

utils/initializeMap.js

@@ -5,9 +5,7 @@ import "leaflet/dist/leaflet.css";
 import "leaflet-contextmenu/dist/leaflet.contextmenu.css";
 import * as urls from "../config/urls.js";
 import * as layers from "../config/layers.js";
-import { addContextMenuToMarker } from "./addContextMenuToMarker.js";
-import { openInNewTab } from "./openInNewTab.js";
-import { disablePolylineEvents, enablePolylineEvents } from "./setupPolylines.js";
+import { openInNewTab } from "./openInNewTab.js"; // Korrigiert
 
 export const initializeMap = (mapRef, setMap, setOms, setMenuItemAdded, addItemsToMapContextMenu, hasRights) => {
   if (mapRef.current) {
@@ -24,10 +22,13 @@ export const initializeMap = (mapRef, setMap, setOms, setMenuItemAdded, addItems
           text: "Station öffnen (Tab)",
           icon: "/img/screen_new.png",
           callback: (e) => {
-            const clickedMarker = e.relatedTarget;
-            if (clickedMarker) {
-              // Verwende die Funktion zum Öffnen in einem neuen Tab
-              openInNewTab(e, clickedMarker);
+            const clickedElement = e.relatedTarget;
+
+            // Überprüfe, ob der Kontextklick auf eine Polyline oder einen Marker erfolgt ist
+            if (clickedElement instanceof L.Marker || clickedElement instanceof L.Polyline) {
+              openInNewTab(e, clickedElement); // Verwende openInNewTab für beide Fälle
+            } else {
+              console.error("Kein gültiges Ziel für den Kontextmenüeintrag");
             }
           },
         },

utils/openInNewTab.js

@@ -1,4 +1,4 @@
-// /utils/openInNewTab.js
+// utils/openInNewTab.js
 
 export function openInNewTab(e, target) {
   const BASE_URL = process.env.NEXT_PUBLIC_BASE_URL;
@@ -8,9 +8,8 @@ export function openInNewTab(e, target) {
   if (target instanceof L.Marker && target.options.link) {
     // Verwende den Link, der im Marker gespeichert ist
     link = `${BASE_URL}${target.options.link}`;
-    //link = target.options.link;
   } else if (target instanceof L.Polyline) {
-    // Polyline-Logik bleibt unverändert
+    // Polyline-Logik
     const idLD = target.options.idLD;
     if (idLD) {
       link = `${BASE_URL}cpl.aspx?id=${idLD}`;

utils/setupPolylines.js

@@ -1,14 +1,9 @@
 // utils/setupPolylines.js
 import { findClosestPoints } from "./geometryUtils";
-import handlePoiSelect from "./handlePoiSelect";
-import { updateLocationInDatabase } from "../services/apiService";
-import { handleEditPoi, insertNewPOI, removePOI } from "./poiUtils";
-import { parsePoint } from "./geometryUtils";
+import { redrawPolyline } from "./mapUtils";
 import circleIcon from "../components/gisPolylines/icons/CircleIcon";
 import startIcon from "../components/gisPolylines/icons/StartIcon";
 import endIcon from "../components/gisPolylines/icons/EndIcon";
-import { redrawPolyline } from "./mapUtils";
-import { openInNewTab } from "./openInNewTab";
 
 // Funktion zum Deaktivieren der Polyline-Ereignisse
 export function disablePolylineEvents(polylines) {
@@ -22,7 +17,6 @@ export function disablePolylineEvents(polylines) {
 export function enablePolylineEvents(polylines, lineColors) {
   polylines.forEach((polyline) => {
     polyline.on("mouseover", (e) => {
-      //console.log("Mouseover on polyline", polyline.options);
       polyline.setStyle({ weight: 14 });
       const link = `${process.env.NEXT_PUBLIC_BASE_URL}cpl.aspx?id=${polyline.options.idLD}`;
       localStorage.setItem("lastElementType", "polyline");
@@ -30,19 +24,20 @@ export function enablePolylineEvents(polylines, lineColors) {
     });
 
     polyline.on("mouseout", (e) => {
-      //console.log("Mouseout from polyline", polyline.options);
       polyline.setStyle({ weight: 3 });
     });
   });
 }
 
-export const setupPolylines = (map, linePositions, lineColors, tooltipContents, setNewCoords, tempMarker, currentZoom, currentCenter) => {
+export const setupPolylines = (map, linePositions, lineColors, tooltipContents, setNewCoords, tempMarker) => {
   const markers = [];
   const polylines = [];
 
+  // Loop über die Linienpositionen
   linePositions.forEach((lineData, lineIndex) => {
     const lineMarkers = [];
 
+    // Loop über die Koordinaten der Linie und Erstellung der Marker
     lineData.coordinates.forEach((coord, index) => {
       let icon = circleIcon;
       if (index === 0) {
@@ -54,11 +49,10 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents,
       const marker = L.marker(coord, {
         icon: icon,
         draggable: true,
-        contextmenu: true,
-        contextmenuInheritItems: false,
-        contextmenuItems: [],
+        contextmenu: true, // Ermögliche das Kontextmenü für Marker
       }).addTo(map);
 
+      // Logik, um Marker zu verschieben und Polyline neu zu zeichnen
       marker.on("dragend", () => {
         const newCoords = marker.getLatLng();
         setNewCoords(newCoords);
@@ -75,7 +69,7 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents,
         });
 
         updatedPolyline.on("mouseover", () => {
-          updatedPolyline.setStyle({ weight: 20 });
+          updatedPolyline.setStyle({ weight: 14 });
           updatedPolyline.bringToFront();
         });
 
@@ -83,10 +77,12 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents,
           updatedPolyline.setStyle({ weight: 3 });
         });
 
+        // Alte Polyline entfernen und die neue setzen
         polylines[lineIndex].remove();
         polylines[lineIndex] = updatedPolyline;
         lineData.coordinates = newCoordinates;
 
+        // Koordinaten aktualisieren
         const requestData = {
           idModul: lineData.idModul,
           idLD: lineData.idLD,
@@ -116,75 +112,37 @@ export const setupPolylines = (map, linePositions, lineColors, tooltipContents,
           });
       });
 
-      marker.on("mouseover", function () {
-        this.bindContextMenu({
-          contextmenuItems: [
-            {
-              text: "Stützpunkt entfernen",
-              icon: "/img/icons/gisLines/remove-support-point.svg",
-              callback: () => {
-                const newCoords = marker.getLatLng();
-                const newCoordinates = [...lineData.coordinates];
-                newCoordinates[index] = [newCoords.lat, newCoords.lng];
-
-                removePOI(marker, lineData, currentZoom, currentCenter);
-                polylines[lineIndex].remove();
-                lineData.coordinates = newCoordinates;
-              },
-            },
-          ],
-        });
-      });
-
-      marker.on("mouseout", function () {
-        this.unbindContextMenu();
-      });
-
+      // Marker in die Liste einfügen
       lineMarkers.push(marker);
     });
 
+    // Polyline hinzufügen
     const polyline = L.polyline(lineData.coordinates, {
       color: lineColors[`${lineData.idLD}-${lineData.idModul}`] || "#000000",
       weight: 3,
-      contextmenu: true,
-      contextmenuItems: [
-        {
-          text: "Stützpunkt hinzufügen",
-          icon: "/img/icons/gisLines/add-support-point.svg",
-          callback: (e) => {
-            if (tempMarker) {
-              tempMarker.remove();
-            }
-            const newPoint = e.latlng;
-            const closestPoints = findClosestPoints(lineData.coordinates, newPoint, map);
-            insertNewPOI(closestPoints, newPoint, lineData, map);
-            redrawPolyline(lineData, lineColors, tooltipContents, map);
-            window.location.reload();
-          },
-        },
-      ],
+      contextmenu: true, // Ermögliche das Kontextmenü für Polylines
     }).addTo(map);
 
-    // Hier wird der Tooltip hinzugefügt
+    // Tooltip für die Polyline hinzufügen
     polyline.bindTooltip(tooltipContents[`${lineData.idLD}-${lineData.idModul}`] || "Standard-Tooltip-Inhalt", {
       permanent: false,
       direction: "auto",
     });
 
+    // Hover-Ereignisse für Polylines
     polyline.on("mouseover", (e) => {
-      //console.log("Mouseover on polyline", lineData);
       polyline.setStyle({ weight: 14 });
-      const link = `${process.env.NEXT_PUBLIC_BASE_URL}cpl.aspx?ver=35&kue=24&id=${lineData.idLD}`;
+      const link = `${process.env.NEXT_PUBLIC_BASE_URL}cpl.aspx?id=${lineData.idLD}`;
       console.log("Link der Linie:", link);
       localStorage.setItem("lastElementType", "polyline");
       localStorage.setItem("polylineLink", link);
     });
 
     polyline.on("mouseout", (e) => {
-      // console.log("Mouseout from polyline", lineData);
       polyline.setStyle({ weight: 3 });
     });
 
+    // Polyline und Marker in ihre jeweiligen Listen einfügen
     polylines.push(polyline);
     markers.push(...lineMarkers);
   });