- Stellt sicher, dass die Karte erfolgreich geladen wird und sichtbar ist. - Simuliert Rechtsklick auf Marker und überprüft, ob das Kontextmenü erscheint. - Validiert die Sichtbarkeit des Menüeintrags "Station öffnen (Tab)" im Kontextmenü. - Testet, ob ein Klick auf den Menüeintrag "Station öffnen (Tab)" , dass das Gerät in einem Tab öffnet. - Überprüft, ob die URL des geöffneten Geräts den HTTP-Status 200 zurückgibt (erreichbar). - Fügt Logs und Screenshots zur Fehlerbehebung hinzu.
86 lines
2.6 KiB
JavaScript
86 lines
2.6 KiB
JavaScript
// /components/useMapContextMenu.js
|
|
import { toast } from "react-toastify";
|
|
import { zoomIn, zoomOut, centerHere } from "../utils/zoomAndCenterUtils"; // Assuming these are imported correctly
|
|
|
|
const zoomInCallback = (e, map) => {
|
|
zoomIn(e, map);
|
|
};
|
|
|
|
const zoomOutCallback = (map) => {
|
|
zoomOut(map);
|
|
};
|
|
|
|
const centerHereCallback = (e, map) => {
|
|
centerHere(e, map);
|
|
};
|
|
// Funktion zum Anzeigen der Koordinaten
|
|
const showCoordinates = (e) => {
|
|
alert("Breitengrad: " + e.latlng.lat.toFixed(5) + "\nLängengrad: " + e.latlng.lng.toFixed(5));
|
|
};
|
|
// Kontextmenü Callback für "POI hinzufügen"
|
|
const addStationCallback = (event, hasRights, setShowPopup, setPopupCoordinates) => {
|
|
const editMode = localStorage.getItem("editMode") === "true";
|
|
hasRights = editMode ? hasRights : undefined;
|
|
if (hasRights) {
|
|
setPopupCoordinates(event.latlng);
|
|
setShowPopup(true);
|
|
} else {
|
|
toast.error("Benutzer hat keine Berechtigung zum Hinzufügen.", {
|
|
position: "top-center",
|
|
autoClose: 5000,
|
|
hideProgressBar: false,
|
|
closeOnClick: true,
|
|
pauseOnHover: true,
|
|
draggable: true,
|
|
progress: undefined,
|
|
});
|
|
}
|
|
};
|
|
|
|
export const addItemsToMapContextMenu = (map, menuItemAdded, setMenuItemAdded, hasRights, setShowPopup, setPopupCoordinates) => {
|
|
// Überprüfe den Bearbeitungsmodus in localStorage
|
|
const editMode = localStorage.getItem("editMode") === "true";
|
|
hasRights = editMode ? hasRights : undefined;
|
|
|
|
if (!menuItemAdded && map && map.contextmenu) {
|
|
map.contextmenu.addItem({
|
|
text: "Koordinaten anzeigen",
|
|
icon: "img/not_listed_location.png",
|
|
callback: showCoordinates,
|
|
});
|
|
|
|
map.contextmenu.addItem({ separator: true });
|
|
|
|
map.contextmenu.addItem({
|
|
text: "Reinzoomen",
|
|
icon: "img/zoom_in.png",
|
|
callback: (e) => zoomInCallback(e, map),
|
|
});
|
|
|
|
map.contextmenu.addItem({
|
|
text: "Rauszoomen",
|
|
icon: "img/zoom_out.png",
|
|
callback: () => zoomOutCallback(map),
|
|
});
|
|
|
|
map.contextmenu.addItem({
|
|
text: "Hier zentrieren",
|
|
icon: "img/center_focus.png",
|
|
callback: (e) => centerHereCallback(e, map),
|
|
});
|
|
|
|
// wenn localStorage Variable editMode true ist, dann wird der Button "POI hinzufügen" angezeigt
|
|
if (editMode) {
|
|
map.contextmenu.addItem({ separator: true });
|
|
map.contextmenu.addItem({
|
|
text: "POI hinzufügen",
|
|
icon: "img/add_station.png",
|
|
className: "background-red",
|
|
callback: (event) => addStationCallback(event, hasRights, setShowPopup, setPopupCoordinates),
|
|
});
|
|
}
|
|
|
|
setMenuItemAdded(true);
|
|
}
|
|
};
|