diff --git a/components/MapComponent.js b/components/MapComponent.js index 9b320e6e4..eb4101e67 100644 --- a/components/MapComponent.js +++ b/components/MapComponent.js @@ -76,6 +76,7 @@ import { } from "../utils/contextMenuUtils.js"; import { MAP_VERSION } from "../config/settings"; import * as layers from "../config/layers.js"; +import useMapContextMenu from "./useMapContextMenu.js"; //--------------------------------------------------------------------- //-------------------- MapComponent ----------------------------------- @@ -301,6 +302,12 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { ); // Abhängigkeit zu hasRights hinzufügen //-----Kontextmenu----ende------------ + + const { addItemsToMapContextMenu } = useMapContextMenu( + map, + hasRights, + addStationCallback + ); //------------------------------------------ */ const layerNames = { "GSM Modem": "GSMMODEM", @@ -884,7 +891,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { //------------------------------------------ //-------------------------------------------------- - const addItemsToMapContextMenu = () => { + /* const addItemsToMapContextMenu = () => { if (!menuItemAdded) { //console.log("contextMenuItems hasRights:", hasRights); @@ -897,7 +904,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { setMenuItemAdded(true); // Menüpunkt wurde hinzugefült, Zustand aktualisieren } - }; + }; */ useEffect(() => { if (map && poiLayerRef.current && isPoiTypLoaded && !menuItemAdded) { diff --git a/components/useMapContextMenu.js b/components/useMapContextMenu.js new file mode 100644 index 000000000..dc33eab7e --- /dev/null +++ b/components/useMapContextMenu.js @@ -0,0 +1,22 @@ +import { useState, useCallback } from "react"; + +const useMapContextMenu = (map, hasRights, addStationCallback) => { + const [menuItemAdded, setMenuItemAdded] = useState(false); + + const addItemsToMapContextMenu = useCallback(() => { + if (map && !menuItemAdded) { + map.contextmenu.addItem({ + text: "POI hinzufügen", + icon: "img/add_station.png", + className: "background-red", + callback: (event) => addStationCallback(event, hasRights), + }); + + setMenuItemAdded(true); // Menüpunkt wurde hinzugefült, Zustand aktualisieren + } + }, [map, menuItemAdded, hasRights, addStationCallback]); + + return { addItemsToMapContextMenu }; +}; + +export default useMapContextMenu; diff --git a/config/config.js b/config/config.js index 454b5058b..f5a9978ea 100644 --- a/config/config.js +++ b/config/config.js @@ -1,33 +1,5 @@ // /config/config.js -// BASE_URL für Station öffnen in neuer tab und gleicher tab, im localhost gab es keine Probleme mit der Frame -//export const BASE_URL = "http://10.10.0.13/talas5/devices/"; -//const baseUrl = "http://localhost:3000/talas5/devices/"; -//const baseUrl = "http://192.168.10.14/talas5/devices/"; -//---- -//Talas_v5 Server -//export const OFFLINE_TILE_LAYER = "/mapTiles/{z}/{x}/{y}.png"; // wenn im von localhost also selben Server die Karte angezeigt wird -//export const OFFLINE_TILE_LAYER = "/mapTiles/{z}/{x}/{y}.png"; -//const onlineTileLayer = "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"; -/* export const ONLINE_TILE_LAYER = - "http://10.10.0.13:3000/mapTiles/{z}/{x}/{y}.png"; //Talas_v5 Server */ - -// Create map layers -/* export const MAP_LAYERS = { - TALAS: new L.layerGroup(), - ECI: new L.layerGroup(), - ULAF: new L.layerGroup(), - GSMModem: new L.layerGroup(), - CiscoRouter: new L.layerGroup(), - WAGO: new L.layerGroup(), - Siemens: new L.layerGroup(), - OTDR: new L.layerGroup(), - WDM: new L.layerGroup(), - GMA: new L.layerGroup(), - Sonstige: new L.layerGroup(), - TALASICL: new L.layerGroup(), - lineLayer: new L.LayerGroup(), -}; */ // Definieren der grundlegenden Umgebungseinstellungen und Konfigurationen der Karte const mapVersion = "0.5.3"; // Die Version der verwendeten Karte const standardSideMenu = true; // Einstellung, ob ein standardmäßiges Seitenmenü verwendet wird diff --git a/config/urls.js b/config/urls.js index 07c0b968b..37bf6a782 100644 --- a/config/urls.js +++ b/config/urls.js @@ -1,9 +1,17 @@ // /sonstige/urls.js +// BASE_URL für Station öffnen in neuer tab und gleicher tab, im localhost gab es keine Probleme mit der Frame +//export const BASE_URL = "http://10.10.0.13/talas5/devices/"; +//const baseUrl = "http://localhost:3000/talas5/devices/"; +//const baseUrl = "http://192.168.10.14/talas5/devices/"; +//---- +//Talas_v5 Server +//export const OFFLINE_TILE_LAYER = "/mapTiles/{z}/{x}/{y}.png"; // wenn im von localhost also selben Server die Karte angezeigt wird +//export const OFFLINE_TILE_LAYER = "/mapTiles/{z}/{x}/{y}.png"; export const BASE_URL = "http://10.10.0.13/talas5/devices/"; export const OFFLINE_TILE_LAYER = "/mapTiles/{z}/{x}/{y}.png"; export const ONLINE_TILE_LAYER = - "http://10.10.0.13:3000/mapTiles/{z}/{x}/{y}.png"; + "http://10.10.0.13:3000/mapTiles/{z}/{x}/{y}.png"; //Talas_v5 Server */ //----------------------------------- // weil ich keine API habe, ansonsten serverURL ist localhost(IP-Adresse) für GisSystemStatic für die Benutzerrechte //const serverURL = `${protocol}//${hostname}`; diff --git a/utils/utils.js b/utils/utils.js index 35c88a662..5f162fb0a 100644 --- a/utils/utils.js +++ b/utils/utils.js @@ -181,7 +181,7 @@ export const insertNewMarker = (closestPoints, newPoint, lineData, map) => { }); }; //---------------------------------------------- -export const addItemsToMapContextMenu = () => { +/* export const addItemsToMapContextMenu = () => { const [menuItemAdded, setMenuItemAdded] = useState(false); if (!menuItemAdded) { //console.log("contextMenuItems hasRights:", hasRights); @@ -195,7 +195,7 @@ export const addItemsToMapContextMenu = () => { setMenuItemAdded(true); // Menüpunkt wurde hinzugefült, Zustand aktualisieren } -}; +}; */ //---------------------------------------------- export const saveLineData = (lineData) => { fetch("/api/talas_v5_DB/gisLines/updateLineCoordinates", {