<!-- /docs/utils/devices/createAndSetDevices.md  -->

# 🧭 createAndSetDevices.js – Geräte setzen und verwalten

## Zweck

Diese Datei erstellt Leaflet-Marker für aktive Geräte basierend auf Webservice-Daten  
und konfiguriert Kontexteinträge für Interaktionen wie:

- Geräte-Popup anzeigen
- Station/Gerät per Klick in neue Tab öffnen -> Kontextmenü ->Item "Station öffnen (Tab)"
- Statusinformationen einblenden
- Redux-Aktionen für ausgewähltes Gerät auslösen

Die erzeugten Marker werden über `setMarkersFunction(markersData)` an die aufrufende Komponente
übergeben.

---

## Datenquellen

Die Daten stammen aus:

- `GisStationsStaticDistrict` (statische Stationsinfos)
- `GisStationsStatusDistrict` (Statusinformationen)

Sie werden entweder über echte Webservices oder Mock-Daten geladen.

---

## Besonderheiten

- Marker werden mit Prioritätsicons gerendert
- Redux-Slices:
  - `selectedDeviceSlice` wird bei Hover gesetzt
  - `lineVisibilitySlice` aktualisiert Linienstatus
- Leaflet-Kontextmenü (nur Marker) mit Menüeintrag:  
  „Station öffnen (Tab)“

---

## Dynamische URL mit Port-Logik

Die Station-Links im Kontextmenü nutzen keine feste URL mehr.  
Stattdessen wird dynamisch unterschieden:

```js
const mode = process.env.NEXT_PUBLIC_API_PORT_MODE;

const baseUrl =
  mode === "dev"
    ? `${window.location.protocol}//${window.location.hostname}:80/talas5/`
    : `${window.location.origin}/talas5/`;
```

➡ Dadurch wird verhindert, dass bei jeder Server-IP `.env.development` oder ein Build nötig ist.

---

## Kontextmenüaktion

```js
window.open(`${baseUrl}cpl.aspx?ver=35&kue=24&id=${station.IdLD}`, "_blank");
```

---

## Schutz vor doppelten Kontextmenüs

Ein `contextMenuCreated`-Flag stellt sicher, dass pro Marker nur **ein** Kontextmenü erzeugt wird:

```js
if (!contextMenuCreated) {
  contextMenuCreated = true;
  marker.bindContextMenu({ ... });
}
```

➡ Verhindert Duplikate bei wiederholten Rechtsklicks

---

## Weitere Funktionen

- Popup-HTML enthält Statusanzeigen (Name, Farbe, Meldung)
- Marker werden auf Klick animiert (bounce-Effekt)
- Kontextmenüeinträge werden sauber entfernt bei Klick außerhalb

---

## Tests

- Marker wird bei gültigen Daten erzeugt
- Kontextmenü enthält nur **einen** Eintrag „Station öffnen“
- Popup zeigt korrekte Statusinformationen (Farben, Texte)
- Redux `setSelectedDevice(...)` wird korrekt aufgerufen

---

## Siehe auch

- `setupPolylines.js`
- `redux/slices/selectedDeviceSlice.js`
- Webservices: `fetchGisStationsStaticDistrict.js`, `fetchGisStationsStatusDistrict.js`

---

📄 Pfad: `/docs/frontend/utils/devices/createAndSetDevices.md`

---

[Zurück zur Übersicht](../../README.md)