confirm.component.ts 6.77 KB
 import { Component, OnInit, Input, Output, EventEmitter, ElementRef, ViewChild } from "@angular/core";
import {ConfirmService} from "./confirm.service";
import { ModalComponent } from "ng2-bs3-modal/ng2-bs3-modal";
import { Router } from '@angular/router';
const KEY_ESC = 27;

@Component({
    selector: 'modal-confirm',
    templateUrl: './confirm.component.html',
})
export class ConfirmComponent implements OnInit {

    private _defaults = {
        type: 'reset',
        message: 'Do you want to cancel your changes?',
        cancelText: 'Cancel',
        okText: 'OK'
    };
    timer: any;
    type: string;
    alertshow:boolean=false;
    message:string;
    okText:string;
    cancelText: string;
    modalType:string;
    @ViewChild("closeModal")
    closeModal: ModalComponent;
    @ViewChild("confirmModel")
    confirmModel: ModalComponent;
    @ViewChild("resetModal")
    resetModal: ModalComponent;
    @ViewChild("alertMessageModal")
    alertMessageModal: ModalComponent;
    private _confirmElement:any;
    private _cancelButton:any;
    private _okButton: any;
    private _noButton: any;
    private _yesResetButton: any;
    private _noResetButton: any;
    private _yesConfirmButton: any;
    private _noConfirmButton: any;
    private _okAlert: any;
    private _closeAlert: any;

    constructor(confirmService:ConfirmService,private router: Router) {
        confirmService.activate = this.activate.bind(this);
    }

    _setLabels(message = this._defaults.message, type = this._defaults.type) {
       // this.modalType = type;
         this.type = type; 
        //this.alertshow = type == 'reset' ? true : false; 
        this.message = message;
        this.okText = this._defaults.okText;
        this.cancelText = this._defaults.cancelText;
    }

    activate(message = this._defaults.message, type = this._defaults.type) {
        this._setLabels(message, type); 
        let promise = new Promise<boolean>(resolve => {
            this._show(resolve);
        });
        return promise;
    }

    private _show(resolve:(boolean) => any) {
        document.onkeyup = null; 
        let yesOnClick = (e: any) => resolve(1);   // 1 for yes 
        let noOnClick = (e: any) => resolve(2);     // 2 for no
        let cancelOnClick = (e: any) => resolve(3);  // 3 for cancel
        let yesResetClick = (e: any) => resolve(1); 
        let noResetClick = (e: any) => resolve(2); 
        let yesConfirmClick = (e: any) => resolve(6); // yes 
        let noConfirmClick = (e: any) => resolve(7); // NO


        let okAlertClick = (e: any) => resolve(5); // for alert message
        let closeAlertClick = (e: any) => resolve(8); // for alert message
        if (!this._cancelButton || !this._okButton) return; 
        //this._confirmElement.style.opacity = 0;
        //this._confirmElement.style.zIndex = 9999; 
        this._cancelButton.onclick = ((e:any) => {
            e.preventDefault();
            if (!cancelOnClick(e)) this._hideDialog();
        })

        this._okButton.onclick = ((e:any) => {
            e.preventDefault();
            if (!yesOnClick(e)) this._hideDialog()
        });
        this._noButton.onclick = ((e: any) => {
            e.preventDefault();
            if (!noOnClick(e)) this._hideDialog()
        });

        this._noResetButton.onclick = ((e: any) => {
            e.preventDefault();
            if (!noResetClick(e)) this._hideDialog()
        });
        this._yesResetButton.onclick = ((e: any) => {
            e.preventDefault();
            if (!yesResetClick(e)) this._hideDialog()
        });


        this._noConfirmButton.onclick = ((e: any) => {
            e.preventDefault();
            if (!noConfirmClick(e)) this._hideDialog()
        });
        this._yesConfirmButton.onclick = ((e: any) => {
            e.preventDefault();
            if (!yesConfirmClick(e)) this._hideDialog()
        });


        this._okAlert.onclick = ((e: any) => {
            e.preventDefault();
            if (!okAlertClick(e)) this._hideDialog()
        });
        this._closeAlert.onclick = ((e: any) => {
            e.preventDefault();
            if (!closeAlertClick(e)) this._hideDialog()
        });
        //this._confirmelement.onclick = () => {
        //    this._hidedialog();
        //    return negativeonclick(null);
        //};
        if (this.type.toString() == "close") {
            this.closeModal.open('sm');
            return;
        }
        if (this.type.toString() == "reset") {
             this.resetModal.open('sm'); 
            return;
        } 

        if (this.type.toString() == "confirmModel") {
            this.confirmModel.open('sm');
            return;
        } 

        if (this.type.toString() == "alertMsg") {
            //setTimeout(this.alertMessageModal.open('sm'), 60000);
            clearTimeout(this.timer);
            this.timer = setTimeout(() => {
                this.alertMessageModal.open('sm');
            }, 500);
            return;
        } 
        if (this.type.toString() == "alertMsg2") {
            
                this.alertMessageModal.open('sm'); 
            return;
        } 
        document.onkeyup = (e:any) => {
            if (e.which == KEY_ESC) {
                this._hideDialog();
                return cancelOnClick(null);
            }
        };
       
        //this._confirmElement.style.opacity = 1;
    }

    private _hideDialog() { 
        if (this.type.toString() == "close") {
             this.closeModal.close(); 
            return;
        }
        if (this.type.toString() == "reset") {
            this.resetModal.close();  
            return;
        } 

        if (this.type.toString() == "confirmModel") {
            this.confirmModel.close();
            return;
        } 

        if (this.type.toString() == "alertMsg") {
            this.alertMessageModal.close();
            var url= this.router.url;
            if(url=='/changeuserpassword' || url== '/changeuserid')
            this.router.navigate(['/']);
            return;
        }
        if (this.type.toString() == "alertMsg2") {
            this.alertMessageModal.close();
            return;
        } 
        
    }

    ngOnInit():any {
        //this._confirmElement = document.getElementById('confirmationModal');
        this._cancelButton = document.getElementById('cancelButton');
        this._okButton = document.getElementById('okButton');
        this._noButton = document.getElementById('noButton'); 
        this._yesResetButton = document.getElementById('yesResetButton');
        this._noResetButton = document.getElementById('noResetButton');
        this._yesConfirmButton = document.getElementById('yesConfirmButton');
        this._noConfirmButton = document.getElementById('noConfirmButton');
        this._okAlert = document.getElementById('okAlert');
        this._closeAlert = document.getElementById('closeAlert');

    }
}