1document.addEventListener("DOMContentLoaded", function() {
2    let selectedColor = 'blue';  // Standardmäßig blau
3    let isDragging = false;      // Um das Ziehen zu erkennen
4    let currentRow = null;       // Um die aktuelle Zeile zu speichern
5
6    // EventListener für die Farbauswahl in der Legende
7    const legendItems = document.querySelectorAll(".legend span");
8    legendItems.forEach(item => {
9        item.addEventListener("click", function() {
10            selectedColor = getComputedStyle(item).backgroundColor;  // Setzt die gewählte Farbe
11        });
12    });
13
14    // EventListener für den Löschbereich in der Legende
15    const deleteButton = document.querySelector(".legend-delete");
16    deleteButton.addEventListener("click", function() {
17        selectedColor = '';  // Setzt die gewählte Farbe auf leer (löschen)
18    });
19
20    // EventListener für die Statuszellen
21    const statusRows = document.querySelectorAll("table.status-table tbody tr");  // Wähle alle Zeilen
22
23    statusRows.forEach(row => {
24        const cells = row.querySelectorAll(".status-cell");
25        cells.forEach(cell => {
26            cell.addEventListener("click", function() {
27                setStatusColor(cell, selectedColor);
28            });
29
30            cell.addEventListener("mousedown", function() {
31                isDragging = true;
32                currentRow = cell.parentElement;  // Speichert die aktuelle Zeile
33                setStatusColor(cell, selectedColor);
34            });
35
36            cell.addEventListener("mouseover", function() {
37                if (isDragging && cell.parentElement === currentRow) {
38                    setStatusColor(cell, selectedColor);
39                }
40            });
41
42            cell.addEventListener("mouseup", function() {
43                isDragging = false;
44                currentRow = null;  // Setzt die Zeile zurück
45            });
46        });
47    });
48
49    // Funktion zum Setzen der Farbe
50    function setStatusColor(cell, color) {
51        cell.style.backgroundColor = color;
52        cell.setAttribute("data-status", color);
53    }
54
55    // Funktion zum Speichern der Daten, nur wenn die Zelle eine Farbe hat
56    function saveData() {
57        let statusData = [];
58        statusRows.forEach((row, rowIndex) => {
59            const cells = row.querySelectorAll(".status-cell");
60            cells.forEach((cell, cellIndex) => {
61                const color = cell.getAttribute("data-status");
62                if (color) {  // Nur speichern, wenn die Zelle eine Farbe hat
63                    statusData.push({
64                        row: rowIndex,
65                        column: cellIndex,
66                        color: color
67                    });
68                }
69            });
70        });
71
72        fetch('lib/plugins/fho/save_status.php', {  // Speichere direkt in save_status.php
73            method: 'POST',
74            headers: {
75                'Content-Type': 'application/json'
76            },
77            body: JSON.stringify(statusData)
78        })
79        .then(response => response.json())
80        .then(data => {
81            if (data.status === 'success') {
82                alert('Daten erfolgreich gespeichert');
83            } else {
84                alert('Fehler beim Speichern der Daten: ' + data.message);
85            }
86        })
87        .catch(error => {
88            console.error('Fehler bei der Anfrage:', error);
89        });
90    }
91
92    // EventListener für den Speichern-Button
93    const saveButton = document.getElementById("save-button");
94    saveButton.addEventListener("click", saveData);
95
96    // Automatisch den Lade-Button klicken, aber unsichtbar machen
97    const loadButton = document.getElementById("load-button");
98    loadButton.style.display = 'none';  // Button unsichtbar machen
99    loadData();  // Automatisch Daten laden
100
101    // Funktion zum Laden der Daten
102    function loadData() {
103        fetch('lib/plugins/fho/save_status.php', {  // Abrufen der Daten via GET
104            method: 'GET',
105        })
106        .then(response => {
107            if (!response.ok) {  // Prüfe, ob die Antwort erfolgreich war
108                throw new Error('Netzwerkantwort war nicht ok');
109            }
110            return response.json();
111        })
112        .then(data => {
113            console.log('Geladene Daten:', data);  // Ausgabe der empfangenen Daten in der Konsole
114            if (data && data.length > 0) {
115                data.forEach(entry => {
116                    const rowIndex = entry.row;
117                    const cellIndex = entry.column;
118                    const color = entry.color;
119
120                    console.log(`Zeile: ${rowIndex}, Spalte: ${cellIndex}, Farbe: ${color}`);  // Debugging-Ausgabe
121                    const row = statusRows[rowIndex];  // Hole die entsprechende Zeile
122                    const cell = row.querySelectorAll(".status-cell")[cellIndex];  // Hole die entsprechende Zelle
123                    if (cell) {
124                        setStatusColor(cell, color);  // Setze die Farbe der Zelle
125                    } else {
126                        console.error('Zelle nicht gefunden:', rowIndex, cellIndex);  // Ausgabe, falls Zelle nicht gefunden wurde
127                    }
128                });
129            }
130        })
131        .catch(error => {
132            console.error('Fehler beim Laden der Daten:', error);
133        });
134    }
135});
136