// 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 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"; import { toast } from "react-toastify"; // Funktion zum Deaktivieren der Polyline-Ereignisse export function disablePolylineEvents(polylines) { polylines.forEach((polyline) => { polyline.off("mouseover"); polyline.off("mouseout"); }); } // Funktion zum Aktivieren der Polyline-Ereignisse 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"); //localStorage.setItem("polylineLink", link); }); 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) => { const markers = []; const polylines = []; const editMode = localStorage.getItem("editMode") === "true"; // Prüfen, ob der Bearbeitungsmodus aktiv ist linePositions.forEach((lineData, lineIndex) => { const lineMarkers = []; lineData.coordinates.forEach((coord, index) => { let icon = circleIcon; if (index === 0) { icon = startIcon; } else if (index === lineData.coordinates.length - 1) { icon = endIcon; } // Nur Marker mit circleIcon ausblenden, wenn Bearbeitungsmodus deaktiviert ist if (icon !== circleIcon || editMode) { const marker = L.marker(coord, { icon: icon, draggable: editMode, // Nur verschiebbar, wenn Bearbeitungsmodus aktiv ist contextmenu: true, contextmenuInheritItems: false, contextmenuItems: [], }).addTo(map); marker.on("dragend", () => { console.log("Marker wurde verschoben in setupPolylines.js"); if (editMode) { const newCoords = marker.getLatLng(); setNewCoords(newCoords); const newCoordinates = [...lineData.coordinates]; newCoordinates[index] = [newCoords.lat, newCoords.lng]; const updatedPolyline = L.polyline(newCoordinates, { color: lineColors[`${lineData.idLD}-${lineData.idModul}`] || "#000000", }).addTo(map); updatedPolyline.bindTooltip(tooltipContents[`${lineData.idLD}-${lineData.idModul}`] || "Standard-Tooltip-Inhalt", { permanent: false, direction: "auto", }); updatedPolyline.on("mouseover", () => { updatedPolyline.setStyle({ weight: 20 }); updatedPolyline.bringToFront(); }); updatedPolyline.on("mouseout", () => { updatedPolyline.setStyle({ weight: 3 }); }); polylines[lineIndex].remove(); polylines[lineIndex] = updatedPolyline; lineData.coordinates = newCoordinates; const requestData = { idModul: lineData.idModul, idLD: lineData.idLD, newCoordinates, }; fetch("/api/talas_v5_DB/gisLines/updateLineCoordinates", { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify(requestData), }) .then((response) => { if (!response.ok) { return response.json().then((data) => { throw new Error(data.error || "Unbekannter Fehler"); }); } return response.json(); }) .then((data) => { console.log("Koordinaten erfolgreich aktualisiert:", data); }) .catch((error) => { console.error("Fehler beim Aktualisieren der Koordinaten:", error.message); }); } else { toast.error("Benutzer hat keine Berechtigung zum Bearbeiten.", { position: "top-center", autoClose: 5000, hideProgressBar: false, closeOnClick: true, pauseOnHover: true, draggable: true, progress: undefined, }); } }); marker.on("mouseover", function () { this.bindContextMenu({ contextmenuItems: [ { text: "Stützpunkt entfernen", icon: "/img/icons/gisLines/remove-support-point.svg", callback: () => { if (editMode) { 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; } else { toast.error("Benutzer hat keine Berechtigung zum Bearbeiten.", { position: "top-center", autoClose: 5000, hideProgressBar: false, closeOnClick: true, pauseOnHover: true, draggable: true, progress: undefined, }); } }, }, ], }); }); marker.on("mouseout", function () { this.unbindContextMenu(); }); lineMarkers.push(marker); } }); const polyline = L.polyline(lineData.coordinates, { color: lineColors[`${lineData.idLD}-${lineData.idModul}`] || "#000000", weight: 3, contextmenu: true, contextmenuItems: [], }).addTo(map); // Füge "Stützpunkt hinzufügen" nur hinzu, wenn editMode aktiv ist if (editMode) { polyline.options.contextmenuItems.push({ 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(); }, }); } // Hier wird der Tooltip hinzugefügt polyline.bindTooltip(tooltipContents[`${lineData.idLD}-${lineData.idModul}`] || "Standard-Tooltip-Inhalt", { permanent: false, direction: "auto", }); 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}`; 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 }); }); // Speichere den Link bei einem Rechtsklick (Kontextmenü) polyline.on("contextmenu", (e) => { const link = `${process.env.NEXT_PUBLIC_BASE_URL}cpl.aspx?ver=35&kue=24&id=${lineData.idLD}`; console.log("Link der Linie (via Rechtsklick):", link); localStorage.setItem("lastElementType", "polyline"); localStorage.setItem("polylineLink", link); }); polylines.push(polyline); markers.push(...lineMarkers); }); // Speichere Polylines und LineColors global für den Zugriff in anderen Funktionen window.polylines = polylines; window.lineColors = lineColors; return { markers, polylines }; };