function replaceElements(max) {
    fetch('https://cdn.vrijwilligerswerk.be/widget/byUuid/cc142318-c71e-4ca8-8827-a25c3147ad71/text')
        .then(response => response.json())
        .then(data => {
            for (let i = 1; i <= max; i++) {
                let element = document.getElementById(`vrijwilligers-text-${i}`);
                if (element) {
                    fetch('https://cdn.vrijwilligerswerk.be/widget/cc142318-c71e-4ca8-8827-a25c3147ad71/text/' + i)
                        .then(response => response.json())
                        .then(text => {
                            renderText(text, element, data);
                        })
                }
            }
            console.log(data);
        })
        .catch(error => {
            console.error(error);
        });
}

function renderText(text, container, config) {

    const source = normalizeSource(text.source);
    const details = [];
    if (source) {
        details.push(`Bron: <a href="${source.url}">${source.label}</a>`);
    }
    if (text.updated_at && config.display.showLastModified) {
        details.push(`Laatst gewijzigd op ${text.updated_at}`);
    }

    container.innerHTML = `
            <article>
                ${config.display.showTitle ? `<h1>${text.name}</h1>` : ''}
                ${text.text}
                ${details.length ? `<p>${details.join(' - ')}</p>` : ''}
                <article>`;

    forEach(container.querySelectorAll('a'), (element) => {
        element.setAttribute('target', '_blank');
        element.setAttribute('rel', 'noopener noreferrer');
    });
}

// De bron wordt niet altijd met protocol bewaard. Zonder https:// volgt de browser
// de link als relatief pad op de site van de klant, dus vullen we het hier aan.
function normalizeSource(source) {
    if (!source) {
        return null;
    }
    const value = String(source).trim();
    if (!value) {
        return null;
    }
    const url = /^https?:\/\//i.test(value) ? value : `https://${value}`;
    return { url: url, label: url.replace(/^https?:\/\//i, '') };
}

function forEach(array, callback) {
    for (var i = 0, len = array.length; i < len; ++i) {
        callback(array[i]);
    }
}
window.onload = function () {
    replaceElements(54);
};