document.addEventListener('DOMContentLoaded', function() {
    const checkModuleUpdate = document.querySelector('#checkModuleUpdate');
    const ajaxUrl = '/bitrix/services/main/ajax.php?sessid=' + BX.bitrix_sessid() + '&action=boxberry:delivery.api.settings.';
    const availableVersion = document.querySelector('#availableVersion');
    const downloadUrl = document.querySelector('#downloadUrl');
    const archiveFormat = document.querySelector('#archiveFormat');
    const newVersionTd = document.querySelector('#newVersionTd');
    const newVersionRow = document.querySelector('#newVersionRow');
    const updateModuleRow = document.querySelector('#updateModuleRow');
    const updateResultMessageRow = document.querySelector('#updateResultMessageRow');
    const updateResultMessageText = document.querySelector('#updateResultMessageText');
    const updateModule = document.querySelector('#updateModule');
    const tabControl_layout = document.querySelector('#tabControl_layout');
    const enable_dadata_user_token = document.querySelector('#enable_dadata_user_token');
    const dadata_user_token = document.querySelector('#dadata_user_token');
    const statusSyncEnableCheckbox = document.getElementById('status_sync_enable');
    const orderStatuses = document.querySelectorAll('#order_status_sync');
    const shipmentStatuses = document.querySelectorAll('#shipment_status_sync');
    const shipmentStatusSelectElements = document.querySelectorAll('[data-select-type="shipment_status"]');

    shipmentStatusSelectElements.forEach(function(select) {
        let shippedCheckbox = document.querySelector('input[name="' + select.name + '_shipped"]');

        let updateShippedCheckbox = function() {
            if (select.value === '0') {
                shippedCheckbox.checked = false;
                shippedCheckbox.disabled = true;
            } else {
                shippedCheckbox.disabled = false;
            }
        };

        select.addEventListener('change', updateShippedCheckbox);
        updateShippedCheckbox();
    });

    function toggleStatuses() {
        var isDisabled = !statusSyncEnableCheckbox.checked;
        orderStatuses.forEach(function(status) {
            status.classList.toggle('status-sync-disabled', isDisabled);
        });
        shipmentStatuses.forEach(function(status) {
            status.classList.toggle('status-sync-disabled', isDisabled);
        });
    }

    statusSyncEnableCheckbox.addEventListener('change', toggleStatuses);
    toggleStatuses();

    enable_dadata_user_token.addEventListener('change', function() {
        if (this.checked) {
            dadata_user_token.removeAttribute('readonly');
        } else {
            dadata_user_token.setAttribute('readonly', 'readonly');
        }
    });

    if (!enable_dadata_user_token.checked) {
        dadata_user_token.setAttribute('readonly', 'readonly');
    }

    dadata_user_token.addEventListener('input', function() {
        this.value = this.value.trim();
    });

    function startLoading() {
        checkModuleUpdate.disabled = true;
        updateModule.disabled = true;
        tabControl_layout.classList.add('tabControl_layout--loading');
    }

    function stopLoading() {
        checkModuleUpdate.disabled = false;
        updateModule.disabled = false;
        tabControl_layout.classList.remove('tabControl_layout--loading');
    }

    checkModuleUpdate.addEventListener('click', function(e) {
        e.preventDefault();

        startLoading();

        fetch(ajaxUrl + 'checkModuleUpdate', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            }
        })
            .then(r => r.json())
            .then(r => {
                stopLoading()
                if (r.status === 'success' && r.data.need_update) {
                    availableVersion.value = r.data.version;
                    downloadUrl.value = r.data.url;
                    archiveFormat.value = r.data.archive_format;
                    newVersionTd.innerText = availableVersion.value;
                    newVersionRow.style.display = 'table-row';
                    updateModuleRow.style.display = 'table-row';
                    updateResultMessageRow.style.display = 'none';
                } else {
                    newVersionRow.style.display = 'none';
                    updateModuleRow.style.display = 'none';
                    availableVersion.value = '';
                    downloadUrl.value = '';
                    archiveFormat.value = '';
                    updateResultMessageText.innerText = BX.message('MODULE_UPDATE_IS_NOT_NEEDED');
                    updateResultMessageRow.style.display = 'table-row';
                }
            })
            .catch(error => {
                stopLoading()
                console.error('Error:', error);
            });
    });

    updateModule.addEventListener('click', function (e) {
        e.preventDefault();

        startLoading()

        fetch(ajaxUrl + 'update', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            },
            body: new URLSearchParams({
                url: downloadUrl.value,
                version: availableVersion.value,
                archiveFormat: archiveFormat.value
            }).toString()

        })
            .then(r => r.json())
            .then(r => {
                stopLoading()
                if (r.status === 'success') {
                    updateResultMessageText.innerText = r.data.message;
                    newVersionRow.style.display = 'none';
                    updateModuleRow.style.display = 'none';
                } else {
                    updateResultMessageText.innerText = r.errors[0].message;
                }

                updateResultMessageRow.style.display = 'table-row';
            })
            .catch(error => {
                stopLoading()
                console.error('Error:', error);
            });

    });
});