jQuery(document).ready(function ($) {
    if (!scoreboardData.canEdit) return;

    fetch(scoreboardData.templatesUrl + 'scoreboard-controls.html')
        .then(r => r.text())
        .then(html => {
            const panel = $(html).appendTo('.entry-content');

            panel.on('click', '.score-btn', function () {
                const type = $(this).data('type');
                const minute = parseInt($('#score-minute').val(), 10);
                const team = $('#score-team').val();
                const newEvent = { type, minute, team };

                let timelineData = [];
                try {
                    timelineData = JSON.parse(scoreboardData.timeline);
                    if (!Array.isArray(timelineData)) timelineData = [];
                } catch (e) { }

                timelineData.push(newEvent);

                $.post(scoreboardData.ajaxUrl, {
                    action: 'update_scoreboard',
                    event_id: scoreboardData.eventId,
                    timeline: JSON.stringify(timelineData)
                }, function (res) {
                    if (res.success) {
                        alert('Event added!');
                        location.reload(); // optionally trigger re-render instead
                    }
                });
            });
        });
});