fraport/fradrive-old
Archived
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

move async form initialization to form util

Browse Source
This commit is contained in:
Felix Hamann 2019-02-25 20:24:44 +01:00
parent 2f3a735ae2
commit e9f7cdf682
4 changed files with 16 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
static/css/utils/asyncForm.scss
View File

@ -4,6 +4,6 @@
.async-form-loading { .async-form-loading {
opacity: 0.1; opacity: 0.1;
transition: opacity 400ms ease-in-out; transition: opacity 800ms ease-in-out;
pointer-events: none; pointer-events: none;
} }

11
static/js/utils/form.js
View File

@ -3,9 +3,10 @@
window.utils = window.utils || {}; window.utils = window.utils || {};
var JS_INITIALIZED = 'js-initialized'; var JS_INITIALIZED = 'js-form-initialized';
var SUBMIT_BUTTON_SELECTOR = '[type="submit"]:not([formnovalidate])'; var SUBMIT_BUTTON_SELECTOR = '[type="submit"]:not([formnovalidate])';
var AUTOSUBMIT_BUTTON_SELECTOR = '[type="submit"][data-autosubmit]'; var AUTOSUBMIT_BUTTON_SELECTOR = '[type="submit"][data-autosubmit]';
var AJAX_SUBMIT_FLAG = 'ajaxSubmit';
function formValidator(inputs) { function formValidator(inputs) {
var done = true; var done = true;
@ -23,7 +24,6 @@
if (form.classList.contains(JS_INITIALIZED)) { if (form.classList.contains(JS_INITIALIZED)) {
return false; return false;
} }
form.classList.add(JS_INITIALIZED);
// reactive buttons // reactive buttons
var submitBtn = form.querySelector(SUBMIT_BUTTON_SELECTOR); var submitBtn = form.querySelector(SUBMIT_BUTTON_SELECTOR);
@ -37,6 +37,13 @@
// hide autoSubmit submit button // hide autoSubmit submit button
window.utils.setup('autoSubmit', form, options); window.utils.setup('autoSubmit', form, options);
// async form
if (AJAX_SUBMIT_FLAG in form.dataset) {
window.utils.setup('asyncForm', form, options);
}
form.classList.add(JS_INITIALIZED);
}; };
// registers input-listener for each element in <inputs> (array) and // registers input-listener for each element in <inputs> (array) and

7
static/js/utils/modal.js
View File

@ -16,7 +16,6 @@
var OVERLAY_CLASS = 'modal__overlay'; var OVERLAY_CLASS = 'modal__overlay';
var OVERLAY_OPEN_CLASS = 'modal__overlay--open'; var OVERLAY_OPEN_CLASS = 'modal__overlay--open';
var CLOSER_CLASS = 'modal__closer'; var CLOSER_CLASS = 'modal__closer';
var AJAX_SUBMIT_FLAG = 'ajaxSubmit';
window.utils.modal = function(modalElement, options) { window.utils.modal = function(modalElement, options) {
@ -63,11 +62,7 @@
function setupForm() { function setupForm() {
var form = modalElement.querySelector('form'); var form = modalElement.querySelector('form');
if (form) { if (form) {
window.utils.setup('form', form); window.utils.setup('form', form, { headers: MODAL_HEADERS });
if (AJAX_SUBMIT_FLAG in form.dataset) {
window.utils.setup('asyncForm', form, { headers: MODAL_HEADERS });
}
} }
} }

14
static/js/utils/setup.js
View File

@ -47,15 +47,11 @@
document.addEventListener('setup', listener); document.addEventListener('setup', listener);
// put a slight delay on the setup event in order to allow for all dependencies to load document.dispatchEvent(new CustomEvent('setup', {
window.setTimeout(function() { detail: { targetUtil: utilName, module: 'none' },
document.dispatchEvent(new CustomEvent('setup', { bubbles: true,
detail: { targetUtil: utilName, module: 'none' }, cancelable: true,
bubbles: true, }));
cancelable: true,
}));
}, 10);
}; };
window.utils.teardown = function(utilName) { window.utils.teardown = function(utilName) {