(function () {
    'use strict';

    function byId(id) {
        return document.getElementById(id);
    }

    function renderPrompt(data, select, output) {
        const selectedId = select.value;
        const prompt = (data.prompts || []).find(function (item) {
            return String(item.id) === String(selectedId);
        });

        if (!prompt) {
            output.value = '';
            return;
        }

        output.value = String(prompt.content || '').split('{{bootstrap-racket-link}}').join(data.link || '');
    }

    document.addEventListener('DOMContentLoaded', function () {
        const dataEl = byId('bootstrapPromptData');
        const select = byId('bootstrapPromptSelect');
        const output = byId('bootstrapPromptOutput');

        if (!dataEl || !select || !output) {
            return;
        }

        let data = { link: '', prompts: [] };

        try {
            data = JSON.parse(dataEl.textContent || '{}');
        } catch (e) {
            data = { link: '', prompts: [] };
        }

        select.addEventListener('change', function () {
            renderPrompt(data, select, output);
        });

        renderPrompt(data, select, output);
    });
}());