MaDgIK
/
openaire-library
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[Library | new-theme]: full-screen-modal.component.ts & alert.ts: [Bug fix] Added private static counter field to increase on each modal creation and set id according to the counter, to delete from DOM in "modal-container" the destroyed modal.

This commit is contained in:
Konstantina Galouni 2022-07-11 17:27:44 +03:00
parent 74bcc96847
commit cfd44ec96b
2 changed files with 39 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
utils/modal/alert.ts
View File

@ -49,7 +49,9 @@ declare var UIkit: any;
* API to an open alert window.
*/
export class AlertModal {
@Input() id: string = "modal";
private static MODAL_COUNTER: number = 0;
id: string = "modal";
@Input() classTitle: string = "uk-background-primary-opacity";
@Input() classBody: string = "";
@Input() large: boolean = false;
@ -137,7 +139,23 @@ export class AlertModal {
constructor() {
}
ngOnInit() {
AlertModal.MODAL_COUNTER++;
this.id = 'modal-' + AlertModal.MODAL_COUNTER;
}
ngOnDestroy() {
if(typeof document !== "undefined") {
const element = document.getElementById("modal-container");
for (let i = element.childNodes.length - 1; i >= 0; --i) {
let child: ChildNode = element.childNodes[i];
if (child['id'] == this.id) {
child.remove();
}
}
}
}
/**
* Opens an alert window creating backdrop.

21
utils/modal/full-screen-modal/full-screen-modal.component.ts
View File

@ -51,7 +51,9 @@ declare var ResizeObserver;
`
})
export class FullScreenModalComponent implements AfterViewInit, OnDestroy {
@Input() id: string = "fs-modal";
private static FS_MODAL_COUNTER: number = 0;
id: string = "fs-modal";
@Input() classTitle: string = "uk-background-primary uk-light";
@Input() classBody: string = 'uk-container-large';
back: boolean = false;
@ -78,7 +80,12 @@ export class FullScreenModalComponent implements AfterViewInit, OnDestroy {
onResize() {
this.changeHeight();
}
ngOnInit() {
FullScreenModalComponent.FS_MODAL_COUNTER++;
this.id = 'fs-modal-' + FullScreenModalComponent.FS_MODAL_COUNTER;
}
ngAfterViewInit() {
if(typeof window !== "undefined") {
this.observer = new ResizeObserver(entries => {
@ -102,6 +109,16 @@ export class FullScreenModalComponent implements AfterViewInit, OnDestroy {
if(this.observer && this.observer instanceof ResizeObserver) {
this.observer.disconnect();
}
if(typeof document !== "undefined") {
const element = document.getElementById("modal-container");
for (let i = element.childNodes.length - 1; i >= 0; --i) {
let child: ChildNode = element.childNodes[i];
if (child['id'] == this.id) {
child.remove();
}
}
}
}
get isOpen() {