let idx = 0

let frames = [
    "hello! you're just in time!",                              "img/yay.png",                          null,
    "this was starting to get ridiculous.",                     "img/you-shouldnt-be-doing-that.png",   null,
    "there are books EVERYWWHERE",                              "img/scared.png",                       null,
    "and more keep coming!",                                    "img/oshit.png",                        null, 
    "we've got to do something about it before the deadline!",  "img/determined.png",                   null, 

    "hey, could you sort the books for me?",                    "img/books-messy.png", "stack books by size",

    "yes, i can you've finished STACKING them,",                                            "img/books-size.png",   null,
    "but that's hardly FINISHED, is it?",                                                   "img/books-size.png",   null,
    "i mean sure, if you want to be a pedant about it they're sort of ordered by size,",    "img/nonplussed.png",   null,
    "but they're still just piled up in the same place, what's that supposed to change?",   "img/coffee.png",       null,

    "why don't you try again?", "img/books-size.png",   "push stack over",
    "",                         "img/books-messy.png",  "order books by colour",
    "",                         "img/books-colour.png", null,

    "no, colours won't work either.",                               "img/dreamer0.png",         null,
    "why?",                                                         "img/blast.png",            null,
    "simple, i don't do colours.",                                  "img/grin.png",             null,
    "it's nothing personal, they're just not for me, you know?",    "img/glad-you-asked.png",   "restart"
];


function setText(text) {
    document.getElementById('text-box').innerHTML = text;
}

function setImage(path) {
    document.getElementById('portrait').src = path;
}

function setButtonText(text) {
    console.log(text);
    if (text == null)
    {
        text = "next";
    }

    document.getElementById('button').innerHTML = text;
}

function advance() {
    const stride = 3;

    if (idx >= frames.length) {
        idx = 0;
    }

    let text = frames[idx];
    let img = frames[idx + 1];
    let buttonText = frames[idx + 2];

    setText(text);
    setButtonText(buttonText);
    setImage(img);

    idx += stride;
}