amisa-forms
Version:
models of armisa!
59 lines (58 loc) • 2.83 kB
JavaScript
export class ModalFactory {
constructor(formFactory, children, isWaitingModal, onCloseModal, argument, classes) {
this.forceUpdate = () => { };
this.formFactory = formFactory;
this.children = children;
this.isWaitingModal = isWaitingModal;
this.onCloseModal = onCloseModal;
this.argument = argument;
this.id = Math.random().toString() + '-' + new Date().getMilliseconds().toString();
this.formFactory.childModal = this;
this.classes = typeof classes === 'string' ? classes.trim() : '';
const classMainName = isWaitingModal ? 'modal__waiting__container' : 'modal__main__container';
let tempModalRoot = document.getElementById(classMainName);
if (!tempModalRoot) {
tempModalRoot = document.createElement('div');
tempModalRoot.className = classMainName;
tempModalRoot.id = classMainName;
const root = document.getElementById('root');
root.insertAdjacentElement('beforebegin', tempModalRoot);
}
this.modalRoot = tempModalRoot;
this.backdropDivElement = document.createElement('div');
const classBackDropName = isWaitingModal ? 'backdrop-waiting-show' : 'backdrop-main-show';
this.backdropDivElement.classList.add(classBackDropName);
this.backdropDivElement.style.zIndex = `${4000}`;
this.backdropDivElement.style.opacity = '0';
this.backdropDivElement.onclick = () => this.closeByClick(this);
this.mainDivElement = document.createElement('div');
const classModalMainShowName = isWaitingModal ? 'modal-waiting-show' : 'modal-main-show';
this.mainDivElement.classList.add(classModalMainShowName);
if (this.classes) {
const splited = this.classes.split(' ');
if (splited.length > 0) {
splited.forEach(i => {
this.mainDivElement.classList.add(i);
});
}
}
this.mainDivElement.style.zIndex = `${4000}`;
// if (this.mainStateManager.Modaling.modals.length > 1) {
// this.backdropDivElement.classList.add('bgc-transparent');
// }
this.modalRoot.appendChild(this.backdropDivElement);
this.modalRoot.appendChild(this.mainDivElement);
}
closeByClick(e) {
if (e.isWaitingModal) {
return;
}
e.close();
}
close() {
this.formFactory.closeModal();
this.onCloseModal && this.onCloseModal();
// this.mainStateFactory.elementsOfForm.onCloseModalGetFocus && this.mainStateFactory.elementsOfForm.onCloseModalGetFocus();
// this.mainStateFactory.elementsOfForm.onCloseModalOpenNexWindow && this.mainStateFactory.elementsOfForm.onCloseModalOpenNexWindow();
}
}