new: [ui:index_table] Fire pending debounced functions on dropdown hidden

pull/121/head
Sami Mokaddem 2022-10-28 09:12:30 +02:00
parent 351b90d843
commit 67eb9de05a
No known key found for this signature in database
GPG Key ID: 164C473F627A06FA
3 changed files with 40 additions and 19 deletions

View File

@ -41,6 +41,7 @@ $compactDisplayInputSeed = 'seed-' . mt_rand();
const $container = $dropdownMenu.closest('div[id^="table-container-"]')
const $table = $container.find(`table[data-table-random-value="${tableRandomValue}"]`)
toggleCompactState($checkbox[0].checked, $table)
registerDebouncedFunction($container, debouncedCompactSaver)
})
})()
</script>

View File

@ -40,7 +40,8 @@ echo $availableColumnsHtml;
const debouncedHiddenColumnSaverWithReload = debounce(mergeAndSaveSettingsWithReload, 2000)
function attachListeners() {
let debouncedFunctionWithReload = false, debouncedFunction = false // used to flush debounce function if dropdown menu gets closed
let debouncedFunctionWithReload = false,
debouncedFunction = false // used to flush debounce function if dropdown menu gets closed
$('form.visible-column-form, form.visible-meta-column-form').find('input').change(function() {
const $dropdownMenu = $(this).closest(`[data-table-random-value]`)
const tableRandomValue = $dropdownMenu.attr('data-table-random-value')
@ -108,24 +109,6 @@ echo $availableColumnsHtml;
return tableSetting
}
function mergeAndSaveSettingsWithReload(table_setting_id, tableSettings, $table) {
mergeAndSaveSettings(table_setting_id, tableSettings, false).then((apiResult) => {
const theToast = UI.toast({
variant: 'success',
title: apiResult.message,
bodyHtml: $('<div/>').append(
$('<span/>').text('<?= __('The table needs to be reloaded for the new fields to be included.') ?>'),
$('<button/>').addClass(['btn', 'btn-primary', 'btn-sm', 'ms-3']).text('<?= __('Reload table') ?>').click(function() {
const reloadUrl = $table.data('reload-url');
UI.reload(reloadUrl, $table.closest('div[id^="table-container-"]'), $(this)).then(() => {
theToast.removeToast()
})
}),
),
})
})
}
$(document).ready(function() {
addSupportOfNestedDropdown();
const $form = $('form.visible-column-form, form.visible-meta-column-form')
@ -138,6 +121,8 @@ echo $availableColumnsHtml;
toggleColumn(this.getAttribute('data-columnname'), this.checked, $table)
})
attachListeners()
registerDebouncedFunction($container, debouncedHiddenColumnSaver)
registerDebouncedFunction($container, debouncedHiddenColumnSaverWithReload)
})
})()
</script>

View File

@ -10,6 +10,41 @@ function mergeAndSaveSettings(table_setting_id, newTableSettings, automaticFeedb
})
}
function mergeAndSaveSettingsWithReload(table_setting_id, tableSettings, $table) {
mergeAndSaveSettings(table_setting_id, tableSettings, false).then((apiResult) => {
const theToast = UI.toast({
variant: 'success',
title: apiResult.message,
bodyHtml: $('<div/>').append(
$('<span/>').text('The table needs to be reloaded for the new fields to be included.'),
$('<button/>').addClass(['btn', 'btn-primary', 'btn-sm', 'ms-3']).text('Reload table').click(function () {
const reloadUrl = $table.data('reload-url');
UI.reload(reloadUrl, $table.closest('div[id^="table-container-"]'), $(this)).then(() => {
theToast.removeToast()
})
}),
),
})
})
}
function registerDebouncedFunction($container, fn) {
$dropdownButton = $container.find('button.table_setting_dropdown_button')
if ($dropdownButton.data('debouncedFunctions') === undefined) {
$dropdownButton.data('debouncedFunctions', [])
}
$dropdownButton.data('debouncedFunctions').push(fn)
}
function firePendingDebouncedFunctions(dropdownBtn) {
$dropdownButton = $(dropdownBtn)
if ($dropdownButton.data('debouncedFunctions') !== undefined) {
$dropdownButton.data('debouncedFunctions').forEach(function (fn) {
fn.flush()
})
}
}
function mergeNewTableSettingsIntoOld(table_setting_id, oldTableSettings, newTableSettings) {
// Merge recursively
tableSettings = Object.assign({}, oldTableSettings, newTableSettings)