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

fix: prompt not shwowing up after submit/close

Browse Source
This commit is contained in:
Johannes Eder 2021-07-16 14:00:32 +02:00 committed by Sarah Vaupel
parent db30fa6423
commit abe84156d5
3 changed files with 40 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/utils/async-form/async-form.js
View File

@ -100,8 +100,8 @@ export class AsyncForm {
).catch(() => {
const failureMessage = this._app.i18n.get('asyncFormFailure');
this._processResponse({ content: failureMessage });
this._element.classList.remove(ASYNC_FORM_LOADING_CLASS);
});
this._app.utilRegistry.destroyAll(this._element);
}
}

12
frontend/src/utils/form/navigate-away-prompt.js
View File

@ -27,18 +27,20 @@ const NAVIGATE_AWAY_PROMPT_UTIL_OPTOUT = '[uw-no-navigate-away-prompt]';
export class NavigateAwayPrompt {
_element;
_app;
_eventManager;
_initFormData;
_unloadDueToSubmit = false;
constructor(element) {
constructor(element, app) {
if (!element) {
throw new Error('Navigate Away Prompt utility needs to be passed an element!');
}
this._element = element;
this._app = app;
this._eventManager = new EventManager();
if (this._element.classList.contains(NAVIGATE_AWAY_PROMPT_INITIALIZED_CLASS)) {
@ -105,8 +107,12 @@ export class NavigateAwayPrompt {
// allow the event to happen if the form was not touched by the
// user (i.e. if the current FormData is equal to the initial FormData)
// or the unload event was initiated by a form submit
if (!formDataHasChanged || this._unloadDueToSubmit) {
this.destroy(); //prevent propmt from triggering after the form was closed and the user navigates away
if (!formDataHasChanged)
return;
if(this._unloadDueToSubmit) {
this._app.utilRegistry.destroyAll(this._element);
return;
}

41
frontend/src/utils/modal/modal.js
View File

@ -1,4 +1,5 @@
import { Utility } from '../../core/utility';
import { EventManager, EventWrapper, EVENT_TYPE } from '../../lib/event-manager/event-manager';
import './modal.sass';
const MODAL_HEADERS = {
@ -28,12 +29,16 @@ const MODALS_WRAPPER_OPEN_CLASS = 'modals-wrapper--open';
})
export class Modal {
_eventManager
_element;
_app;
_modalsWrapper;
_modalOverlay;
_modalUrl;
_triggerElement;
_closerElement;
constructor(element, app) {
if (!element) {
@ -42,6 +47,7 @@ export class Modal {
this._element = element;
this._app = app;
this._eventManager = new EventManager();
if (this._element.classList.contains(MODAL_INITIALIZED_CLASS)) {
return false;
@ -66,7 +72,16 @@ export class Modal {
}
destroy() {
// TODO
this._eventManager.cleanUp();
if (this._closerElement !== undefined)
this._closerElement.remove();
if(this._triggerElement !== undefined)
this._triggerElement.classList.remove(MODAL_TRIGGER_CLASS);
if(this._modalsWrapper !== undefined)
this._modalsWrapper.remove();
if(this._modalOverlay !== undefined)
this._modalOverlay.remove();
this._element.classList.remove(MODAL_INITIALIZED_CLASS, MODAL_CLASS);
}
_ensureModalWrapper() {
@ -92,23 +107,26 @@ export class Modal {
if (!triggerSelector.startsWith('#')) {
triggerSelector = '#' + triggerSelector;
}
const triggerElement = document.querySelector(triggerSelector);
this._triggerElement = document.querySelector(triggerSelector);
if (!triggerElement) {
if (!this._triggerElement) {
throw new Error('Trigger element for Modal not found: "' + triggerSelector + '"');
}
triggerElement.classList.add(MODAL_TRIGGER_CLASS);
triggerElement.addEventListener('click', this._onTriggerClicked, false);
this._modalUrl = triggerElement.getAttribute('href');
this._triggerElement.classList.add(MODAL_TRIGGER_CLASS);
const triggerEvent = new EventWrapper(EVENT_TYPE.CLICK, this._onTriggerClicked.bind(this), this._triggerElement, false);
this._eventManager.registerNewListener(triggerEvent);
this._modalUrl = this._triggerElement.getAttribute('href');
}
_setupCloser() {
const closerElement = document.createElement('div');
this._element.insertBefore(closerElement, null);
closerElement.classList.add(MODAL_CLOSER_CLASS);
closerElement.addEventListener('click', this._onCloseClicked, false);
this._modalOverlay.addEventListener('click', this._onCloseClicked, false);
this._closerElement = document.createElement('div');
this._element.insertBefore(this._closerElement, null);
this._closerElement.classList.add(MODAL_CLOSER_CLASS);
const closerElEvent = new EventWrapper(EVENT_TYPE.CLICK, this._onCloseClicked.bind(this), this._closerElement, false);
this._eventManager.registerNewListener(closerElEvent);
const overlayClose = new EventWrapper(EVENT_TYPE.CLICK, this._onCloseClicked.bind(this), this._modalOverlay, false);
this._eventManager.registerNewListener(overlayClose);
}
_onTriggerClicked = (event) => {
@ -119,6 +137,7 @@ export class Modal {
_onCloseClicked = (event) => {
event.preventDefault();
this._close();
this._app.utilRegistry.destroyAll(this._element);
}
_onKeyUp = (event) => {