let uczniowie = {};
let kryteria = [];
let dane = {};

document.addEventListener("DOMContentLoaded", () => {
    const classSelect = document.getElementById("class-select");
    const studentsList = document.getElementById("students-list");
    const saveButton = document.getElementById("save-button");

    // Ładowanie danych z serwera
    Promise.all([
        fetch("http://localhost:4000/uczniowie").then(response => response.json()),
        fetch("http://localhost:4000/kryteria").then(response => response.json()),
        fetch("http://localhost:4000/dane").then(response => response.json())
    ])
        .then(([uczniowieData, kryteriaData, daneData]) => {
            uczniowie = uczniowieData.klasy;
            kryteria = kryteriaData;
            dane = daneData;

            populateClassSelect();
        })
        .catch(error => console.error("Błąd ładowania danych:", error));

    // Wypełnij listę klas
    function populateClassSelect() {
        Object.keys(uczniowie).forEach(klasa => {
            const option = document.createElement("option");
            option.value = klasa;
            option.textContent = klasa;
            classSelect.appendChild(option);
        });

        // Wyświetl pierwszą klasę domyślnie
        if (classSelect.options.length > 0) {
            classSelect.value = classSelect.options[0].value;
            renderStudents(classSelect.value);
        }
    }

    // Aktualizuj listę uczniów po wyborze klasy
    classSelect.addEventListener("change", () => {
        const selectedClass = classSelect.value;
        renderStudents(selectedClass);
    });

    // Renderuj uczniów
    function renderStudents(className) {
        studentsList.innerHTML = "";
        const students = uczniowie[className];

        students.forEach(student => {
            const studentKey = `${className}-${student.imie}-${student.nazwisko}`;
            const details = document.createElement("details");
            const summary = document.createElement("summary");

            summary.textContent = `${student.imie} ${student.nazwisko}`;
            details.appendChild(summary);

            const criteriaList = document.createElement("div");
            criteriaList.className = "criteria-list";

            kryteria.forEach(criteria => {
                const criteriaItem = document.createElement("div");
                criteriaItem.className = "criteria-item";

                const label = document.createElement("span");
                label.textContent = criteria;

                const input = document.createElement("input");
                input.type = "number";
                input.min = "0";

                // Wyszukaj dane ucznia w pliku `dane.json`
                const savedStudent = dane[className]?.find(s => s.uczen.imie === student.imie && s.uczen.nazwisko === student.nazwisko);
                input.value = savedStudent?.uczen[criteria] || 0;

                input.addEventListener("input", () => {
                    if (!savedStudent) {
                        dane[className] = dane[className] || [];
                        dane[className].push({
                            uczen: {
                                imie: student.imie,
                                nazwisko: student.nazwisko
                            }
                        });
                    }

                    const currentStudent = dane[className].find(s => s.uczen.imie === student.imie && s.uczen.nazwisko === student.nazwisko);
                    currentStudent.uczen[criteria] = parseInt(input.value) || 0;
                });

                criteriaItem.appendChild(label);
                criteriaItem.appendChild(input);
                criteriaList.appendChild(criteriaItem);
            });

            details.appendChild(criteriaList);
            studentsList.appendChild(details);
        });
    }

    // Zapisz dane na zewnętrznym serwerze
    saveButton.addEventListener("click", () => {
        fetch("http://localhost:4000/dane", {
            method: "POST",
            headers: {
                "Content-Type": "application/json"
            },
            body: JSON.stringify(dane)
        })
            .then(response => {
                if (response.ok) {
                    alert("Dane zostały zapisane!");
                } else {
                    alert("Wystąpił błąd podczas zapisywania danych.");
                }
            })
            .catch(error => console.error("Błąd zapisywania danych:", error));
    });
});