Beiträge von Sempervivum

        html,
        body {
            background: url(../img/Landschaft/1.jpg);
            background-repeat: no-repeat;
            background-position: center;
            background-attachment: fixed;
            background-size: cover;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
        }

    <script>
        const items = document.querySelectorAll("img[data-src]");
        let playing = [false, false], oldPos = 0;
        window.addEventListener('scroll', event => {
            const pos = window.scrollY;
            for (let i = 0; i < items.length; i++) {
                const boundingRect = items[i].getBoundingClientRect();
                playIt = false;
                if (!playing[i]) {
                    let playIt = false;
                    // Scrollrichtung ermitteln
                    if (pos > oldPos) {
                        // Scrollrichtung down
                        // Prüfen, ob das Element in der Mitte angekommen ist
                        if (boundingRect.top < document.documentElement.clientHeight / 2
                            && boundingRect.top > 0) {
                            console.log('down on', boundingRect.top)
                            playIt = true;
                            playing[i] = true;
                            items[i].src = items[i].dataset.src + Date.now();
                        }
                    } else {
                        // Scrollrichtung up
                        // Pruefen, ob das Element in der Mitte angekommen ist
                        if (boundingRect.top > document.documentElement.clientHeight / 2
                            && boundingRect.bottom < document.documentElement.clientHeight) {
                            console.log('up on', boundingRect.top)
                            playIt = true;
                            playing[i] = true;
                            items[i].src = items[i].dataset.src + Date.now();
                        }
                    }
                } else {
                    if (pos > oldPos) {
                        // Scrollrichtung down
                        // Pruefen, ob das Element den Viewport nach oben verlassen hat
                        if (boundingRect.top < 0) {
                            console.log('down off', boundingRect.top)
                            playing[i] = false;
                        }
                    } else {
                        // Pruefen, ob das Element den Viewport nach unten verlassen hat
                        if (boundingRect.bottom > document.documentElement.clientHeight) {
                            console.log('up off', boundingRect.top)
                            playing[i] = false;
                        }
                    }
                }
            }
            oldPos = pos;
        });
    </script>

    <img id="testimg">
    Choose a file: <input type="file" id="testfile">
    <script>
        document.getElementById("testfile").addEventListener("change", function () {
            var file = this.files[0];
            var reader = new FileReader();
            reader.onloadend = function (event) {
                // console.log(event.target.result);
                document.getElementById('testimg').src = event.target.result;
            }
            reader.readAsDataURL(file);
        });
    </script>

    <input type="file" id="file-input">
    <button id="upload-btn">Upload</button>
    <span id="out"></span>
    <script>
        const fileInput = document.querySelector('#file-input')
        uploadBtn = document.querySelector('#upload-btn');
        uploadBtn.addEventListener('click', () => {
            const formData = new FormData();
            formData.append('file', fileInput.files[0]);
            fetch('upload.php', {
                method: 'POST',
                body: formData,
            });
        });
    </script>

    <h2>SSID Passwort</h2>
    <form>
        <p><label>SSID:<br>
                <input name="ssid" placeholder="Name vom Netzwerk" required></label></p>
        <p><label>Passwort:<br>
                <input name="passwort" pattern="[!-~]{8,64}" placeholder="PW vom Netzwerk" required>
            </label></p>
        <button type="button" id="send">Absenden</button>
    </form>
    <button type="button" id="delete">Löschen</button>
    <script>
        document.querySelector('#send').addEventListener('click', () => {
            var elem = document.querySelector('form');
            if (elem.checkValidity() && document.querySelector('[pattern]').checkValidity()) {
                fetch('/', {
                    method: 'post',
                    body: new FormData(elem)
                }).then(response => { return response.text() })
                    .then(text => { document.body.innerHTML = text });
            }
        });
        document.querySelector('#delete').addEventListener('click', () => {
            let fd = new FormData();
            fd.append('delete', 'true');
            fetch('/', {
                method: 'post',
                body: fd
            }).then(response => { return response.text() })
                .then(text => { document.body.innerHTML = text });
        });
    </script>

void handleConfig() {
if (server.hasArg("delete") {
    File file = SPIFFS.open("/login.txt", "w");
    file.printf("%s\n%s", "", ""); //Werte löschen
    file.close();
    server.send(200, "text/html", HTML2);
    delay(500);
    Connect();
}  
if (server.hasArg("ssid") && server.hasArg("passwort")) {
// usw.