// A number for each slide
var slideFuncs = {
    1: function () {
        // Prepare slide 3
        var xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
                document.getElementById("inspirationalQuote").src = this.responseText;
            }
        };
        xhttp.open("GET", "https://inspirobot.me/api?generate=true", true);
        xhttp.send();

        // Then prepare slide 4
        var xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
                document.getElementById("userImage1").src = this.responseText;
            }
        };
        xhttp.open("GET", "/fetch.php", true);
        xhttp.send();
    },
    5: function () {
        // Play video
        var video = document.getElementById("slide5Vid");
        video.pause();
        video.currentTime = 0;
        video.load();
        video.play();
    },
};

var slideIndex = 1;
showSlides(slideIndex);

function plusSlides(n) {
    showSlides(slideIndex += n);
}

setInterval(() => {
    plusSlides(1)
}, 22000);

function showSlides(n) {
    var i;
    var slides = document.getElementsByClassName("mySlides");
    if (n > slides.length) {slideIndex = 1}    
    if (n < 1) {slideIndex = slides.length}
    for (i = 0; i < slides.length; i++) {
        slides[i].style.display = "none";  
    }
    slides[slideIndex-1].style.display = "block";  

    console.log("Slide " + slideIndex);

    try {
        slideFuncs[slideIndex]();
    }
    catch(err) {
        console.log("Nothing to do for this slide: " + err)
    }
}