import { Component } from '@angular/core';
import { NgbModal, ModalDismissReasons } from '@ng-bootstrap/ng-bootstrap';

@Component({
	// tslint:disable-next-line: indent
	selector: 'app-ngbd-modal',
	templateUrl: './modal.component.html'
})
export class NgbdModalBasicComponent {
	closeResult = '';

	constructor(private modalService: NgbModal) { }
	// This is for the first modal
	open1(content1: string) {
		this.modalService.open(content1, { ariaLabelledBy: 'modal-basic-title' }).result.then((result) => {
			this.closeResult = `Closed with: ${result}`;
		}, (reason) => {
			this.closeResult = `Dismissed ${this.getDismissReason(reason)}`;
		});
	}
	// This is for the Second modal
	open2(content2: string) {
		this.modalService.open(content2, { ariaLabelledBy: 'modal-basic-title' }).result.then((result) => {
			this.closeResult = `Closed with: ${result}`;
		}, (reason) => {
			this.closeResult = `Dismissed ${this.getDismissReason(reason)}`;
		});
	}

	// This is for the Third varios modal options

	openBackDropCustomClass(content3: string) {
		this.modalService.open(content3, { backdropClass: 'light-blue-backdrop' });
	}

	openWindowCustomClass(content3: string) {
		this.modalService.open(content3, { windowClass: 'dark-modal' });
	}

	openSm(content3: string) {
		this.modalService.open(content3, { size: 'sm' });
	}

	openLg(content3: string) {
		this.modalService.open(content3, { size: 'lg' });
	}

	openVerticallyCentered(content3: string) {
		this.modalService.open(content3, { centered: true });
	}

	openstackmodal(contentstack: string) {
		this.modalService.open(contentstack, { size: 'lg' });
	}


	opensubmodal(contentsubmodal: string) {
		this.modalService.open(contentsubmodal, { size: 'lg' });
	}


	private getDismissReason(reason: ModalDismissReasons): string {
		if (reason === ModalDismissReasons.ESC) {
			return 'by pressing ESC';
		} else if (reason === ModalDismissReasons.BACKDROP_CLICK) {
			return 'by clicking on a backdrop';
		} else {
			return `with: ${reason}`;
		}
	}
}

