aboutsummaryrefslogtreecommitdiffstats
path: root/src/angular/modals/modal.service.ts
blob: d80ad1f8f2166e301e2f486e524e56cb0c9e19ed (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
import { Injectable, Type, ComponentRef } from '@angular/core';
import { ModalComponent } from "./modal.component";
import { CreateDynamicComponentService } from "../utils/create-dynamic-component.service";
import { IModalConfig, ModalType, ModalSize, IModalButtonComponent } from "./models/modal-config";

@Injectable()
export class ModalService {

    private currentModal: ComponentRef<any>;

    constructor(private createDynamicComponentService: CreateDynamicComponentService) {
    }

    /* Shortcut method to open an alert modal with title, message, and close button that simply closes the modal. */
    public openAlertModal(title: string, message: string, actionButtonText?: string, actionButtonCallback?: Function, testId?: string) {
        const modalConfig = {
            size: ModalSize.small,
            title: title,
            message: message,
            testId: testId,
            buttons: this.createButtons('secondary', actionButtonText, actionButtonCallback),
            type: ModalType.alert
        } as IModalConfig;
        const modalInstance: ComponentRef<ModalComponent> = this.openModal(modalConfig);
        this.currentModal = modalInstance;
        return modalInstance;
    }

    public openActionModal = (title: string, message: string, actionButtonText?: string, actionButtonCallback?: Function, testId?: string): ComponentRef<ModalComponent> => {
        const modalConfig = {
            size: ModalSize.small,
            title: title,
            message: message,
            testId: testId,
            type: ModalType.standard,
            buttons: this.createButtons('primary', actionButtonText, actionButtonCallback)
        } as IModalConfig;
        const modalInstance: ComponentRef<ModalComponent> = this.openModal(modalConfig);
        this.currentModal = modalInstance;
        return modalInstance;
    }

    public openErrorModal = (errorMessage?: string, testId?: string): ComponentRef<ModalComponent> => {
        const modalConfig = {
            size: ModalSize.small,
            title: 'Error',
            message: errorMessage,
            testId: testId,
            buttons: [{text: "OK", type: "alert", closeModal: true}],
            type: ModalType.error
        } as IModalConfig;
        const modalInstance: ComponentRef<ModalComponent> = this.openModal(modalConfig);
        this.currentModal = modalInstance;
        return modalInstance;
    }

    public openCustomModal = (modalConfig: IModalConfig, dynamicComponentType: Type<any>, dynamicComponentInput?: any) => {
        const modalInstance: ComponentRef<ModalComponent> = this.openModal(modalConfig);
        this.createInnnerComponent(dynamicComponentType, dynamicComponentInput);
        return modalInstance;
    }

    public createInnnerComponent = (dynamicComponentType: Type<any>, dynamicComponentInput?: any): void => {
        this.currentModal.instance.innerModalContent = this.createDynamicComponentService.insertComponentDynamically(dynamicComponentType, dynamicComponentInput, this.currentModal.instance.dynamicContentContainer);
    }

    public openModal = (customModalData: IModalConfig): ComponentRef<ModalComponent> => {
        const modalInstance: ComponentRef<ModalComponent> = this.createDynamicComponentService.createComponentDynamically(ModalComponent, customModalData);
        modalInstance.instance.closeAnimationComplete.subscribe(() => {
            this.destroyModal();
        });
        this.currentModal = modalInstance;
        return modalInstance;
    }

    public getCurrentInstance = () => {
        return this.currentModal.instance;
    }

    public closeModal = (): void => { // triggers closeModal animation, which then triggers toggleModal.done and the subscription to destroyModal
        this.currentModal.instance.modalVisible = false;
    }

    private createButtons = (type: string, actionButtonText?: string, actionButtonCallback?: Function): Array<IModalButtonComponent> => {
        const buttons: Array<IModalButtonComponent> = [];
        if (actionButtonText && actionButtonCallback) {
            buttons.push({text: actionButtonText, type: type, callback: actionButtonCallback, closeModal: true});
            buttons.push({text: 'Cancel', type: 'secondary', closeModal: true});
        } else {
            buttons.push({text: 'Cancel', type: type, closeModal: true});
        }

        return buttons;
    }

    private destroyModal = (): void => {
        this.currentModal.destroy();
    }

}