ffb76857c7
- `useMapContextMenu.js`: - `openPoiModal` in `addItemsToMapContextMenu` integriert, um Zugriff auf `setShowCoordinatesModal` und `setShowPoiModal` zu ermöglichen. - `setShowCoordinatesModal` wird korrekt als Parameter übergeben und verwaltet. - `POI hinzufügen`-Eintrag im Kontextmenü wurde verbessert. - `MapComponent.js`: - `setShowCoordinatesModal`, `setShowPoiModal` und `setPopupCoordinates` werden jetzt korrekt an `addItemsToMapContextMenu` übergeben. - `ShowAddStationPopup` Modal öffnet sich jetzt korrekt und überlagert die Seite. - UI-Verbesserungen für Modale und Fix für doppeltes Öffnen von Modalen. Fixes: Problem, dass mehrere Modale gleichzeitig geöffnet wurden und `setShowCoordinatesModal` nicht definiert war.
88 lines
2.7 KiB
JavaScript
88 lines
2.7 KiB
JavaScript
// components/useMapContextMenu.js
|
|
import { toast } from "react-toastify";
|
|
import { zoomIn, zoomOut, centerHere } from "../utils/zoomAndCenterUtils";
|
|
|
|
// components/useMapContextMenu.js
|
|
const addItemsToMapContextMenu = (
|
|
map,
|
|
menuItemAdded,
|
|
setMenuItemAdded,
|
|
setShowCoordinatesModal,
|
|
setShowPoiModal,
|
|
setPopupCoordinates,
|
|
openPopupWithCoordinates // Hier wird die Funktion als Parameter hinzugefügt
|
|
) => {
|
|
const openPoiModal = (e) => {
|
|
setShowCoordinatesModal(false); // ✅ Jetzt verfügbar, weil als Parameter übergeben
|
|
setPopupCoordinates(e.latlng);
|
|
setShowPoiModal(true);
|
|
};
|
|
if (!menuItemAdded && map && map.contextmenu) {
|
|
map.contextmenu.addItem({
|
|
text: "Koordinaten anzeigen",
|
|
icon: "img/not_listed_location.png",
|
|
callback: openPopupWithCoordinates, // Aufruf des Popup-Callbacks
|
|
});
|
|
|
|
map.contextmenu.addItem({ separator: true });
|
|
|
|
map.contextmenu.addItem({
|
|
text: "Reinzoomen",
|
|
icon: "img/zoom_in.png",
|
|
callback: (e) => {
|
|
const currentZoom = map.getZoom();
|
|
const newZoom = Math.min(15, currentZoom + 3); // Stellt sicher, dass max. 15 erreicht wird
|
|
const zoomDifference = Math.abs(newZoom - currentZoom); // Anzahl der Zoom-Stufen
|
|
const duration = zoomDifference * 0.5; // Pro Stufe 0.5 Sekunden
|
|
|
|
map.flyTo(map.getCenter(), newZoom, {
|
|
animate: true,
|
|
duration: duration,
|
|
});
|
|
},
|
|
});
|
|
|
|
map.contextmenu.addItem({
|
|
text: "Rauszoomen",
|
|
icon: "img/zoom_out.png",
|
|
callback: () => {
|
|
const currentZoom = map.getZoom();
|
|
const newZoom = Math.max(6, currentZoom - 3); // Stellt sicher, dass min. 6 erreicht wird
|
|
const zoomDifference = Math.abs(newZoom - currentZoom); // Anzahl der Zoom-Stufen
|
|
const duration = zoomDifference * 0.5; // Pro Stufe 0.5 Sekunden
|
|
|
|
map.flyTo(map.getCenter(), newZoom, {
|
|
animate: true,
|
|
duration: duration,
|
|
});
|
|
},
|
|
});
|
|
|
|
map.contextmenu.addItem({
|
|
text: "Hier zentrieren",
|
|
icon: "img/center_focus.png",
|
|
callback: (e) => {
|
|
map.panTo(e.latlng);
|
|
},
|
|
});
|
|
|
|
setMenuItemAdded(true);
|
|
}
|
|
if (!menuItemAdded && map && map.contextmenu) {
|
|
const editMode = localStorage.getItem("editMode") === "true";
|
|
if (editMode) {
|
|
console.log("map :", map);
|
|
console.log("editMode localStorage:", localStorage.getItem("editMode"));
|
|
console.log("editMode:", editMode);
|
|
|
|
map.contextmenu.addItem({
|
|
text: "POI hinzufügen",
|
|
icon: "/img/add_station.png",
|
|
callback: openPoiModal, // Jetzt mit Zugriff auf `setShowPoiModal`
|
|
});
|
|
}
|
|
}
|
|
};
|
|
|
|
export default addItemsToMapContextMenu;
|