UNPKG

@addapptables/notifier

Version:
1,282 lines (1,260 loc) 42.5 kB
import { style, trigger, transition, animate, keyframes } from '@angular/animations'; import { Subject, interval } from 'rxjs'; import { filter, take, takeUntil, tap } from 'rxjs/operators'; import { InjectionToken, EventEmitter, TemplateRef, Component, ChangeDetectionStrategy, ViewEncapsulation, Inject, ComponentFactoryResolver, ViewChild, HostListener, Injectable, ɵɵdefineInjectable, ɵɵinject, ApplicationRef, Injector, NgModule } from '@angular/core'; import { PortalInjector, DomPortalOutlet, ComponentPortal } from '@angular/cdk/portal'; import { DynamicDirective, CoreModule } from '@addapptables/core'; import { DOCUMENT, CommonModule } from '@angular/common'; import { __extends } from 'tslib'; /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** @type {?} */ var slideInDown = [ style({ transform: 'translate3d(0,-100%, 0)', visibility: 'visible', offset: 0 }), style({ transform: 'translate3d(0, 0, 0)', offset: 1 }) ]; /** @type {?} */ var zoomOut = [ style({ opacity: 1, offset: 0 }), style({ transform: 'scale3d(0.3, 0.3, 0.3)', offset: .5 }), style({ opacity: 0, offset: 1 }) ]; /** @type {?} */ var slideInUp = [ style({ transform: 'translate3d(0, 100%, 0)', visibility: 'visible', offset: 0 }), style({ transform: 'translate3d(0, 0, 0)', offset: 1 }) ]; /** @type {?} */ var notifierAnimation = { notifierAnimator: notifierTriggerAnimation() }; /** * @return {?} */ function notifierTriggerAnimation() { return trigger('notifierAnimator', [ transition('* => slideInUp', animate(150, keyframes(slideInUp))), transition('* => slideInDown', animate(150, keyframes(slideInDown))), transition('* => exit', animate(150, keyframes(zoomOut))) ]); } /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** @type {?} */ var NOTIFIER = 'addapptable-notifier-'; /** @type {?} */ var NOTIFIER_CONTAINER = 'addapptable-notifier-container'; /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ var NotifierConfiguration = /** @class */ (function () { function NotifierConfiguration() { } return NotifierConfiguration; }()); if (false) { /** @type {?} */ NotifierConfiguration.prototype.position; /** @type {?} */ NotifierConfiguration.prototype.iconValue; /** @type {?} */ NotifierConfiguration.prototype.classIcon; /** @type {?} */ NotifierConfiguration.prototype.timeout; } /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** @enum {number} */ var NotifierPositionType = { topRight: 0, topLeft: 1, bottomRight: 2, bottomLeft: 3, }; NotifierPositionType[NotifierPositionType.topRight] = 'topRight'; NotifierPositionType[NotifierPositionType.topLeft] = 'topLeft'; NotifierPositionType[NotifierPositionType.bottomRight] = 'bottomRight'; NotifierPositionType[NotifierPositionType.bottomLeft] = 'bottomLeft'; /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** @enum {string} */ var NotifierType = { primary: 'addapptable-notifier-primary', accent: 'addapptable-notifier-accent', success: 'addapptable-notifier-success', warning: 'addapptable-notifier-warning', danger: 'addapptable-notifier-danger', info: 'addapptable-notifier-info', }; /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** * @template D, T */ var /** * @template D, T */ Notifier = /** @class */ (function () { function Notifier() { } return Notifier; }()); if (false) { /** @type {?} */ Notifier.prototype.message; /** @type {?} */ Notifier.prototype.type; /** @type {?} */ Notifier.prototype.data; /** @type {?} */ Notifier.prototype.templateOrComponent; } /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ var NotifierRef = /** @class */ (function () { function NotifierRef(component, portal, document, id) { this._afterClose = new Subject(); this._component = component; this._portal = portal; this._component._id = id; this._document = document; this._component._close.subscribe(this.close.bind(this)); } Object.defineProperty(NotifierRef.prototype, "component", { get: /** * @return {?} */ function () { return this._component; }, enumerable: true, configurable: true }); /** * @return {?} */ NotifierRef.prototype.afterClosed = /** * @return {?} */ function () { return this._afterClose.asObservable(); }; /** * @return {?} */ NotifierRef.prototype.close = /** * @return {?} */ function () { var _this = this; this._component._animationStateChanged.pipe(filter((/** * @param {?} x * @return {?} */ function (x) { return x.phaseName === 'done'; })), take(1)) .subscribe((/** * @return {?} */ function () { _this._afterClose.next(_this._component._id); _this._afterClose.complete(); _this._destroyPortal(); })); this._component.startExitAnimation(); }; /** * @param {?} style * @return {?} */ NotifierRef.prototype.changedStyle = /** * @param {?} style * @return {?} */ function (style) { this._component._style = style; }; /** * @private * @return {?} */ NotifierRef.prototype._destroyPortal = /** * @private * @return {?} */ function () { /** @type {?} */ var componentContainer = this._document.getElementById(this._component._id); this._portal.detach(); componentContainer && componentContainer.parentNode.removeChild(componentContainer); }; return NotifierRef; }()); if (false) { /** * @type {?} * @private */ NotifierRef.prototype._component; /** * @type {?} * @private */ NotifierRef.prototype._portal; /** * @type {?} * @private */ NotifierRef.prototype._document; /** * @type {?} * @private */ NotifierRef.prototype._afterClose; } /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** @type {?} */ var ADDAPPTABLE_CONFIGURATION_NOTIFIER_DATA = new InjectionToken('AddapptableConfigurationNotifierData'); /** @type {?} */ var ADDAPPTABLE_NOTIFIER_DATA = new InjectionToken('ADDAPPTABLE_NOTIFIER'); /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ var NotifierComponent = /** @class */ (function () { function NotifierComponent(configuration, data, componentFactoryResolver) { this.data = data; this.componentFactoryResolver = componentFactoryResolver; this._state = 'slideInUp'; this._close = new EventEmitter(); this._animationStateChanged = new EventEmitter(); this._style = {}; this.subject = new Subject(); this.seconds = interval(5000); this.configuration = { position: NotifierPositionType.bottomRight, timeout: 5000, classIcon: 'material-icons', iconValue: 'notifications' }; this.configuration = Object.assign({ position: NotifierPositionType.bottomRight, timeout: 5000, classIcon: 'material-icons', iconValue: 'notifications' }, configuration); this.seconds = interval(this.configuration.timeout); } /** * @return {?} */ NotifierComponent.prototype.ngOnInit = /** * @return {?} */ function () { if (this.data.templateOrComponent) { this.resolveComponent(this.data.templateOrComponent, this.appDynamic.viewContainerRef); } }; /** * @return {?} */ NotifierComponent.prototype.ngAfterViewInit = /** * @return {?} */ function () { this._timeOut(); }; /** * @return {?} */ NotifierComponent.prototype.onMouseOver = /** * @return {?} */ function () { this.subject.next(); this.subject.complete(); }; /** * @return {?} */ NotifierComponent.prototype.onMouseLeave = /** * @return {?} */ function () { this.subject = new Subject(); this._timeOut(); }; /** * @private * @return {?} */ NotifierComponent.prototype._timeOut = /** * @private * @return {?} */ function () { var _this = this; this.seconds.pipe(takeUntil(this.subject), take(1), tap((/** * @return {?} */ function () { return _this.close(); }))).subscribe(); }; /** * @return {?} */ NotifierComponent.prototype.close = /** * @return {?} */ function () { this._close.emit(); }; /** * @return {?} */ NotifierComponent.prototype.startExitAnimation = /** * @return {?} */ function () { this._state = 'exit'; }; /** * @private * @param {?} component * @param {?} viewContainerRef * @return {?} */ NotifierComponent.prototype.resolveComponent = /** * @private * @param {?} component * @param {?} viewContainerRef * @return {?} */ function (component, viewContainerRef) { if (!component) { return; } viewContainerRef.clear(); if (component instanceof TemplateRef) { viewContainerRef.createEmbeddedView(component, { $implicit: this.data }); } else { /** @type {?} */ var componentFactory = component && this.componentFactoryResolver.resolveComponentFactory(component); /** @type {?} */ var injector = this.createInjector(viewContainerRef.injector); viewContainerRef.createComponent(componentFactory, null, injector); } }; /** * @private * @param {?} injector * @return {?} */ NotifierComponent.prototype.createInjector = /** * @private * @param {?} injector * @return {?} */ function (injector) { /** @type {?} */ var injectionTokens = new WeakMap([ [ADDAPPTABLE_NOTIFIER_DATA, this.data] ]); return new PortalInjector(injector, injectionTokens); }; /** * @return {?} */ NotifierComponent.prototype.ngOnDestroy = /** * @return {?} */ function () { this.subject.next(); this.subject.complete(); }; NotifierComponent.decorators = [ { type: Component, args: [{ selector: 'addapptable-notifier', template: "<div [class]=\"'addapptable-notifier '+ data.type\" [@notifierAnimator]=\"_state\" (@notifierAnimator.start)=\"_animationStateChanged.emit($event)\"\n (@notifierAnimator.done)=\"_animationStateChanged.emit($event)\" [ngStyle]=\"_style\">\n <i *ngIf=\"configuration.classIcon\" [class]=\"configuration.classIcon\">{{configuration.iconValue}}</i>\n <button type=\"button\" (click)=\"close()\">x</button>\n <span class=\"message\">\n <ng-template addapptablesDynamic></ng-template>\n <span *ngIf=\"!data.templateOrComponent\">{{data.message}}</span>\n </span>\n</div>", changeDetection: ChangeDetectionStrategy.Default, animations: [notifierAnimation.notifierAnimator], encapsulation: ViewEncapsulation.None, styles: [".addapptable-notifier{margin:1em;display:inline-block;position:fixed;z-index:1031;border-radius:3px;transition:.19s ease-in-out}.addapptable-notifier-success{background-color:#5cb85c;color:#5cb85c}.addapptable-notifier-info{background-color:#20a9d2;color:#20a9d2}.addapptable-notifier-warning{background-color:#e09d3d;color:#e09d3d}.addapptable-notifier-danger{background-color:#d43934;color:#d43934}.addapptable-notifier>i{display:block;left:15px;position:absolute;margin-top:-26px;font-size:20px;background-color:#fff!important;padding:9px;border-radius:50%;max-width:38px;box-shadow:0 16px 38px -12px rgba(0,0,0,.56),0 4px 25px 0 rgba(0,0,0,.12),0 8px 10px -5px rgba(0,0,0,.2)}.addapptable-notifier>button{float:right;min-width:auto;color:#fff!important;text-shadow:none;opacity:.9;box-sizing:border-box;position:relative;cursor:pointer;outline:0;border:none;white-space:nowrap;text-decoration:none;vertical-align:baseline;text-align:center;margin:0;line-height:36px;padding:0 16px;border-radius:4px;overflow:visible;background-color:transparent}.addapptable-notifier .message{display:block;color:#fff;min-width:376px;max-width:500px;padding:1.5em;text-align:justify}"] }] } ]; /** @nocollapse */ NotifierComponent.ctorParameters = function () { return [ { type: NotifierConfiguration, decorators: [{ type: Inject, args: [ADDAPPTABLE_CONFIGURATION_NOTIFIER_DATA,] }] }, { type: Notifier, decorators: [{ type: Inject, args: [ADDAPPTABLE_NOTIFIER_DATA,] }] }, { type: ComponentFactoryResolver } ]; }; NotifierComponent.propDecorators = { appDynamic: [{ type: ViewChild, args: [DynamicDirective, { static: true },] }], onMouseOver: [{ type: HostListener, args: ['mouseover',] }], onMouseLeave: [{ type: HostListener, args: ['mouseleave',] }] }; return NotifierComponent; }()); if (false) { /** @type {?} */ NotifierComponent.prototype._id; /** @type {?} */ NotifierComponent.prototype._state; /** @type {?} */ NotifierComponent.prototype._close; /** @type {?} */ NotifierComponent.prototype._animationStateChanged; /** @type {?} */ NotifierComponent.prototype._style; /** @type {?} */ NotifierComponent.prototype.subject; /** @type {?} */ NotifierComponent.prototype.seconds; /** @type {?} */ NotifierComponent.prototype.configuration; /** @type {?} */ NotifierComponent.prototype.appDynamic; /** @type {?} */ NotifierComponent.prototype.data; /** * @type {?} * @private */ NotifierComponent.prototype.componentFactoryResolver; } /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ var NotifierContainerService = /** @class */ (function () { function NotifierContainerService(_document) { this._document = _document; } /** * @return {?} */ NotifierContainerService.prototype.getContainerElement = /** * @return {?} */ function () { if (!this._containerElement) { this._createContainer(); } return this._containerElement; }; /** * @protected * @return {?} */ NotifierContainerService.prototype._createContainer = /** * @protected * @return {?} */ function () { /** @type {?} */ var container = this._document.createElement('div'); container.classList.add(NOTIFIER_CONTAINER); this._document.body.appendChild(container); this._containerElement = container; }; /** * @return {?} */ NotifierContainerService.prototype.ngOnDestroy = /** * @return {?} */ function () { if (this._containerElement && this._containerElement.parentNode) { this._containerElement.parentNode.removeChild(this._containerElement); } }; NotifierContainerService.decorators = [ { type: Injectable, args: [{ providedIn: 'root' },] } ]; /** @nocollapse */ NotifierContainerService.ctorParameters = function () { return [ { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] } ]; }; /** @nocollapse */ NotifierContainerService.ngInjectableDef = ɵɵdefineInjectable({ factory: function NotifierContainerService_Factory() { return new NotifierContainerService(ɵɵinject(DOCUMENT)); }, token: NotifierContainerService, providedIn: "root" }); return NotifierContainerService; }()); if (false) { /** * @type {?} * @protected */ NotifierContainerService.prototype._containerElement; /** * @type {?} * @protected */ NotifierContainerService.prototype._document; } /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** @type {?} */ var nextUniqueId = 0; var NotifierPortalService = /** @class */ (function () { function NotifierPortalService(_notifierContainerService, _document, _injector, _componentFactoryResolver) { this._notifierContainerService = _notifierContainerService; this._document = _document; this._injector = _injector; this._componentFactoryResolver = _componentFactoryResolver; } /** * @return {?} */ NotifierPortalService.prototype.create = /** * @return {?} */ function () { /** @type {?} */ var pane = this._createPaneElement(); /** @type {?} */ var portal = this._createPortalOutlet(pane); return portal; }; /** * @private * @param {?} pane * @return {?} */ NotifierPortalService.prototype._createPortalOutlet = /** * @private * @param {?} pane * @return {?} */ function (pane) { if (!this._appRef) { this._appRef = this._injector.get(ApplicationRef); } return new DomPortalOutlet(pane, this._componentFactoryResolver, this._appRef, this._injector); }; /** * @private * @return {?} */ NotifierPortalService.prototype._createPaneElement = /** * @private * @return {?} */ function () { /** @type {?} */ var pane = this._document.createElement('div'); pane.id = "" + (NOTIFIER + nextUniqueId++); this._notifierContainerService.getContainerElement().appendChild(pane); return pane; }; Object.defineProperty(NotifierPortalService.prototype, "getLastUniqueId", { get: /** * @return {?} */ function () { return "" + (NOTIFIER + (nextUniqueId - 1)); }, enumerable: true, configurable: true }); NotifierPortalService.decorators = [ { type: Injectable } ]; /** @nocollapse */ NotifierPortalService.ctorParameters = function () { return [ { type: NotifierContainerService }, { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }, { type: Injector }, { type: ComponentFactoryResolver } ]; }; return NotifierPortalService; }()); if (false) { /** * @type {?} * @private */ NotifierPortalService.prototype._appRef; /** * @type {?} * @private */ NotifierPortalService.prototype._notifierContainerService; /** * @type {?} * @private */ NotifierPortalService.prototype._document; /** * @type {?} * @private */ NotifierPortalService.prototype._injector; /** * @type {?} * @private */ NotifierPortalService.prototype._componentFactoryResolver; } /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** * @abstract */ var AbstractStrategy = /** @class */ (function () { function AbstractStrategy(_document) { this._document = _document; this.notifiers = []; this.margin = 30; this.maxNotifiers = 5; this.notifiers = []; } /** * @param {?} notifierRef * @return {?} */ AbstractStrategy.prototype.newNotifier = /** * @param {?} notifierRef * @return {?} */ function (notifierRef) { var _this = this; notifierRef.afterClosed().pipe(take(1)).subscribe(this.deletePortal.bind(this)); notifierRef.changedStyle(this.getStyleNewNotifier(notifierRef)); setTimeout((/** * @return {?} */ function () { if (_this.notifiers.length >= _this.maxNotifiers) { /** @type {?} */ var notifier = _this.notifiers.shift(); notifier.close(); } /** @type {?} */ var element = _this._document.querySelector("#" + notifierRef.component._id + " > addapptable-notifier > .addapptable-notifier"); _this.notifiers.forEach((/** * @param {?} notifier * @return {?} */ function (notifier) { /** @type {?} */ var elementNotifier = _this._document .querySelector("#" + notifier.component._id + " > addapptable-notifier > .addapptable-notifier"); notifier.changedStyle(_this.getStyleNotifierPosition(elementNotifier, element.clientHeight)); })); _this.notifiers.push(notifierRef); })); }; /** * @private * @param {?} id * @return {?} */ AbstractStrategy.prototype.deletePortal = /** * @private * @param {?} id * @return {?} */ function (id) { /** @type {?} */ var notifier = this.notifiers.findIndex((/** * @param {?} x * @return {?} */ function (x) { return x.component._id === id; })); if (notifier >= 0) { /** @type {?} */ var element = this._document .querySelector("#" + this.notifiers[notifier].component._id + " > addapptable-notifier > .addapptable-notifier"); /** @type {?} */ var clientHeightElementDelete = element.clientHeight; this.notifiers.splice(notifier, 1); for (var index = notifier - 1; index >= 0; index--) { /** @type {?} */ var notifierStyle = this.notifiers[index]; /** @type {?} */ var elementChange = this._document .querySelector("#" + notifierStyle.component._id + " > addapptable-notifier > .addapptable-notifier"); notifierStyle.changedStyle(this.getStyleDeleteNotifier(elementChange, clientHeightElementDelete)); } } }; /** * @return {?} */ AbstractStrategy.prototype.ngOnDestroy = /** * @return {?} */ function () { this.notifiers.forEach((/** * @param {?} notifier * @return {?} */ function (notifier) { notifier.close(); })); }; /** @nocollapse */ AbstractStrategy.ctorParameters = function () { return [ { type: HTMLDocument, decorators: [{ type: Inject, args: [DOCUMENT,] }] } ]; }; return AbstractStrategy; }()); if (false) { /** @type {?} */ AbstractStrategy.prototype.notifiers; /** @type {?} */ AbstractStrategy.prototype.margin; /** @type {?} */ AbstractStrategy.prototype.maxNotifiers; /** * @type {?} * @private */ AbstractStrategy.prototype._document; /** * @abstract * @protected * @param {?} notifierRef * @return {?} */ AbstractStrategy.prototype.getStyleNewNotifier = function (notifierRef) { }; /** * @abstract * @protected * @param {?} divNotifier * @param {?} clientHeight * @return {?} */ AbstractStrategy.prototype.getStyleNotifierPosition = function (divNotifier, clientHeight) { }; /** * @abstract * @protected * @param {?} elementChange * @param {?} clientHeightElementDelete * @return {?} */ AbstractStrategy.prototype.getStyleDeleteNotifier = function (elementChange, clientHeightElementDelete) { }; } /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ var BottomRightStrategy = /** @class */ (function (_super) { __extends(BottomRightStrategy, _super); function BottomRightStrategy() { return _super !== null && _super.apply(this, arguments) || this; } /** * @protected * @param {?} notifierRef * @return {?} */ BottomRightStrategy.prototype.getStyleNewNotifier = /** * @protected * @param {?} notifierRef * @return {?} */ function (notifierRef) { notifierRef.component._state = 'slideInUp'; return { bottom: "0px", right: '0px' }; }; /** * @protected * @param {?} divNotifier * @param {?} clientHeight * @return {?} */ BottomRightStrategy.prototype.getStyleNotifierPosition = /** * @protected * @param {?} divNotifier * @param {?} clientHeight * @return {?} */ function (divNotifier, clientHeight) { /** @type {?} */ var lastValueBottom = Number(divNotifier.style.bottom.replace('px', '')); return { bottom: clientHeight + lastValueBottom + this.margin + "px", right: '0px' }; }; /** * @protected * @param {?} elementChange * @param {?} clientHeightElementDelete * @return {?} */ BottomRightStrategy.prototype.getStyleDeleteNotifier = /** * @protected * @param {?} elementChange * @param {?} clientHeightElementDelete * @return {?} */ function (elementChange, clientHeightElementDelete) { /** @type {?} */ var valueBottomChange = Number(elementChange.style.bottom.replace('px', '')); return { bottom: valueBottomChange - clientHeightElementDelete - this.margin + "px", right: '0px' }; }; BottomRightStrategy.decorators = [ { type: Injectable } ]; return BottomRightStrategy; }(AbstractStrategy)); /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ var TopRightStrategy = /** @class */ (function (_super) { __extends(TopRightStrategy, _super); function TopRightStrategy() { return _super !== null && _super.apply(this, arguments) || this; } /** * @protected * @param {?} notifierRef * @return {?} */ TopRightStrategy.prototype.getStyleNewNotifier = /** * @protected * @param {?} notifierRef * @return {?} */ function (notifierRef) { notifierRef.component._state = 'slideInDown'; return { top: "20px", right: '0px' }; }; /** * @protected * @param {?} divNotifier * @param {?} clientHeight * @return {?} */ TopRightStrategy.prototype.getStyleNotifierPosition = /** * @protected * @param {?} divNotifier * @param {?} clientHeight * @return {?} */ function (divNotifier, clientHeight) { /** @type {?} */ var lastValueBottom = Number(divNotifier.style.top.replace('px', '')); return { top: clientHeight + lastValueBottom + this.margin + "px", right: '0px' }; }; /** * @protected * @param {?} elementChange * @param {?} clientHeightElementDelete * @return {?} */ TopRightStrategy.prototype.getStyleDeleteNotifier = /** * @protected * @param {?} elementChange * @param {?} clientHeightElementDelete * @return {?} */ function (elementChange, clientHeightElementDelete) { /** @type {?} */ var valueBottomChange = Number(elementChange.style.top.replace('px', '')); return { top: valueBottomChange - clientHeightElementDelete - this.margin + "px", right: '0px' }; }; TopRightStrategy.decorators = [ { type: Injectable } ]; return TopRightStrategy; }(AbstractStrategy)); /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ var BottomLeftStrategy = /** @class */ (function (_super) { __extends(BottomLeftStrategy, _super); function BottomLeftStrategy() { return _super !== null && _super.apply(this, arguments) || this; } /** * @protected * @param {?} notifierRef * @return {?} */ BottomLeftStrategy.prototype.getStyleNewNotifier = /** * @protected * @param {?} notifierRef * @return {?} */ function (notifierRef) { notifierRef.component._state = 'slideInUp'; return { bottom: "0px", left: '0px' }; }; /** * @protected * @param {?} divNotifier * @param {?} clientHeight * @return {?} */ BottomLeftStrategy.prototype.getStyleNotifierPosition = /** * @protected * @param {?} divNotifier * @param {?} clientHeight * @return {?} */ function (divNotifier, clientHeight) { /** @type {?} */ var lastValueBottom = Number(divNotifier.style.bottom.replace('px', '')); return { bottom: clientHeight + lastValueBottom + this.margin + "px", left: '0px' }; }; /** * @protected * @param {?} elementChange * @param {?} clientHeightElementDelete * @return {?} */ BottomLeftStrategy.prototype.getStyleDeleteNotifier = /** * @protected * @param {?} elementChange * @param {?} clientHeightElementDelete * @return {?} */ function (elementChange, clientHeightElementDelete) { /** @type {?} */ var valueBottomChange = Number(elementChange.style.bottom.replace('px', '')); return { bottom: valueBottomChange - clientHeightElementDelete - this.margin + "px", left: '0px' }; }; BottomLeftStrategy.decorators = [ { type: Injectable } ]; return BottomLeftStrategy; }(AbstractStrategy)); /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ var TopLeftStrategy = /** @class */ (function (_super) { __extends(TopLeftStrategy, _super); function TopLeftStrategy() { return _super !== null && _super.apply(this, arguments) || this; } /** * @protected * @param {?} notifierRef * @return {?} */ TopLeftStrategy.prototype.getStyleNewNotifier = /** * @protected * @param {?} notifierRef * @return {?} */ function (notifierRef) { notifierRef.component._state = 'slideInDown'; return { top: "20px", left: '0px' }; }; /** * @protected * @param {?} divNotifier * @param {?} clientHeight * @return {?} */ TopLeftStrategy.prototype.getStyleNotifierPosition = /** * @protected * @param {?} divNotifier * @param {?} clientHeight * @return {?} */ function (divNotifier, clientHeight) { /** @type {?} */ var lastValueBottom = Number(divNotifier.style.top.replace('px', '')); return { top: clientHeight + lastValueBottom + this.margin + "px", left: '0px' }; }; /** * @protected * @param {?} elementChange * @param {?} clientHeightElementDelete * @return {?} */ TopLeftStrategy.prototype.getStyleDeleteNotifier = /** * @protected * @param {?} elementChange * @param {?} clientHeightElementDelete * @return {?} */ function (elementChange, clientHeightElementDelete) { /** @type {?} */ var valueBottomChange = Number(elementChange.style.top.replace('px', '')); return { top: valueBottomChange - clientHeightElementDelete - this.margin + "px", left: '0px' }; }; TopLeftStrategy.decorators = [ { type: Injectable } ]; return TopLeftStrategy; }(AbstractStrategy)); /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ var NotifierService = /** @class */ (function () { function NotifierService(_notifierPortalService, _injector, _document, configuration) { this._notifierPortalService = _notifierPortalService; this._injector = _injector; this._document = _document; this.defaultConfiguration = { position: NotifierPositionType.bottomRight, timeout: 5000, classIcon: 'material-icons', iconValue: 'notifications' }; this.defaultConfiguration = Object.assign(this.defaultConfiguration, configuration); } /** * @param {?} message * @param {?=} configuration * @return {?} */ NotifierService.prototype.openSuccess = /** * @param {?} message * @param {?=} configuration * @return {?} */ function (message, configuration) { if (configuration === void 0) { configuration = (/** @type {?} */ ({})); } return this.open({ message: message, type: NotifierType.success }, configuration); }; /** * @param {?} message * @param {?=} configuration * @return {?} */ NotifierService.prototype.openError = /** * @param {?} message * @param {?=} configuration * @return {?} */ function (message, configuration) { if (configuration === void 0) { configuration = (/** @type {?} */ ({})); } return this.open({ message: message, type: NotifierType.danger }, configuration); }; /** * @param {?} message * @param {?=} configuration * @return {?} */ NotifierService.prototype.openInfo = /** * @param {?} message * @param {?=} configuration * @return {?} */ function (message, configuration) { if (configuration === void 0) { configuration = (/** @type {?} */ ({})); } return this.open({ message: message, type: NotifierType.info }, configuration); }; /** * @param {?} message * @param {?=} configuration * @return {?} */ NotifierService.prototype.openWarning = /** * @param {?} message * @param {?=} configuration * @return {?} */ function (message, configuration) { if (configuration === void 0) { configuration = (/** @type {?} */ ({})); } return this.open({ message: message, type: NotifierType.warning }, configuration); }; /** * @param {?} data * @param {?=} configuration * @return {?} */ NotifierService.prototype.open = /** * @param {?} data * @param {?=} configuration * @return {?} */ function (data, configuration) { if (configuration === void 0) { configuration = (/** @type {?} */ ({})); } /** @type {?} */ var portal = this._notifierPortalService.create(); /** @type {?} */ var componentPortal = this._createComponentPortal(data); /** @type {?} */ var componentRef = portal.attach(componentPortal); /** @type {?} */ var notifierRef = new NotifierRef(componentRef.instance, portal, this._document, this._notifierPortalService.getLastUniqueId); /** @type {?} */ var mergeConfiguration = Object.assign(this.defaultConfiguration, configuration); this._factoryStrategy(mergeConfiguration).newNotifier(notifierRef); return notifierRef; }; /** * @private * @param {?} configuration * @return {?} */ NotifierService.prototype._factoryStrategy = /** * @private * @param {?} configuration * @return {?} */ function (configuration) { switch (configuration.position) { case NotifierPositionType.bottomRight: return this._injector.get(BottomRightStrategy); case NotifierPositionType.bottomLeft: return this._injector.get(BottomLeftStrategy); case NotifierPositionType.topLeft: return this._injector.get(TopLeftStrategy); case NotifierPositionType.topRight: return this._injector.get(TopRightStrategy); default: return this._injector.get(BottomRightStrategy); } }; /** * @private * @param {?} data * @return {?} */ NotifierService.prototype._createComponentPortal = /** * @private * @param {?} data * @return {?} */ function (data) { /** @type {?} */ var injectionTokens = new WeakMap([ [ADDAPPTABLE_NOTIFIER_DATA, data] ]); /** @type {?} */ var injector = new PortalInjector(this._injector, injectionTokens); return new ComponentPortal(NotifierComponent, null, injector); }; NotifierService.decorators = [ { type: Injectable } ]; /** @nocollapse */ NotifierService.ctorParameters = function () { return [ { type: NotifierPortalService }, { type: Injector }, { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }, { type: NotifierConfiguration, decorators: [{ type: Inject, args: [ADDAPPTABLE_CONFIGURATION_NOTIFIER_DATA,] }] } ]; }; return NotifierService; }()); if (false) { /** @type {?} */ NotifierService.prototype.defaultConfiguration; /** * @type {?} * @private */ NotifierService.prototype._notifierPortalService; /** * @type {?} * @private */ NotifierService.prototype._injector; /** * @type {?} * @private */ NotifierService.prototype._document; } /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ var NotifierModule = /** @class */ (function () { function NotifierModule() { } /** * @param {?=} config * @return {?} */ NotifierModule.forRoot = /** * @param {?=} config * @return {?} */ function (config) { if (config === void 0) { config = { position: NotifierPositionType.bottomRight, timeout: 5000, classIcon: 'material-icons', iconValue: 'notifications' }; } return { ngModule: NotifierModule, providers: [ { provide: ADDAPPTABLE_CONFIGURATION_NOTIFIER_DATA, useValue: config } ] }; }; NotifierModule.decorators = [ { type: NgModule, args: [{ declarations: [NotifierComponent], imports: [ CommonModule, CoreModule ], entryComponents: [NotifierComponent], providers: [ NotifierService, NotifierPortalService, BottomRightStrategy, TopRightStrategy, TopLeftStrategy, BottomLeftStrategy ] },] } ]; return NotifierModule; }()); /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ export { ADDAPPTABLE_CONFIGURATION_NOTIFIER_DATA, ADDAPPTABLE_NOTIFIER_DATA, NOTIFIER, NOTIFIER_CONTAINER, Notifier, NotifierComponent, NotifierConfiguration, NotifierContainerService, NotifierModule, NotifierPortalService, NotifierPositionType, NotifierRef, NotifierService, NotifierType, notifierAnimation, notifierTriggerAnimation, slideInDown, slideInUp, zoomOut, BottomRightStrategy as ɵa, AbstractStrategy as ɵb, TopRightStrategy as ɵc, TopLeftStrategy as ɵd, BottomLeftStrategy as ɵe }; //# sourceMappingURL=addapptables-notifier.js.map