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

autosave: factorize some javascript code

Browse source
This commit is contained in:
Pierre de La Morinerie 2020-08-20 11:05:14 +00:00
parent a3dd81a89f
commit e157a289e1
1 changed files with 18 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -16,26 +16,33 @@ const AUTOSAVE_STATUS_VISIBLE_DURATION = gon.autosave.status_visible_duration;
// Create a controller responsible for queuing autosave operations. // Create a controller responsible for queuing autosave operations.
const autoSaveController = new AutoSaveController(); const autoSaveController = new AutoSaveController();
function enqueueAutosaveRequest() {
const form = document.querySelector(FORM_SELECTOR);
autoSaveController.enqueueAutosaveRequest(form);
}
//
// Whenever a 'change' event is triggered on one of the form inputs, try to autosave. // Whenever a 'change' event is triggered on one of the form inputs, try to autosave.
//
const formSelector = 'form#dossier-edit-form.autosave-enabled'; const FORM_SELECTOR = 'form#dossier-edit-form.autosave-enabled';
const formInputsSelector = `${formSelector} input:not([type=file]), ${formSelector} select, ${formSelector} textarea`; const INPUTS_SELECTOR = `${FORM_SELECTOR} input:not([type=file]), ${FORM_SELECTOR} select, ${FORM_SELECTOR} textarea`;
const RETRY_BUTTON_SELECTOR = '.autosave-retry';
// When an input changes, batches changes for N seconds, then auto-save the form
delegate( delegate(
'change', 'change',
formInputsSelector, INPUTS_SELECTOR,
debounce(() => { debounce(enqueueAutosaveRequest, AUTOSAVE_DEBOUNCE_DELAY)
const form = document.querySelector(formSelector);
autoSaveController.enqueueAutosaveRequest(form);
}, AUTOSAVE_DEBOUNCE_DELAY)
); );
delegate('click', '.autosave-retry', () => {
const form = document.querySelector(formSelector);
autoSaveController.enqueueAutosaveRequest(form);
});
// 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
//
addEventListener('autosave:enqueue', () => { addEventListener('autosave:enqueue', () => {
disable(document.querySelector('button.autosave-retry')); disable(document.querySelector('button.autosave-retry'));