{#
    Start Buy Modal

    Allows selecting a buyer/employee to start processing a buy.
    This moves the queue item from 'sorted' or 'queued' to 'processing' state.

    Variables:
    - buyers: Array of buyer objects
    - item: Queue item with firstName, lastName, buyID
    - typeNum: Store type number
#}
{% extends 'queue/modals/_base.html' %}

{% block modal_title %}
<i class="fa fa-level-up text-success"></i>
Start Buy - {{ item.firstName }} {{ item.lastName }}
{% endblock %}

{% block modal_body %}
{% include 'queue/modals/_buyer-grid.html' with {'action': 'startBuy'} %}
{% endblock %}

{% block modal_footer %}
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
    <i class="fa fa-times"></i> Cancel
</button>
{% endblock %}

{% block modal_scripts %}
<script type="text/javascript">
(function() {
    'use strict';

    var typeNum = '{{ typeNum }}';

    // Bind click handlers to buyer buttons
    function bindBuyerButtons() {
        document.querySelectorAll('.buyer-button').forEach(function(btn) {
            // Skip if already bound
            if (btn.dataset.bound) return;
            btn.dataset.bound = 'true';

            btn.addEventListener('click', function() {
                var $btn = $(this);
                var employeeId = $btn.data('employee-id') || $btn.attr('data-employee-id');
                var buyId = $btn.data('buy-id') || $btn.attr('data-buy-id');

                if (!employeeId) {
                    console.error('[QueueModal] Missing employee ID on button');
                    showToast('Error: No employee ID. Please refresh and try again.', 'error');
                    return;
                }

                // Show loading state
                $btn.addClass('loading').html('<i class="fa fa-spinner fa-spin"></i> Starting...');

                // Submit action via socket API
                $.ajax({
                    url: '/api/socket.php',
                    type: 'POST',
                    data: {
                        buyerID: employeeId,
                        buyID: buyId,
                        action: 'startBuy',
                        store: typeNum
                    },
                    success: function(response) {
                        console.log('[QueueModal] startBuy success:', response);
                        closeModal();
                    },
                    error: function(xhr, status, error) {
                        console.error('[QueueModal] startBuy error:', error);
                        $btn.removeClass('loading').text('Try Again');
                        showToast('Failed to start buy. Please try again.', 'error');
                    }
                });
            });
        });
    }

    // Initial binding
    bindBuyerButtons();

    // Re-bind when buyer grid is updated (toggle switch)
    document.addEventListener('buyerGridUpdated', function() {
        bindBuyerButtons();
    });

    function closeModal() {
        var modalEl = document.getElementById('myModal');
        var modal = bootstrap.Modal.getInstance(modalEl);
        if (modal) {
            modal.hide();
        }
    }

    function showToast(message, type) {
        if (typeof toastr !== 'undefined') {
            toastr[type || 'info'](message);
        }
    }
})();
</script>
{% endblock %}