document.addEventListener('DOMContentLoaded', function() {
    if (window.location.pathname !== '/challenges') return;

    fetch('/category_submit/config')
    .then(r => r.json())
    .then(config => {
        if (!config.categories) return;

        function inject() {
            document.querySelectorAll('.category-header').forEach(header => {
                const catName = header.textContent.trim();
                if (config.categories.includes(catName) && !header.querySelector('.custom-box')) {
                    const div = document.createElement('div');
                    div.className = "custom-box input-group mt-2 mb-4 p-2 bg-light border rounded";
                    div.innerHTML = `
                        <input type="text" class="form-control" placeholder="Found a flag for ${catName}?" id="in-${catName}">
                        <div class="input-group-append"><button class="btn btn-success btn-sub" data-cat="${catName}">Submit</button></div>
                    `;
                    header.after(div);

                    div.querySelector('button').onclick = function() {
                        const btn = this;
                        const val = document.getElementById(`in-${catName}`).value;
                        btn.disabled = true;
                        
                        const body = new URLSearchParams({ submission: val, category: catName, nonce: init.csrfNonce });
                        fetch('/category_submit', { method: 'POST', headers: {'Content-Type': 'application/x-www-form-urlencoded'}, body: body })
                        .then(r => r.json())
                        .then(data => {
                            alert(data.message);
                            if(data.success) location.reload();
                            btn.disabled = false;
                        });
                    };
                }
            });
        }
        // Watch for CTFd's dynamic challenge loading
        new MutationObserver(inject).observe(document.body, { childList: true, subtree: true });
    });
});