<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <link rel="icon" type="image/x-icon" href="/static/images/pvv_logo.png">
    <title>ASCII</title>
    <link rel="stylesheet" href="/static/css/global.css">
</head>

<body>
    <pre id="ascii">
        a@@@@a
        a@@@@@@@@@@@@a
        a@@@@@@by@@@@@@@@a
        a@@@@@S@C@E@S@W@@@@@@a
        @@@@@@@@@@@@@@@@@@@@@@
        `@@@@@@`\\//'@@@@@@'
        ,, || ,, S.C.E.S.W.
        /(-\ || /.)m
        ,---' /`-'||`-'\ `----,
        /( )__)) || ((,==( )\
        _ /_//___\\ __|| ___\\ __\\ ____
        `` `` /MM\ '' ''
    </pre>
    <script>
        fetch("/files")
            .then(res => res.json())
            .then(files => {
                const AsciiObj = files.AsciiFiles

                let index = 0;
                const preElement = document.getElementById("ascii");

                const nextAscii = () => {
                    const filePath = AsciiObj[index].Name;
                    fetch(filePath)
                        .then(res => {return res.text();})
                        .then(fileContent => {preElement.textContent = fileContent;})
                        .catch(err => {
                            console.error("PANIC FETCH .txt FAILED PANIC!!")
                            preElement.textContent = fileContent;
                        })
                    index = (index + 1) % AsciiObj.length;
                }

                nextAscii();
                setInterval(nextAscii, 1000);
            }).catch(err => {
                console.error("PANIC FETCH of file list FAILED!", err);
                preElement.textContent = "Error loading file list.";
            });

    </script>

</body>

</html>
