DGNum/demarches-normaliennes
13
1
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity

autosave: trigger an autosave after removing a row

Browse source
This commit is contained in:
Pierre de La Morinerie 2020-08-25 10:10:42 +00:00
parent 96037069ff
commit ecc4f01c20
2 changed files with 20 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
app/javascript/new_design/champs/repetition.js
View file

@ -1,4 +1,4 @@
import { delegate } from '@utils'; import { delegate, fire } from '@utils';
const CHAMP_SELECTOR = '.editable-champ'; const CHAMP_SELECTOR = '.editable-champ';
const BUTTON_SELECTOR = '.button.remove-row'; const BUTTON_SELECTOR = '.button.remove-row';
@ -22,4 +22,12 @@ delegate('click', BUTTON_SELECTOR, (evt) => {
evt.target.remove(); evt.target.remove();
row.classList.remove('row'); row.classList.remove('row');
// We could debounce the autosave request, so that row removal would be batched
// with the next changes.
// However *adding* a new repetition row isn't debounced (changes are immediately
// effective server-side).
// So, to avoid ordering issues, enqueue an autosave request as soon as the row
// is removed.
fire(row, 'autosave:trigger');
}); });

15
app/javascript/new_design/dossiers/auto-save.js
View file

@ -29,6 +29,17 @@ const FORM_SELECTOR = 'form#dossier-edit-form.autosave-enabled';
const INPUTS_SELECTOR = `${FORM_SELECTOR} input:not([type=file]), ${FORM_SELECTOR} select, ${FORM_SELECTOR} textarea`; const INPUTS_SELECTOR = `${FORM_SELECTOR} input:not([type=file]), ${FORM_SELECTOR} select, ${FORM_SELECTOR} textarea`;
const RETRY_BUTTON_SELECTOR = '.autosave-retry'; const RETRY_BUTTON_SELECTOR = '.autosave-retry';
// When an autosave is requested programatically, auto-save the form immediately
addEventListener('autosave:trigger', (event) => {
const form = event.target.closest('form');
if (form && form.classList.contains('autosave-enabled')) {
enqueueAutosaveRequest();
}
});
// When the "Retry" button is clicked, auto-save the form immediately
delegate('click', RETRY_BUTTON_SELECTOR, enqueueAutosaveRequest);
// When an input changes, batches changes for N seconds, then auto-save the form // When an input changes, batches changes for N seconds, then auto-save the form
delegate( delegate(
'change', 'change',
@ -36,10 +47,6 @@ delegate(
debounce(enqueueAutosaveRequest, AUTOSAVE_DEBOUNCE_DELAY) debounce(enqueueAutosaveRequest, AUTOSAVE_DEBOUNCE_DELAY)
); );
// When the "Retry" button is clicked, auto-save the form immediately
delegate('click', RETRY_BUTTON_SELECTOR, enqueueAutosaveRequest);
// //
// Display some UI during the autosave // Display some UI during the autosave
// //