UNPKG

@nepwork/dashboards

Version:

Dashboards for emergencies and monitoring

196 lines 8.13 kB
import { __decorate, __metadata, __param } from "tslib"; import { ComponentFactoryResolver, Inject, Injectable, Injector, TemplateRef, } from '@angular/core'; import { filter } from 'rxjs/operators'; import { NbComponentPortal, NbOverlayPositionBuilder, } from '../cdk/overlay/mapping'; import { NbOverlayService } from '../cdk/overlay/overlay-service'; import { NbBlockScrollStrategyAdapter } from '../cdk/adapter/block-scroll-strategy-adapter'; import { NB_WINDOW_CONFIG, NB_WINDOW_CONTENT, NB_WINDOW_CONTEXT, NbWindowConfig, NbWindowState, } from './window.options'; import { NbWindowRef } from './window-ref'; import { NbWindowsContainerComponent } from './windows-container.component'; import { NbWindowComponent } from './window.component'; import { NB_DOCUMENT } from '../../theme.options'; /** * The `NbWindowService` can be used to open windows. * * @stacked-example(Showcase, window/window-showcase.component) * * ### Installation * * Import `NbWindowModule` to your app module. * ```ts * @NgModule({ * imports: [ * // ... * NbWindowModule.forRoot(config), * ], * }) * export class AppModule { } * ``` * * If you are using it in a lazy loaded module than you have to install `NbWindowModule.forChild`: * ```ts * @NgModule({ * imports: [ * // ... * NbWindowModule.forChild(config), * ], * }) * export class LazyLoadedModule { } * ``` * * ### Usage * * A new window can be opened by calling the `open` method with a component or template to be loaded * and an optional configuration. * `open` method will return `NbWindowRef` that can be used for the further manipulations. * * ```ts * const windowRef = this.windowService.open(MyComponent, { ... }); * ``` * * `NbWindowRef` gives you ability manipulate opened window. * Also, you can inject `NbWindowRef` inside provided component which rendered in window. * * ```ts * this.windowService.open(MyWindowComponent, { ... }); * * // my.component.ts * constructor(protected windowRef: NbWindowRef) { * } * * minimize() { * this.windowRef.minimize(); * } * * close() { * this.windowRef.close(); * } * ``` * * Instead of component you can create window from TemplateRef. As usual you can access context provided via config * via `let-` variables. Also you can get reference to the `NbWindowRef` in context's `windowRef` property. * * @stacked-example(Window content from TemplateRef, window/template-window.component) * * ### Configuration * * As mentioned above, `open` method of the `NbWindowService` may receive optional configuration options. * Also, you can modify default windows configuration through `NbWindowModule.forRoot({ ... })`. * You can read about all available options on [API tab](docs/components/window/api#nbwindowconfig). * * @stacked-example(Configuration, window/windows-backdrop.component) */ var NbWindowService = /** @class */ (function () { function NbWindowService(componentFactoryResolver, overlayService, overlayPositionBuilder, blockScrollStrategy, defaultWindowsConfig, cfr, document) { this.componentFactoryResolver = componentFactoryResolver; this.overlayService = overlayService; this.overlayPositionBuilder = overlayPositionBuilder; this.blockScrollStrategy = blockScrollStrategy; this.defaultWindowsConfig = defaultWindowsConfig; this.cfr = cfr; this.openWindows = []; this.document = document; } /** * Opens new window. * @param windowContent * @param windowConfig * */ NbWindowService.prototype.open = function (windowContent, windowConfig) { if (windowConfig === void 0) { windowConfig = {}; } if (this.shouldCreateWindowsContainer()) { this.createWindowsContainer(); } var config = new NbWindowConfig(this.defaultWindowsConfig, windowConfig); var windowRef = new NbWindowRef(config); windowRef.componentRef = this.appendWindow(windowContent, config, windowRef); this.openWindows.push(windowRef); this.subscribeToEvents(windowRef); return windowRef; }; NbWindowService.prototype.shouldCreateWindowsContainer = function () { if (this.windowsContainerViewRef) { var containerEl = this.windowsContainerViewRef.element.nativeElement; return !this.document.body.contains(containerEl); } return true; }; NbWindowService.prototype.createWindowsContainer = function () { if (this.overlayRef) { this.overlayRef.dispose(); } this.overlayRef = this.overlayService.create({ scrollStrategy: this.overlayService.scrollStrategies.noop(), positionStrategy: this.overlayPositionBuilder.global().bottom().right(), hasBackdrop: true, }); var windowsContainerPortal = new NbComponentPortal(NbWindowsContainerComponent, null, null, this.cfr); var overlayRef = this.overlayRef.attach(windowsContainerPortal); this.windowsContainerViewRef = overlayRef.instance.viewContainerRef; }; NbWindowService.prototype.appendWindow = function (content, config, windowRef) { var context = content instanceof TemplateRef ? { $implicit: config.context, windowRef: windowRef } : config.context; var providers = [ { provide: NB_WINDOW_CONTENT, useValue: content }, { provide: NB_WINDOW_CONTEXT, useValue: context }, { provide: NbWindowConfig, useValue: config }, { provide: NbWindowRef, useValue: windowRef }, ]; var parentInjector = config.viewContainerRef ? config.viewContainerRef.injector : this.windowsContainerViewRef.injector; var injector = Injector.create({ parent: parentInjector, providers: providers }); var windowFactory = this.componentFactoryResolver.resolveComponentFactory(NbWindowComponent); var ref = this.windowsContainerViewRef.createComponent(windowFactory, null, injector); ref.instance.cfr = this.cfr; ref.changeDetectorRef.detectChanges(); return ref; }; NbWindowService.prototype.subscribeToEvents = function (windowRef) { var _this = this; if (windowRef.config.closeOnBackdropClick) { this.overlayRef.backdropClick().subscribe(function () { return windowRef.close(); }); } if (windowRef.config.closeOnEsc) { this.overlayRef.keydownEvents() .pipe(filter(function (event) { return event.keyCode === 27; })) .subscribe(function () { return windowRef.close(); }); } windowRef.stateChange.subscribe(function () { return _this.checkAndUpdateOverlay(); }); windowRef.onClose.subscribe(function () { _this.openWindows.splice(_this.openWindows.indexOf(windowRef), 1); _this.checkAndUpdateOverlay(); }); }; NbWindowService.prototype.checkAndUpdateOverlay = function () { var fullScreenWindows = this.openWindows.filter(function (w) { return w.state === NbWindowState.FULL_SCREEN; }); if (fullScreenWindows.length > 0) { this.blockScrollStrategy.enable(); } else { this.blockScrollStrategy.disable(); } if (fullScreenWindows.some(function (w) { return w.config.hasBackdrop; })) { this.overlayRef.backdropElement.removeAttribute('hidden'); } else { this.overlayRef.backdropElement.setAttribute('hidden', ''); } }; NbWindowService = __decorate([ Injectable(), __param(4, Inject(NB_WINDOW_CONFIG)), __param(6, Inject(NB_DOCUMENT)), __metadata("design:paramtypes", [ComponentFactoryResolver, NbOverlayService, NbOverlayPositionBuilder, NbBlockScrollStrategyAdapter, NbWindowConfig, ComponentFactoryResolver, Object]) ], NbWindowService); return NbWindowService; }()); export { NbWindowService }; //# sourceMappingURL=window.service.js.map