nodeMap/utils/utils.js

import { useState } from "react";
import circleIcon from "../components/CircleIcon";

export const parsePoint = (position) => {
  const [longitude, latitude] = position.slice(6, -1).split(" ");
  return { latitude: parseFloat(latitude), longitude: parseFloat(longitude) };
};
//----------------------------------------------

export const determinePriority = (iconPath) => {
  const [priorityConfig, setPriorityConfig] = useState([]);
  for (let priority of priorityConfig) {
    if (iconPath.includes(priority.name.toLowerCase())) {
      return priority.level;
    }
  }
  return 5; // Default priority (lowest)
};
//----------------------------------------------
export const createAndSetMarkers = async (systemId, setMarkersFunction) => {
  try {
    const response1 = await fetch(config.mapGisStationsStaticDistrictUrl);
    const jsonResponse = await response1.json();
    const response2 = await fetch(config.mapGisStationsStatusDistrictUrl);
    const statusResponse = await response2.json();

    const getIdSystemAndAllowValueMap = new Map(
      GisSystemStatic.map((system) => [system.IdSystem, system.Allow])
    );
    //console.log("getIdSystemAndAllowValueMap:", getIdSystemAndAllowValueMap);

    if (jsonResponse.Points && statusResponse.Statis) {
      const statisMap = new Map(statusResponse.Statis.map((s) => [s.IdLD, s]));
      let markersData = jsonResponse.Points.filter(
        (station) =>
          station.System === systemId &&
          getIdSystemAndAllowValueMap.get(station.System) === 1
      ).map((station) => {
        const statis = statisMap.get(station.IdLD);
        const iconPath = statis
          ? `img/icons/${statis.Na}-marker-icon-${station.Icon}.png`
          : `img/icons/marker-icon-${station.Icon}.png`;

        const priority = determinePriority(iconPath);
        const zIndexOffset = 100 * (5 - priority); // Adjusted for simplicity and positive values

        const marker = L.marker([station.X, station.Y], {
          icon: L.icon({
            iconUrl: iconPath,
            iconSize: [25, 41],
            iconAnchor: [12, 41],
            popupAnchor: [1, -34],
          }),
          areaName: station.Area_Name, // Stelle sicher, dass dieser Bereich gesetzt wird
          link: station.Link,
          zIndexOffset: zIndexOffset,
          bounceOnAdd: !!statis,
        });

        if (statis) {
          marker.on("add", () => marker.bounce(3));
        }

        const statusInfo = statusResponse.Statis.filter(
          (status) => status.IdLD === station.IdLD
        )
          .reverse()
          .map(
            (status) => `
                <div class="flex items-center my-1">
                  <div class="w-2 h-2 mr-2 inline-block rounded-full" style="background-color: ${status.Co};"></div>
                  ${status.Me}&nbsp;<span style="color: ${status.Co};">(${status.Na})</span>
                </div>
              `
          )
          .join("");

        marker.bindPopup(`
              <div class=" bg-white rounded-lg ">
                <span class="text-lg font-semibold text-gray-900">${station.LD_Name}</span>
                <span class="text-md font-bold text-gray-800"> ${station.Device}</span><br>
                <span class="text-gray-800"><strong> ${station.Area_Short} </strong>(${station.Area_Name})</span><br>
                <span class="text-gray-800"><strong>${station.Location_Short} </strong> (${station.Location_Name})</span>
                <div class="mt-2">${statusInfo}</div>
              </div>
            `);
        return marker;
      });

      setMarkersFunction(markersData);
    }
  } catch (error) {
    console.error("Error fetching data: ", error);
  }
};
//----------------------------------------------
export const fetchPriorityConfig = async () => {
  try {
    const response = await fetch("/api/talas_v5_DB/priorityConfig");
    const data = await response.json();
    console.log("Prioritätskonfiguration:", data);
    setPriorityConfig(data);
  } catch (error) {
    console.error("Fehler beim Laden der Prioritätskonfiguration:", error);
  }
};
//----------------------------------------------
export const fetchGisStatusStations = async (idMap, idUser) => {
  try {
    const response = await fetch(
      `/api/talas5/webserviceMap/GisStationsStatusDistrict?idMap=${idMap}&idUser=${idUser}`
    );
    if (!response.ok) {
      throw new Error(`Error: ${response.statusText}`);
    }
    const data = await response.json();
    console.log("GisStatusStations:", data);
    return data;
  } catch (error) {
    console.error("Fehler beim Abrufen der Daten:", error);
  }
};
//----------------------------------------------
export const handleEditPoi = (marker) => {
  // Prüfung, ob der Benutzer die notwendigen Rechte hat
  if (!userRights || !userRights.includes(56)) {
    toast.error("Benutzer hat keine Berechtigung zum Bearbeiten.", {
      position: "top-center",
      autoClose: 5000,
      hideProgressBar: false,
      closeOnClick: true,
      pauseOnHover: true,
      draggable: true,
      progress: undefined,
    });
    console.log("Benutzer hat keine Berechtigung zum Bearbeiten.");
    return; // Beendet die Funktion frühzeitig, wenn keine Berechtigung vorliegt
  }

  //console.log("Selected Marker ID (idPoi):", marker.options.idPoi);
  //console.log("Selected Marker Description:", marker.options.description);

  setCurrentPoiData({
    idPoi: marker.options.id,
    name: marker.options.name,
    description: marker.options.description,
  });
  //console.log("POI-Daten1:", currentPoiData);

  fetchPoiData(marker.options.id);

  setShowPoiUpdateModal(true);
};
//----------------------------------------------
export const insertNewMarker = (closestPoints, newPoint, lineData, map) => {
  const newMarker = L.marker(newPoint, {
    icon: circleIcon,
    draggable: true,
  }).addTo(map);
  lineData.coordinates.splice(closestPoints[2], 0, [
    newPoint.lat,
    newPoint.lng,
  ]);

  // Hier direkt speichern nach Einfügen
  saveLineData(lineData);

  redrawPolyline(lineData);

  // Event-Listener für das Verschieben des Markers hinzufügen
  newMarker.on("dragend", () => {
    const newCoords = newMarker.getLatLng();
    setNewCoords(newCoords);
    const newCoordinates = [...lineData.coordinates];
    newCoordinates[closestPoints[2]] = [newCoords.lat, newCoords.lng];
    lineData.coordinates = newCoordinates;
    redrawPolyline(lineData);

    updateMarkerPosition(newMarker.getLatLng(), lineData, newMarker);
    saveLineData(lineData); // Speichern der neuen Koordinaten nach dem Verschieben
  });
};
//----------------------------------------------
export const addItemsToMapContextMenu = () => {
  const [menuItemAdded, setMenuItemAdded] = useState(false);
  if (!menuItemAdded) {
    //console.log("contextMenuItems hasRights:", hasRights);

    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
  }
};
//----------------------------------------------
export const saveLineData = (lineData) => {
  fetch("/api/talas_v5_DB/gisLines/updateLineCoordinates", {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
    },
    body: JSON.stringify({
      idModul: lineData.idModul,
      idLD: lineData.idLD,
      newCoordinates: lineData.coordinates,
    }),
  })
    .then((response) => {
      if (!response.ok) {
        throw new Error("Fehler beim Speichern der Linienänderungen");
      }
      return response.json();
    })
    .then((data) => {
      console.log("Linienänderungen gespeichert:", data);
    })
    .catch((error) => {
      console.error("Fehler beim Speichern der Linienänderungen:", error);
    });
};
//----------------------------------------------
/* export const redrawPolyline = (lineData) => {
  const [lineColors, setLineColors] = useState({}); */
import L from "leaflet";

export const redrawPolyline = (lineData, lineColors, tooltipContents, map) => {
  if (!lineData || !lineColors || !tooltipContents || !map) {
    console.error("Invalid parameters for redrawPolyline");
    return;
  }

  if (!lineData.coordinates || !Array.isArray(lineData.coordinates)) {
    console.error("Invalid coordinates in lineData");
    return;
  }

  const color = lineColors[lineData.idModul] || "#000000";
  const tooltipContent =
    tooltipContents[lineData.idModul] || "Standard-Tooltip-Inhalt";

  if (lineData.polyline) map.removeLayer(lineData.polyline);

  lineData.polyline = L.polyline(lineData.coordinates, {
    color: color,
  }).addTo(map);

  lineData.polyline.bindTooltip(tooltipContent, {
    permanent: false,
    direction: "auto",
  });

  lineData.polyline.on("mouseover", () => {
    lineData.polyline.setStyle({ weight: 10 });
    lineData.polyline.bringToFront();
  });

  lineData.polyline.on("mouseout", () => {
    lineData.polyline.setStyle({ weight: 5 });
  });
};