<!DOCTYPE html>
<html>

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

<body>
    <img id="images" src="/static/images/pvv_logo.png" alt="images">
    <script>
        fetch("/files")
            .then(res => res.json())
            .then(files => {
                const images = files.ImageNames
                console.log(images)
                let index = 0;
                setInterval(() => {
                    index = (index + 1) % images.length;
                    document.getElementById("images").src = images[index];
                }, 1000);
                setTimeout(() => {
                    window.location.reload();
                }, images.length*2*1000);
            });
    </script>
</body>

</html>
