{{-- CUSTOMER CATALOG REDESIGNED --}}
@include('catalogs.customer-redesign')

<script>
(function () {
    const fallbackCartKey = "van_catalog_cart_{{ $catalog->id }}";

    const orderUuidStorageKey =
        (
            typeof cartKey !== 'undefined'
                ? cartKey
                : fallbackCartKey
        ) + "_client_uuid";

    function generateOrderClientUuid() {
        if (
            typeof crypto !== 'undefined'
            && typeof crypto.randomUUID === 'function'
        ) {
            return crypto.randomUUID();
        }

        return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'
            .replace(/[xy]/g, function (character) {
                const random = Math.random() * 16 | 0;
                const value = character === 'x'
                    ? random
                    : (random & 0x3 | 0x8);

                return value.toString(16);
            });
    }

    function ensureOrderClientUuid() {
        let uuid = localStorage.getItem(
            orderUuidStorageKey
        );

        if (!uuid) {
            uuid = generateOrderClientUuid();

            localStorage.setItem(
                orderUuidStorageKey,
                uuid
            );
        }

        return uuid;
    }

    window.snytRefreshOrderClientUuid = function () {
        const uuid = generateOrderClientUuid();

        localStorage.setItem(
            orderUuidStorageKey,
            uuid
        );

        return uuid;
    };
    const btn = document.getElementById('printOrder');
    if (!btn) return;

    const newBtn = btn.cloneNode(true);
    btn.parentNode.replaceChild(newBtn, btn);

    // snyt-order-customer-change-listeners
    [
        'customerName',
        'customerPhone',
        'customerCompany',
        'companyName',
        'orderNotes',
        'notes'
    ].forEach(function (fieldId) {
        const field = document.getElementById(fieldId);

        if (!field) {
            return;
        }

        field.addEventListener(
            'input',
            function () {
                window.snytRefreshOrderClientUuid();
            }
        );
    });

    newBtn.addEventListener('click', function () {
        if (typeof cart === 'undefined' || !cart.length) {
            alert('Cart is empty.');
            return;
        }

        const payload = {
            client_uuid: ensureOrderClientUuid(),
            customer_name: document.getElementById('customerName')?.value || '',
            customer_phone: document.getElementById('customerPhone')?.value || '',
            company_name: document.getElementById('customerCompany')?.value || document.getElementById('companyName')?.value || '',
            notes: document.getElementById('orderNotes')?.value || document.getElementById('notes')?.value || '',
            items: cart.map(item => ({
                id: item.id || item.catalog_item_id || null,
                sku: item.sku || null,
                barcode: item.barcode || null,
                qty: item.qty || 1
            }))
        };

        const form = document.createElement('form');
        form.method = 'POST';
        form.action = @json(route('catalogs.order-pdf', ['catalog' => $catalog->id]));
        form.target = '_blank';

        form.innerHTML = `
            <input type="hidden" name="_token" value="{{ csrf_token() }}">
            <input type="hidden" name="payload" value='${JSON.stringify(payload).replace(/'/g, '&#039;')}'>
        `;

        document.body.appendChild(form);
        form.submit();
        form.remove();
    });
})();
</script>