| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036 |
- import { Injectable, Component, ElementRef, Renderer2, HostListener, EventEmitter, Directive, ViewContainerRef, Input, Output, RendererFactory2, NgModule } from '@angular/core';
- import { isBs3, Utils, document as document$1, window as window$1 } from 'ngx-bootstrap/utils';
- import { ComponentLoaderFactory } from 'ngx-bootstrap/component-loader';
- import { PositioningService } from 'ngx-bootstrap/positioning';
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- class BsModalRef {
- constructor() {
- /**
- * Hides the modal
- */
- this.hide = Function;
- /**
- * Sets new class to modal window
- */
- this.setClass = Function;
- }
- }
- BsModalRef.decorators = [
- { type: Injectable }
- ];
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- class ModalBackdropOptions {
- /**
- * @param {?} options
- */
- constructor(options) {
- this.animate = true;
- Object.assign(this, options);
- }
- }
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- class ModalOptions {
- }
- ModalOptions.decorators = [
- { type: Injectable }
- ];
- /** @type {?} */
- const modalConfigDefaults = {
- backdrop: true,
- keyboard: true,
- focus: true,
- show: false,
- ignoreBackdropClick: false,
- class: '',
- animated: true,
- initialState: {}
- };
- /** @type {?} */
- const CLASS_NAME = {
- SCROLLBAR_MEASURER: 'modal-scrollbar-measure',
- BACKDROP: 'modal-backdrop',
- OPEN: 'modal-open',
- FADE: 'fade',
- IN: 'in',
- // bs3
- SHOW: 'show' // bs4
- };
- /** @type {?} */
- const TRANSITION_DURATIONS = {
- MODAL: 300,
- BACKDROP: 150
- };
- /** @type {?} */
- const DISMISS_REASONS = {
- BACKRDOP: 'backdrop-click',
- ESC: 'esc'
- };
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- class ModalContainerComponent {
- /**
- * @param {?} options
- * @param {?} _element
- * @param {?} _renderer
- */
- constructor(options, _element, _renderer) {
- this._element = _element;
- this._renderer = _renderer;
- this.isShown = false;
- this.isModalHiding = false;
- this.config = Object.assign({}, options);
- }
- /**
- * @return {?}
- */
- ngOnInit() {
- if (this.isAnimated) {
- this._renderer.addClass(this._element.nativeElement, CLASS_NAME.FADE);
- }
- this._renderer.setStyle(this._element.nativeElement, 'display', 'block');
- setTimeout((/**
- * @return {?}
- */
- () => {
- this.isShown = true;
- this._renderer.addClass(this._element.nativeElement, isBs3() ? CLASS_NAME.IN : CLASS_NAME.SHOW);
- }), this.isAnimated ? TRANSITION_DURATIONS.BACKDROP : 0);
- if (document && document.body) {
- if (this.bsModalService.getModalsCount() === 1) {
- this.bsModalService.checkScrollbar();
- this.bsModalService.setScrollbar();
- }
- this._renderer.addClass(document.body, CLASS_NAME.OPEN);
- }
- if (this._element.nativeElement) {
- this._element.nativeElement.focus();
- }
- }
- /**
- * @param {?} event
- * @return {?}
- */
- onClick(event) {
- if (this.config.ignoreBackdropClick ||
- this.config.backdrop === 'static' ||
- event.target !== this._element.nativeElement) {
- return;
- }
- this.bsModalService.setDismissReason(DISMISS_REASONS.BACKRDOP);
- this.hide();
- }
- /**
- * @param {?} event
- * @return {?}
- */
- onEsc(event) {
- if (!this.isShown) {
- return;
- }
- // tslint:disable-next-line:deprecation
- if (event.keyCode === 27 || event.key === 'Escape') {
- event.preventDefault();
- }
- if (this.config.keyboard &&
- this.level === this.bsModalService.getModalsCount()) {
- this.bsModalService.setDismissReason(DISMISS_REASONS.ESC);
- this.hide();
- }
- }
- /**
- * @return {?}
- */
- ngOnDestroy() {
- if (this.isShown) {
- this.hide();
- }
- }
- /**
- * @return {?}
- */
- hide() {
- if (this.isModalHiding || !this.isShown) {
- return;
- }
- this.isModalHiding = true;
- this._renderer.removeClass(this._element.nativeElement, isBs3() ? CLASS_NAME.IN : CLASS_NAME.SHOW);
- setTimeout((/**
- * @return {?}
- */
- () => {
- this.isShown = false;
- if (document &&
- document.body &&
- this.bsModalService.getModalsCount() === 1) {
- this._renderer.removeClass(document.body, CLASS_NAME.OPEN);
- }
- this.bsModalService.hide(this.level);
- this.isModalHiding = false;
- }), this.isAnimated ? TRANSITION_DURATIONS.MODAL : 0);
- }
- }
- ModalContainerComponent.decorators = [
- { type: Component, args: [{
- selector: 'modal-container',
- template: `
- <div [class]="'modal-dialog' + (config.class ? ' ' + config.class : '')" role="document">
- <div class="modal-content">
- <ng-content></ng-content>
- </div>
- </div>
- `,
- host: {
- class: 'modal',
- role: 'dialog',
- tabindex: '-1',
- '[attr.aria-modal]': 'true'
- }
- }] }
- ];
- /** @nocollapse */
- ModalContainerComponent.ctorParameters = () => [
- { type: ModalOptions },
- { type: ElementRef },
- { type: Renderer2 }
- ];
- ModalContainerComponent.propDecorators = {
- onClick: [{ type: HostListener, args: ['click', ['$event'],] }],
- onEsc: [{ type: HostListener, args: ['window:keydown.esc', ['$event'],] }]
- };
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- /**
- * This component will be added as background layout for modals if enabled
- */
- class ModalBackdropComponent {
- /**
- * @param {?} element
- * @param {?} renderer
- */
- constructor(element, renderer) {
- this._isShown = false;
- this.element = element;
- this.renderer = renderer;
- }
- /**
- * @return {?}
- */
- get isAnimated() {
- return this._isAnimated;
- }
- /**
- * @param {?} value
- * @return {?}
- */
- set isAnimated(value) {
- this._isAnimated = value;
- // this.renderer.setElementClass(this.element.nativeElement, `${ClassName.FADE}`, value);
- }
- /**
- * @return {?}
- */
- get isShown() {
- return this._isShown;
- }
- /**
- * @param {?} value
- * @return {?}
- */
- set isShown(value) {
- this._isShown = value;
- if (value) {
- this.renderer.addClass(this.element.nativeElement, `${CLASS_NAME.IN}`);
- }
- else {
- this.renderer.removeClass(this.element.nativeElement, `${CLASS_NAME.IN}`);
- }
- if (!isBs3()) {
- if (value) {
- this.renderer.addClass(this.element.nativeElement, `${CLASS_NAME.SHOW}`);
- }
- else {
- this.renderer.removeClass(this.element.nativeElement, `${CLASS_NAME.SHOW}`);
- }
- }
- }
- /**
- * @return {?}
- */
- ngOnInit() {
- if (this.isAnimated) {
- this.renderer.addClass(this.element.nativeElement, `${CLASS_NAME.FADE}`);
- Utils.reflow(this.element.nativeElement);
- }
- this.isShown = true;
- }
- }
- ModalBackdropComponent.decorators = [
- { type: Component, args: [{
- selector: 'bs-modal-backdrop',
- template: ' ',
- host: { class: CLASS_NAME.BACKDROP }
- }] }
- ];
- /** @nocollapse */
- ModalBackdropComponent.ctorParameters = () => [
- { type: ElementRef },
- { type: Renderer2 }
- ];
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- /** @type {?} */
- const TRANSITION_DURATION = 300;
- /** @type {?} */
- const BACKDROP_TRANSITION_DURATION = 150;
- /**
- * Mark any code with directive to show it's content in modal
- */
- class ModalDirective {
- /**
- * @param {?} _element
- * @param {?} _viewContainerRef
- * @param {?} _renderer
- * @param {?} clf
- */
- constructor(_element, _viewContainerRef, _renderer, clf) {
- this._element = _element;
- this._renderer = _renderer;
- /**
- * This event fires immediately when the `show` instance method is called.
- */
- this.onShow = new EventEmitter();
- /**
- * This event is fired when the modal has been made visible to the user
- * (will wait for CSS transitions to complete)
- */
- this.onShown = new EventEmitter();
- /**
- * This event is fired immediately when
- * the hide instance method has been called.
- */
- this.onHide = new EventEmitter();
- /**
- * This event is fired when the modal has finished being
- * hidden from the user (will wait for CSS transitions to complete).
- */
- this.onHidden = new EventEmitter();
- this._isShown = false;
- this.isBodyOverflowing = false;
- this.originalBodyPadding = 0;
- this.scrollbarWidth = 0;
- this.timerHideModal = 0;
- this.timerRmBackDrop = 0;
- this.isNested = false;
- this._backdrop = clf.createLoader(_element, _viewContainerRef, _renderer);
- }
- /**
- * allows to set modal configuration via element property
- * @param {?} conf
- * @return {?}
- */
- set config(conf) {
- this._config = this.getConfig(conf);
- }
- /**
- * @return {?}
- */
- get config() {
- return this._config;
- }
- /**
- * @return {?}
- */
- get isShown() {
- return this._isShown;
- }
- /**
- * @param {?} event
- * @return {?}
- */
- onClick(event) {
- if (this.config.ignoreBackdropClick ||
- this.config.backdrop === 'static' ||
- event.target !== this._element.nativeElement) {
- return;
- }
- this.dismissReason = DISMISS_REASONS.BACKRDOP;
- this.hide(event);
- }
- // todo: consider preventing default and stopping propagation
- /**
- * @param {?} event
- * @return {?}
- */
- onEsc(event) {
- if (!this._isShown) {
- return;
- }
- // tslint:disable-next-line:deprecation
- if (event.keyCode === 27 || event.key === 'Escape') {
- event.preventDefault();
- }
- if (this.config.keyboard) {
- this.dismissReason = DISMISS_REASONS.ESC;
- this.hide();
- }
- }
- /**
- * @return {?}
- */
- ngOnDestroy() {
- this.config = void 0;
- if (this._isShown) {
- this._isShown = false;
- this.hideModal();
- this._backdrop.dispose();
- }
- }
- /**
- * @return {?}
- */
- ngOnInit() {
- this._config = this._config || this.getConfig();
- setTimeout((/**
- * @return {?}
- */
- () => {
- if (this._config.show) {
- this.show();
- }
- }), 0);
- }
- /* Public methods */
- /**
- * Allows to manually toggle modal visibility
- * @return {?}
- */
- toggle() {
- return this._isShown ? this.hide() : this.show();
- }
- /**
- * Allows to manually open modal
- * @return {?}
- */
- show() {
- this.dismissReason = null;
- this.onShow.emit(this);
- if (this._isShown) {
- return;
- }
- clearTimeout(this.timerHideModal);
- clearTimeout(this.timerRmBackDrop);
- this._isShown = true;
- this.checkScrollbar();
- this.setScrollbar();
- if (document$1 && document$1.body) {
- if (document$1.body.classList.contains(CLASS_NAME.OPEN)) {
- this.isNested = true;
- }
- else {
- this._renderer.addClass(document$1.body, CLASS_NAME.OPEN);
- }
- }
- this.showBackdrop((/**
- * @return {?}
- */
- () => {
- this.showElement();
- }));
- }
- /**
- * Allows to manually close modal
- * @param {?=} event
- * @return {?}
- */
- hide(event) {
- if (event) {
- event.preventDefault();
- }
- this.onHide.emit(this);
- // todo: add an option to prevent hiding
- if (!this._isShown) {
- return;
- }
- window$1.clearTimeout(this.timerHideModal);
- window$1.clearTimeout(this.timerRmBackDrop);
- this._isShown = false;
- this._renderer.removeClass(this._element.nativeElement, CLASS_NAME.IN);
- if (!isBs3()) {
- this._renderer.removeClass(this._element.nativeElement, CLASS_NAME.SHOW);
- }
- // this._addClassIn = false;
- if (this._config.animated) {
- this.timerHideModal = window$1.setTimeout((/**
- * @return {?}
- */
- () => this.hideModal()), TRANSITION_DURATION);
- }
- else {
- this.hideModal();
- }
- }
- /**
- * Private methods \@internal
- * @protected
- * @param {?=} config
- * @return {?}
- */
- getConfig(config) {
- return Object.assign({}, modalConfigDefaults, config);
- }
- /**
- * Show dialog
- * \@internal
- * @protected
- * @return {?}
- */
- showElement() {
- // todo: replace this with component loader usage
- if (!this._element.nativeElement.parentNode ||
- this._element.nativeElement.parentNode.nodeType !== Node.ELEMENT_NODE) {
- // don't move modals dom position
- if (document$1 && document$1.body) {
- document$1.body.appendChild(this._element.nativeElement);
- }
- }
- this._renderer.setAttribute(this._element.nativeElement, 'aria-hidden', 'false');
- this._renderer.setAttribute(this._element.nativeElement, 'aria-modal', 'true');
- this._renderer.setStyle(this._element.nativeElement, 'display', 'block');
- this._renderer.setProperty(this._element.nativeElement, 'scrollTop', 0);
- if (this._config.animated) {
- Utils.reflow(this._element.nativeElement);
- }
- // this._addClassIn = true;
- this._renderer.addClass(this._element.nativeElement, CLASS_NAME.IN);
- if (!isBs3()) {
- this._renderer.addClass(this._element.nativeElement, CLASS_NAME.SHOW);
- }
- /** @type {?} */
- const transitionComplete = (/**
- * @return {?}
- */
- () => {
- if (this._config.focus) {
- this._element.nativeElement.focus();
- }
- this.onShown.emit(this);
- });
- if (this._config.animated) {
- setTimeout(transitionComplete, TRANSITION_DURATION);
- }
- else {
- transitionComplete();
- }
- }
- /**
- * \@internal
- * @protected
- * @return {?}
- */
- hideModal() {
- this._renderer.setAttribute(this._element.nativeElement, 'aria-hidden', 'true');
- this._renderer.setStyle(this._element.nativeElement, 'display', 'none');
- this.showBackdrop((/**
- * @return {?}
- */
- () => {
- if (!this.isNested) {
- if (document$1 && document$1.body) {
- this._renderer.removeClass(document$1.body, CLASS_NAME.OPEN);
- }
- this.resetScrollbar();
- }
- this.resetAdjustments();
- this.focusOtherModal();
- this.onHidden.emit(this);
- }));
- }
- // todo: original show was calling a callback when done, but we can use
- // promise
- /**
- * \@internal
- * @protected
- * @param {?=} callback
- * @return {?}
- */
- showBackdrop(callback) {
- if (this._isShown &&
- this.config.backdrop &&
- (!this.backdrop || !this.backdrop.instance.isShown)) {
- this.removeBackdrop();
- this._backdrop
- .attach(ModalBackdropComponent)
- .to('body')
- .show({ isAnimated: this._config.animated });
- this.backdrop = this._backdrop._componentRef;
- if (!callback) {
- return;
- }
- if (!this._config.animated) {
- callback();
- return;
- }
- setTimeout(callback, BACKDROP_TRANSITION_DURATION);
- }
- else if (!this._isShown && this.backdrop) {
- this.backdrop.instance.isShown = false;
- /** @type {?} */
- const callbackRemove = (/**
- * @return {?}
- */
- () => {
- this.removeBackdrop();
- if (callback) {
- callback();
- }
- });
- if (this.backdrop.instance.isAnimated) {
- this.timerRmBackDrop = window$1.setTimeout(callbackRemove, BACKDROP_TRANSITION_DURATION);
- }
- else {
- callbackRemove();
- }
- }
- else if (callback) {
- callback();
- }
- }
- /**
- * \@internal
- * @protected
- * @return {?}
- */
- removeBackdrop() {
- this._backdrop.hide();
- }
- /**
- * Events tricks
- * @protected
- * @return {?}
- */
- // no need for it
- // protected setEscapeEvent():void {
- // if (this._isShown && this._config.keyboard) {
- // $(this._element).on(Event.KEYDOWN_DISMISS, (event) => {
- // if (event.which === 27) {
- // this.hide()
- // }
- // })
- //
- // } else if (!this._isShown) {
- // $(this._element).off(Event.KEYDOWN_DISMISS)
- // }
- // }
- // protected setResizeEvent():void {
- // console.log(this.renderer.listenGlobal('', Event.RESIZE));
- // if (this._isShown) {
- // $(window).on(Event.RESIZE, $.proxy(this._handleUpdate, this))
- // } else {
- // $(window).off(Event.RESIZE)
- // }
- // }
- focusOtherModal() {
- if (this._element.nativeElement.parentElement == null) {
- return;
- }
- /** @type {?} */
- const otherOpenedModals = this._element.nativeElement.parentElement.querySelectorAll('.in[bsModal]');
- if (!otherOpenedModals.length) {
- return;
- }
- otherOpenedModals[otherOpenedModals.length - 1].focus();
- }
- /**
- * \@internal
- * @protected
- * @return {?}
- */
- resetAdjustments() {
- this._renderer.setStyle(this._element.nativeElement, 'paddingLeft', '');
- this._renderer.setStyle(this._element.nativeElement, 'paddingRight', '');
- }
- /** Scroll bar tricks */
- /**
- * \@internal
- * @protected
- * @return {?}
- */
- checkScrollbar() {
- this.isBodyOverflowing = document$1.body.clientWidth < window$1.innerWidth;
- this.scrollbarWidth = this.getScrollbarWidth();
- }
- /**
- * @protected
- * @return {?}
- */
- setScrollbar() {
- if (!document$1) {
- return;
- }
- this.originalBodyPadding = parseInt(window$1
- .getComputedStyle(document$1.body)
- .getPropertyValue('padding-right') || 0, 10);
- if (this.isBodyOverflowing) {
- document$1.body.style.paddingRight = `${this.originalBodyPadding +
- this.scrollbarWidth}px`;
- }
- }
- /**
- * @protected
- * @return {?}
- */
- resetScrollbar() {
- document$1.body.style.paddingRight = `${this.originalBodyPadding}px`;
- }
- // thx d.walsh
- /**
- * @protected
- * @return {?}
- */
- getScrollbarWidth() {
- /** @type {?} */
- const scrollDiv = this._renderer.createElement('div');
- this._renderer.addClass(scrollDiv, CLASS_NAME.SCROLLBAR_MEASURER);
- this._renderer.appendChild(document$1.body, scrollDiv);
- /** @type {?} */
- const scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;
- this._renderer.removeChild(document$1.body, scrollDiv);
- return scrollbarWidth;
- }
- }
- ModalDirective.decorators = [
- { type: Directive, args: [{
- selector: '[bsModal]',
- exportAs: 'bs-modal'
- },] }
- ];
- /** @nocollapse */
- ModalDirective.ctorParameters = () => [
- { type: ElementRef },
- { type: ViewContainerRef },
- { type: Renderer2 },
- { type: ComponentLoaderFactory }
- ];
- ModalDirective.propDecorators = {
- config: [{ type: Input }],
- onShow: [{ type: Output }],
- onShown: [{ type: Output }],
- onHide: [{ type: Output }],
- onHidden: [{ type: Output }],
- onClick: [{ type: HostListener, args: ['click', ['$event'],] }],
- onEsc: [{ type: HostListener, args: ['keydown.esc', ['$event'],] }]
- };
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- class BsModalService {
- /**
- * @param {?} rendererFactory
- * @param {?} clf
- */
- constructor(rendererFactory, clf) {
- this.clf = clf;
- // constructor props
- this.config = modalConfigDefaults;
- // tslint:disable-next-line:no-any
- this.onShow = new EventEmitter();
- // tslint:disable-next-line:no-any
- this.onShown = new EventEmitter();
- // tslint:disable-next-line:no-any
- this.onHide = new EventEmitter();
- // tslint:disable-next-line:no-any
- this.onHidden = new EventEmitter();
- this.isBodyOverflowing = false;
- this.originalBodyPadding = 0;
- this.scrollbarWidth = 0;
- this.modalsCount = 0;
- this.lastDismissReason = '';
- this.loaders = [];
- this._backdropLoader = this.clf.createLoader(null, null, null);
- this._renderer = rendererFactory.createRenderer(null, null);
- }
- /**
- * Shows a modal
- * @param {?} content
- * @param {?=} config
- * @return {?}
- */
- // tslint:disable-next-line:no-any
- show(content, config) {
- this.modalsCount++;
- this._createLoaders();
- this.config = Object.assign({}, modalConfigDefaults, config);
- this._showBackdrop();
- this.lastDismissReason = null;
- return this._showModal(content);
- }
- /**
- * @param {?} level
- * @return {?}
- */
- hide(level) {
- if (this.modalsCount === 1) {
- this._hideBackdrop();
- this.resetScrollbar();
- }
- this.modalsCount = this.modalsCount >= 1 ? this.modalsCount - 1 : 0;
- setTimeout((/**
- * @return {?}
- */
- () => {
- this._hideModal(level);
- this.removeLoaders(level);
- }), this.config.animated ? TRANSITION_DURATIONS.BACKDROP : 0);
- }
- /**
- * @return {?}
- */
- _showBackdrop() {
- /** @type {?} */
- const isBackdropEnabled = this.config.backdrop || this.config.backdrop === 'static';
- /** @type {?} */
- const isBackdropInDOM = !this.backdropRef || !this.backdropRef.instance.isShown;
- if (this.modalsCount === 1) {
- this.removeBackdrop();
- if (isBackdropEnabled && isBackdropInDOM) {
- this._backdropLoader
- .attach(ModalBackdropComponent)
- .to('body')
- .show({ isAnimated: this.config.animated });
- this.backdropRef = this._backdropLoader._componentRef;
- }
- }
- }
- /**
- * @return {?}
- */
- _hideBackdrop() {
- if (!this.backdropRef) {
- return;
- }
- this.backdropRef.instance.isShown = false;
- /** @type {?} */
- const duration = this.config.animated ? TRANSITION_DURATIONS.BACKDROP : 0;
- setTimeout((/**
- * @return {?}
- */
- () => this.removeBackdrop()), duration);
- }
- // tslint:disable-next-line:no-any
- /**
- * @param {?} content
- * @return {?}
- */
- _showModal(content) {
- /** @type {?} */
- const modalLoader = this.loaders[this.loaders.length - 1];
- /** @type {?} */
- const bsModalRef = new BsModalRef();
- /** @type {?} */
- const modalContainerRef = modalLoader
- .provide({ provide: ModalOptions, useValue: this.config })
- .provide({ provide: BsModalRef, useValue: bsModalRef })
- .attach(ModalContainerComponent)
- .to('body')
- .show({ content, isAnimated: this.config.animated, initialState: this.config.initialState, bsModalService: this });
- modalContainerRef.instance.level = this.getModalsCount();
- bsModalRef.hide = (/**
- * @return {?}
- */
- () => {
- modalContainerRef.instance.hide();
- });
- bsModalRef.content = modalLoader.getInnerComponent() || null;
- bsModalRef.setClass = (/**
- * @param {?} newClass
- * @return {?}
- */
- (newClass) => {
- modalContainerRef.instance.config.class = newClass;
- });
- return bsModalRef;
- }
- /**
- * @param {?} level
- * @return {?}
- */
- _hideModal(level) {
- /** @type {?} */
- const modalLoader = this.loaders[level - 1];
- if (modalLoader) {
- modalLoader.hide();
- }
- }
- /**
- * @return {?}
- */
- getModalsCount() {
- return this.modalsCount;
- }
- /**
- * @param {?} reason
- * @return {?}
- */
- setDismissReason(reason) {
- this.lastDismissReason = reason;
- }
- /**
- * @return {?}
- */
- removeBackdrop() {
- this._backdropLoader.hide();
- this.backdropRef = null;
- }
- /** AFTER PR MERGE MODAL.COMPONENT WILL BE USING THIS CODE */
- /** Scroll bar tricks */
- /**
- * \@internal
- * @return {?}
- */
- checkScrollbar() {
- this.isBodyOverflowing = document.body.clientWidth < window.innerWidth;
- this.scrollbarWidth = this.getScrollbarWidth();
- }
- /**
- * @return {?}
- */
- setScrollbar() {
- if (!document) {
- return;
- }
- this.originalBodyPadding = parseInt(window
- .getComputedStyle(document.body)
- .getPropertyValue('padding-right') || '0', 10);
- if (this.isBodyOverflowing) {
- document.body.style.paddingRight = `${this.originalBodyPadding +
- this.scrollbarWidth}px`;
- }
- }
- /**
- * @private
- * @return {?}
- */
- resetScrollbar() {
- document.body.style.paddingRight = `${this.originalBodyPadding}px`;
- }
- // thx d.walsh
- /**
- * @private
- * @return {?}
- */
- getScrollbarWidth() {
- /** @type {?} */
- const scrollDiv = this._renderer.createElement('div');
- this._renderer.addClass(scrollDiv, CLASS_NAME.SCROLLBAR_MEASURER);
- this._renderer.appendChild(document.body, scrollDiv);
- /** @type {?} */
- const scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;
- this._renderer.removeChild(document.body, scrollDiv);
- return scrollbarWidth;
- }
- /**
- * @private
- * @return {?}
- */
- _createLoaders() {
- /** @type {?} */
- const loader = this.clf.createLoader(null, null, null);
- this.copyEvent(loader.onBeforeShow, this.onShow);
- this.copyEvent(loader.onShown, this.onShown);
- this.copyEvent(loader.onBeforeHide, this.onHide);
- this.copyEvent(loader.onHidden, this.onHidden);
- this.loaders.push(loader);
- }
- /**
- * @private
- * @param {?} level
- * @return {?}
- */
- removeLoaders(level) {
- this.loaders.splice(level - 1, 1);
- this.loaders.forEach((/**
- * @param {?} loader
- * @param {?} i
- * @return {?}
- */
- (loader, i) => {
- loader.instance.level = i + 1;
- }));
- }
- // tslint:disable-next-line:no-any
- /**
- * @private
- * @param {?} from
- * @param {?} to
- * @return {?}
- */
- copyEvent(from, to) {
- from.subscribe((/**
- * @return {?}
- */
- () => {
- to.emit(this.lastDismissReason);
- }));
- }
- }
- BsModalService.decorators = [
- { type: Injectable }
- ];
- /** @nocollapse */
- BsModalService.ctorParameters = () => [
- { type: RendererFactory2 },
- { type: ComponentLoaderFactory }
- ];
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- class ModalModule {
- /**
- * @return {?}
- */
- static forRoot() {
- return {
- ngModule: ModalModule,
- providers: [BsModalService, ComponentLoaderFactory, PositioningService]
- };
- }
- }
- ModalModule.decorators = [
- { type: NgModule, args: [{
- declarations: [
- ModalBackdropComponent,
- ModalDirective,
- ModalContainerComponent
- ],
- exports: [ModalBackdropComponent, ModalDirective],
- entryComponents: [ModalBackdropComponent, ModalContainerComponent]
- },] }
- ];
- export { BsModalRef, BsModalService, ModalBackdropComponent, ModalBackdropOptions, ModalContainerComponent, ModalDirective, ModalModule, ModalOptions, CLASS_NAME as ɵa };
- //# sourceMappingURL=ngx-bootstrap-modal.js.map
|