ngx-notification
Version:
Angular Library to display all types of notifications in a Toast Notification format. Tested on Angular 6
153 lines (146 loc) • 13.5 kB
JavaScript
import { Injectable, Component, NgModule, defineInjectable } from '@angular/core';
import { Subject } from 'rxjs';
import { CommonModule } from '@angular/common';
import { BrowserModule } from '@angular/platform-browser';
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
var NgxNotificationService = /** @class */ (function () {
function NgxNotificationService() {
this.subject = new Subject();
}
/**
* @param {?} message
* @param {?} theme
* @param {?} position
* @return {?}
*/
NgxNotificationService.prototype.sendMessage = /**
* @param {?} message
* @param {?} theme
* @param {?} position
* @return {?}
*/
function (message, theme, position) {
this.subject.next({
text: message,
theme: theme,
position: position
});
};
/**
* @return {?}
*/
NgxNotificationService.prototype.clearMessage = /**
* @return {?}
*/
function () {
this.subject.next();
};
/**
* @return {?}
*/
NgxNotificationService.prototype.getMessage = /**
* @return {?}
*/
function () {
return this.subject.asObservable();
};
NgxNotificationService.decorators = [
{ type: Injectable, args: [{
providedIn: 'root'
},] },
];
/** @nocollapse */
NgxNotificationService.ctorParameters = function () { return []; };
/** @nocollapse */ NgxNotificationService.ngInjectableDef = defineInjectable({ factory: function NgxNotificationService_Factory() { return new NgxNotificationService(); }, token: NgxNotificationService, providedIn: "root" });
return NgxNotificationService;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
var NgxNotificationComponent = /** @class */ (function () {
function NgxNotificationComponent(ngxNotificationService) {
var _this = this;
this.ngxNotificationService = ngxNotificationService;
this.message = {};
this.subscription = this.ngxNotificationService.getMessage()
.subscribe(function (message) {
_this.show = true;
_this.message = message;
console.log(_this.message);
_this.autoHideMessage();
});
}
/**
* @return {?}
*/
NgxNotificationComponent.prototype.ngOnInit = /**
* @return {?}
*/
function () { };
/**
* @return {?}
*/
NgxNotificationComponent.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this.subscription.unsubscribe();
};
/**
* @return {?}
*/
NgxNotificationComponent.prototype.autoHideMessage = /**
* @return {?}
*/
function () {
var _this = this;
setTimeout(function () {
_this.show = false;
}, 5000);
};
NgxNotificationComponent.decorators = [
{ type: Component, args: [{
selector: 'lib-ngx-notification',
template: "<div *ngIf='show' class='ngx-notification {{ message.position }} {{ message.theme }} show'>{{message?.text }}</div>",
styles: ["\n .ngx-notification.dark {\n background-color: #2d2d30;\n border-color: #272729;\n color: #c9c9c9;\n }\n .ngx-notification.light {\n background-color: #ffffff;\n border-color: #cccccc;\n color: #2d2d30;\n }\n .ngx-notification.success {\n background-color: #dff0d8;\n border-color: #d0e9c6;\n color: #3c763d;\n }\n .ngx-notification.info {\n background-color: #d9edf7;\n border-color: #bcdff1;\n color: #31708f;\n }\n .ngx-notification.warning {\n background-color: #fcf8e3;\n border-color: #faf2cc;\n color: #8a6d3b;\n }\n .ngx-notification.danger {\n background-color: #f2dede;\n border-color: #ebcccc;\n color: #a94442;\n }\n .ngx-notification.top-left {\n position: fixed;\n left: 10px;\n top: 10px;\n }\n .ngx-notification.top-right {\n position: fixed;\n right: 10px;\n top: 10px;\n }\n .ngx-notification.bottom-right {\n position: fixed;\n right: 10px;\n bottom: 10px;\n }\n .ngx-notification.bottom-left {\n position: fixed;\n left: 10px;\n bottom: 10px;\n }\n .ngx-notification.center {\n position:absolute;\n top: 50%;\n left: 50%;\n margin-top: -9em;\n margin-left: -15em;\n }\n .ngx-notification {\n padding: .75rem 1.25rem;\n margin-bottom: 1rem;\n border: 1px solid transparent;\n border-radius: .25rem;\n -webkit-animation: fadein 1.5s, fadeout 1.5s 3.5s;\n animation: fadein 1.5s, fadeout 1.5s 3.5s;\n z-index : 1;\n }\n\n /* Animations to fade the snackbar in and out */\n @-webkit-keyframes fadein {\n from {opacity: 0;}\n to {opacity: 1;}\n }\n\n @keyframes fadein {\n from {opacity: 0;}\n to {opacity: 1;}\n }\n\n @-webkit-keyframes fadeout {\n from {opacity: 1;}\n to {opacity: 0;}\n }\n\n @keyframes fadeout {\n from {opacity: 1;}\n to {opacity: 0;}\n }\n "]
},] },
];
/** @nocollapse */
NgxNotificationComponent.ctorParameters = function () { return [
{ type: NgxNotificationService, },
]; };
return NgxNotificationComponent;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
var NgxNotificationModule = /** @class */ (function () {
function NgxNotificationModule() {
}
NgxNotificationModule.decorators = [
{ type: NgModule, args: [{
imports: [
CommonModule,
BrowserModule
],
declarations: [NgxNotificationComponent],
exports: [NgxNotificationComponent]
},] },
];
return NgxNotificationModule;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
export { NgxNotificationService, NgxNotificationComponent, NgxNotificationModule };
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmd4LW5vdGlmaWNhdGlvbi5qcy5tYXAiLCJzb3VyY2VzIjpbIm5nOi8vbmd4LW5vdGlmaWNhdGlvbi9saWIvbmd4LW5vdGlmaWNhdGlvbi5zZXJ2aWNlLnRzIiwibmc6Ly9uZ3gtbm90aWZpY2F0aW9uL2xpYi9uZ3gtbm90aWZpY2F0aW9uLmNvbXBvbmVudC50cyIsIm5nOi8vbmd4LW5vdGlmaWNhdGlvbi9saWIvbmd4LW5vdGlmaWNhdGlvbi5tb2R1bGUudHMiXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgSW5qZWN0YWJsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgT2JzZXJ2YWJsZSwgU3ViamVjdH0gZnJvbSAncnhqcyc7XG5cbkBJbmplY3RhYmxlKHtcbiAgcHJvdmlkZWRJbjogJ3Jvb3QnXG59KVxuZXhwb3J0IGNsYXNzIE5neE5vdGlmaWNhdGlvblNlcnZpY2Uge1xuXG4gIGNvbnN0cnVjdG9yKCkgeyB9XG5cbiAgcHJpdmF0ZSBzdWJqZWN0ID0gbmV3IFN1YmplY3Q8YW55PigpO1xuXG4gIHNlbmRNZXNzYWdlKG1lc3NhZ2U6IHN0cmluZywgdGhlbWU6IHN0cmluZywgcG9zaXRpb246IHN0cmluZykge1xuICAgIHRoaXMuc3ViamVjdC5uZXh0KFxuICAgICAge1xuICAgICAgICB0ZXh0OiBtZXNzYWdlLFxuICAgICAgICB0aGVtZTogdGhlbWUsXG4gICAgICAgIHBvc2l0aW9uOiBwb3NpdGlvblxuICAgICAgfVxuICAgICk7XG4gIH1cblxuICBjbGVhck1lc3NhZ2UoKSB7XG4gICAgdGhpcy5zdWJqZWN0Lm5leHQoKTtcbiAgfVxuXG4gIGdldE1lc3NhZ2UoKTogT2JzZXJ2YWJsZTxhbnk+IHtcbiAgICByZXR1cm4gdGhpcy5zdWJqZWN0LmFzT2JzZXJ2YWJsZSgpO1xuICB9XG5cbn1cbiIsImltcG9ydCB7IENvbXBvbmVudCwgT25Jbml0LCBPbkRlc3Ryb3kgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFN1YnNjcmlwdGlvbiB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IHsgTmd4Tm90aWZpY2F0aW9uU2VydmljZSB9IGZyb20gJy4vbmd4LW5vdGlmaWNhdGlvbi5zZXJ2aWNlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnbGliLW5neC1ub3RpZmljYXRpb24nLFxuICB0ZW1wbGF0ZTogYDxkaXYgKm5nSWY9J3Nob3cnIGNsYXNzPSduZ3gtbm90aWZpY2F0aW9uIHt7IG1lc3NhZ2UucG9zaXRpb24gfX0ge3sgbWVzc2FnZS50aGVtZSB9fSBzaG93Jz57e21lc3NhZ2U/LnRleHQgfX08L2Rpdj5gLFxuICBzdHlsZXM6IFtgXG4gIC5uZ3gtbm90aWZpY2F0aW9uLmRhcmsge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICMyZDJkMzA7XG4gICAgYm9yZGVyLWNvbG9yOiAjMjcyNzI5O1xuICAgIGNvbG9yOiAjYzljOWM5O1xuICB9XG4gIC5uZ3gtbm90aWZpY2F0aW9uLmxpZ2h0IHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmZmZmO1xuICAgIGJvcmRlci1jb2xvcjogI2NjY2NjYztcbiAgICBjb2xvcjogIzJkMmQzMDtcbiAgfVxuICAubmd4LW5vdGlmaWNhdGlvbi5zdWNjZXNzIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZGZmMGQ4O1xuICAgICAgYm9yZGVyLWNvbG9yOiAjZDBlOWM2O1xuICAgICAgY29sb3I6ICMzYzc2M2Q7XG4gIH1cbiAgLm5neC1ub3RpZmljYXRpb24uaW5mbyB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2Q5ZWRmNztcbiAgICBib3JkZXItY29sb3I6ICNiY2RmZjE7XG4gICAgY29sb3I6ICMzMTcwOGY7XG4gIH1cbiAgLm5neC1ub3RpZmljYXRpb24ud2FybmluZyB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2ZjZjhlMztcbiAgICBib3JkZXItY29sb3I6ICNmYWYyY2M7XG4gICAgY29sb3I6ICM4YTZkM2I7XG4gIH1cbiAgLm5neC1ub3RpZmljYXRpb24uZGFuZ2VyIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZjJkZWRlO1xuICAgIGJvcmRlci1jb2xvcjogI2ViY2NjYztcbiAgICBjb2xvcjogI2E5NDQ0MjtcbiAgfVxuICAubmd4LW5vdGlmaWNhdGlvbi50b3AtbGVmdCB7XG4gICAgcG9zaXRpb246IGZpeGVkO1xuICAgIGxlZnQ6IDEwcHg7XG4gICAgdG9wOiAxMHB4O1xuICB9XG4gIC5uZ3gtbm90aWZpY2F0aW9uLnRvcC1yaWdodCB7XG4gICAgcG9zaXRpb246IGZpeGVkO1xuICAgIHJpZ2h0OiAxMHB4O1xuICAgIHRvcDogMTBweDtcbiAgfVxuICAubmd4LW5vdGlmaWNhdGlvbi5ib3R0b20tcmlnaHQge1xuICAgIHBvc2l0aW9uOiBmaXhlZDtcbiAgICByaWdodDogMTBweDtcbiAgICBib3R0b206IDEwcHg7XG4gIH1cbiAgLm5neC1ub3RpZmljYXRpb24uYm90dG9tLWxlZnQge1xuICAgIHBvc2l0aW9uOiBmaXhlZDtcbiAgICBsZWZ0OiAxMHB4O1xuICAgIGJvdHRvbTogMTBweDtcbiAgfVxuICAubmd4LW5vdGlmaWNhdGlvbi5jZW50ZXIge1xuICAgIHBvc2l0aW9uOmFic29sdXRlO1xuICAgICAgdG9wOiA1MCU7XG4gICAgICBsZWZ0OiA1MCU7XG4gICAgICBtYXJnaW4tdG9wOiAtOWVtO1xuICAgICAgbWFyZ2luLWxlZnQ6IC0xNWVtO1xuICB9XG4gIC5uZ3gtbm90aWZpY2F0aW9uIHtcbiAgICBwYWRkaW5nOiAuNzVyZW0gMS4yNXJlbTtcbiAgICBtYXJnaW4tYm90dG9tOiAxcmVtO1xuICAgIGJvcmRlcjogMXB4IHNvbGlkIHRyYW5zcGFyZW50O1xuICAgIGJvcmRlci1yYWRpdXM6IC4yNXJlbTtcbiAgICAtd2Via2l0LWFuaW1hdGlvbjogZmFkZWluIDEuNXMsIGZhZGVvdXQgMS41cyAzLjVzO1xuICAgIGFuaW1hdGlvbjogZmFkZWluIDEuNXMsIGZhZGVvdXQgMS41cyAzLjVzO1xuICAgIHotaW5kZXggOiAxO1xuICB9XG5cbiAgLyogQW5pbWF0aW9ucyB0byBmYWRlIHRoZSBzbmFja2JhciBpbiBhbmQgb3V0ICovXG4gIEAtd2Via2l0LWtleWZyYW1lcyBmYWRlaW4ge1xuICAgIGZyb20ge29wYWNpdHk6IDA7fVxuICAgIHRvIHtvcGFjaXR5OiAxO31cbiAgfVxuXG4gIEBrZXlmcmFtZXMgZmFkZWluIHtcbiAgICBmcm9tIHtvcGFjaXR5OiAwO31cbiAgICB0byB7b3BhY2l0eTogMTt9XG4gIH1cblxuICBALXdlYmtpdC1rZXlmcmFtZXMgZmFkZW91dCB7XG4gICAgZnJvbSB7b3BhY2l0eTogMTt9XG4gICAgdG8ge29wYWNpdHk6IDA7fVxuICB9XG5cbiAgQGtleWZyYW1lcyBmYWRlb3V0IHtcbiAgICBmcm9tIHtvcGFjaXR5OiAxO31cbiAgICB0byB7b3BhY2l0eTogMDt9XG4gIH1cbiAgYF1cbn0pXG5leHBvcnQgY2xhc3MgTmd4Tm90aWZpY2F0aW9uQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0LCBPbkRlc3Ryb3kge1xuXG4gIHNob3c7XG4gIG1lc3NhZ2U6IGFueSA9IHt9O1xuICBzdWJzY3JpcHRpb246IFN1YnNjcmlwdGlvbjtcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIG5neE5vdGlmaWNhdGlvblNlcnZpY2U6IE5neE5vdGlmaWNhdGlvblNlcnZpY2UpIHtcbiAgICB0aGlzLnN1YnNjcmlwdGlvbiA9IHRoaXMubmd4Tm90aWZpY2F0aW9uU2VydmljZS5nZXRNZXNzYWdlKClcbiAgICAuc3Vic2NyaWJlKFxuICAgICAgbWVzc2FnZSA9PiB7XG4gICAgICAgIHRoaXMuc2hvdyA9IHRydWU7XG4gICAgICAgIHRoaXMubWVzc2FnZSA9IG1lc3NhZ2U7XG4gICAgICAgIGNvbnNvbGUubG9nKHRoaXMubWVzc2FnZSk7XG4gICAgICAgIHRoaXMuYXV0b0hpZGVNZXNzYWdlKCk7XG4gICAgICB9XG4gICAgKTtcbiAgfVxuXG4gIG5nT25Jbml0KCkge31cblxuICBuZ09uRGVzdHJveSgpIHtcbiAgICB0aGlzLnN1YnNjcmlwdGlvbi51bnN1YnNjcmliZSgpO1xuICB9XG5cbiAgYXV0b0hpZGVNZXNzYWdlKCkge1xuICAgIHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgdGhpcy5zaG93ID0gZmFsc2U7XG4gIH0sIDUwMDApO1xuICB9XG5cbn1cbiIsImltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQnJvd3Nlck1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL3BsYXRmb3JtLWJyb3dzZXInO1xuaW1wb3J0IHsgTmd4Tm90aWZpY2F0aW9uQ29tcG9uZW50IH0gZnJvbSAnLi9uZ3gtbm90aWZpY2F0aW9uLmNvbXBvbmVudCc7XG5cbkBOZ01vZHVsZSh7XG4gIGltcG9ydHM6IFtcbiAgICBDb21tb25Nb2R1bGUsXG4gICAgQnJvd3Nlck1vZHVsZVxuICBdLFxuICBkZWNsYXJhdGlvbnM6IFtOZ3hOb3RpZmljYXRpb25Db21wb25lbnRdLFxuICBleHBvcnRzOiBbTmd4Tm90aWZpY2F0aW9uQ29tcG9uZW50XVxufSlcbmV4cG9ydCBjbGFzcyBOZ3hOb3RpZmljYXRpb25Nb2R1bGUgeyB9XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7O0FBQUE7SUFRRTt1QkFFa0IsSUFBSSxPQUFPLEVBQU87S0FGbkI7Ozs7Ozs7SUFJakIsNENBQVc7Ozs7OztJQUFYLFVBQVksT0FBZSxFQUFFLEtBQWEsRUFBRSxRQUFnQjtRQUMxRCxJQUFJLENBQUMsT0FBTyxDQUFDLElBQUksQ0FDZjtZQUNFLElBQUksRUFBRSxPQUFPO1lBQ2IsS0FBSyxFQUFFLEtBQUs7WUFDWixRQUFRLEVBQUUsUUFBUTtTQUNuQixDQUNGLENBQUM7S0FDSDs7OztJQUVELDZDQUFZOzs7SUFBWjtRQUNFLElBQUksQ0FBQyxPQUFPLENBQUMsSUFBSSxFQUFFLENBQUM7S0FDckI7Ozs7SUFFRCwyQ0FBVTs7O0lBQVY7UUFDRSxPQUFPLElBQUksQ0FBQyxPQUFPLENBQUMsWUFBWSxFQUFFLENBQUM7S0FDcEM7O2dCQXpCRixVQUFVLFNBQUM7b0JBQ1YsVUFBVSxFQUFFLE1BQU07aUJBQ25COzs7OztpQ0FMRDs7Ozs7OztBQ0FBO0lBdUdFLGtDQUFvQixzQkFBOEM7UUFBbEUsaUJBVUM7UUFWbUIsMkJBQXNCLEdBQXRCLHNCQUFzQixDQUF3Qjt1QkFIbkQsRUFBRTtRQUlmLElBQUksQ0FBQyxZQUFZLEdBQUcsSUFBSSxDQUFDLHNCQUFzQixDQUFDLFVBQVUsRUFBRTthQUMzRCxTQUFTLENBQ1IsVUFBQSxPQUFPO1lBQ0wsS0FBSSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUM7WUFDakIsS0FBSSxDQUFDLE9BQU8sR0FBRyxPQUFPLENBQUM7WUFDdkIsT0FBTyxDQUFDLEdBQUcsQ0FBQyxLQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7WUFDMUIsS0FBSSxDQUFDLGVBQWUsRUFBRSxDQUFDO1NBQ3hCLENBQ0YsQ0FBQztLQUNIOzs7O0lBRUQsMkNBQVE7OztJQUFSLGVBQWE7Ozs7SUFFYiw4Q0FBVzs7O0lBQVg7UUFDRSxJQUFJLENBQUMsWUFBWSxDQUFDLFdBQVcsRUFBRSxDQUFDO0tBQ2pDOzs7O0lBRUQsa0RBQWU7OztJQUFmO1FBQUEsaUJBSUM7UUFIQyxVQUFVLENBQUM7WUFDVCxLQUFJLENBQUMsSUFBSSxHQUFHLEtBQUssQ0FBQztTQUNyQixFQUFFLElBQUksQ0FBQyxDQUFDO0tBQ1I7O2dCQXpIRixTQUFTLFNBQUM7b0JBQ1QsUUFBUSxFQUFFLHNCQUFzQjtvQkFDaEMsUUFBUSxFQUFFLHFIQUFxSDtvQkFDL0gsTUFBTSxFQUFFLENBQUMscTFEQXdGUixDQUFDO2lCQUNIOzs7O2dCQTlGUSxzQkFBc0I7O21DQUYvQjs7Ozs7OztBQ0FBOzs7O2dCQUtDLFFBQVEsU0FBQztvQkFDUixPQUFPLEVBQUU7d0JBQ1AsWUFBWTt3QkFDWixhQUFhO3FCQUNkO29CQUNELFlBQVksRUFBRSxDQUFDLHdCQUF3QixDQUFDO29CQUN4QyxPQUFPLEVBQUUsQ0FBQyx3QkFBd0IsQ0FBQztpQkFDcEM7O2dDQVpEOzs7Ozs7Ozs7Ozs7Ozs7In0=