quotes/public/script.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53

const dropdown = document.getElementById("author");

dropdown.insertAdjacentHTML("beforeend", '<option selected="true" disabled>Author auswählen...</option>');

function appendOption(response) {
    response.forEach((elem) => {
        dropdown.insertAdjacentHTML(
            "beforeend",
            `<option value="${elem["id"]}">${elem["name"]} ${elem["middlename"] ? elem["middlename"] : " "}${
                elem["surname"]
            }</option>`,
        );
    });
}

function appendQuote(response) {
    response.forEach((elem) => {
        document
            .getElementById(elem["class"])
            .insertAdjacentHTML(
                "beforeend",
                `<li>${elem["name"]} ${elem["middlename"] ? elem["middlename"] : " "}${elem["surname"]}: ${
                    elem["quote"]
                }${elem["owner"] ? '<span data-id="' + elem["id"] + '">[Löschen]</span></li>' : ""}`,
            );

        const span = document.querySelector(`li span[data-id="${elem["id"]}"]`);
        if (span) span.addEventListener("click", (event) => {
            fetch("api/delete/" + event.target.getAttribute("data-id"), { method: "DELETE" })
                .then((response) => response.text())
                .then((response) => {
                    if (response == "ok") event.target.parentNode.remove();
                });
        });
    });
}

fetch("/auth/api/list?class=all")
    .then((response) => response.json())
    .then((response) => appendOption(response));

fetch("api/list")
    .then((response) => response.json())
    .then((response) => appendQuote(response));

const classes = ["TGI13.1", "TGI13.2", "TGM13.1", "TGM13.2", "TGTM13.1"];
classes.forEach((clazz) => {
    document.getElementById("open_" + clazz).addEventListener("click", () => {
        const ul = document.getElementById(clazz);
        if (ul.style.display === "none") ul.style.display = "block";
        else ul.style.display = "none";
    });
});