angular2-toaster
Version:
An Angular Toaster Notification library based on AngularJS-Toaster
2 lines • 14.3 kB
JavaScript
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/animations"),require("rxjs"),require("rxjs/operators"),require("@angular/common"),require("@angular/platform-browser")):"function"==typeof define&&define.amd?define("angular2-toaster",["exports","@angular/core","@angular/animations","rxjs","rxjs/operators","@angular/common","@angular/platform-browser"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self)["angular2-toaster"]={},t.ng.core,t.ng.animations,t.rxjs,t.rxjs.operators,t.ng.common,t.ng.platformBrowser)}(this,(function(t,e,s,o,i,n,a){"use strict";var r,u=[s.trigger("toastState",[s.state("flyRight, flyLeft, slideDown, slideDown, slideUp, slideUp, fade",s.style({opacity:1,transform:"translate(0,0)"})),s.transition("void => flyRight",[s.style({opacity:0,transform:"translateX(100%)",height:0}),s.animate("0.15s ease-in",s.style({opacity:1,height:"*"})),s.animate("0.25s 15ms ease-in")]),s.transition("flyRight => void",[s.animate("0.25s ease-out",s.style({opacity:0,transform:"translateX(100%)"})),s.animate("0.15s ease-out",s.style({height:0}))]),s.transition("void => flyLeft",[s.style({opacity:0,transform:"translateX(-100%)",height:0}),s.animate("0.15s ease-in",s.style({opacity:1,height:"*"})),s.animate("0.25s 15ms ease-in")]),s.transition("flyLeft => void",[s.animate("0.25s 10ms ease-out",s.style({opacity:0,transform:"translateX(-100%)"})),s.animate("0.15s ease-out",s.style({height:0}))]),s.transition("void => slideDown",[s.style({opacity:0,transform:"translateY(-500%)",height:0}),s.group([s.animate("0.2s ease-in",s.style({height:"*"})),s.animate("0.4s ease-in",s.style({transform:"translate(0,0)"})),s.animate("0.3s 0.1s ease-in",s.style({opacity:1}))])]),s.transition("slideDown => void",s.group([s.animate("0.3s ease-out",s.style({opacity:0})),s.animate("0.4s ease-out",s.style({transform:"translateY(-500%)"})),s.animate("0.2s 0.2s ease-out",s.style({height:0}))])),s.transition("void => slideUp",[s.style({opacity:0,transform:"translateY(1000%)",height:0}),s.group([s.animate("0.2s ease-in",s.style({height:"*"})),s.animate("0.5s ease-in",s.style({transform:"translate(0,0)"})),s.animate("0.3s 0.1s ease-in",s.style({opacity:1}))])]),s.transition("slideUp => void",s.group([s.animate("0.3s ease-out",s.style({opacity:0})),s.animate("0.5s ease-out",s.style({transform:"translateY(1000%)"})),s.animate("0.3s 0.15s ease-out",s.style({height:0}))])),s.transition("void => fade",[s.style({opacity:0,height:0}),s.animate("0.20s ease-in",s.style({height:"*"})),s.animate("0.15s ease-in",s.style({opacity:1}))]),s.transition("fade => void",[s.group([s.animate("0.0s ease-out",s.style({"background-position":"-99999px"})),s.animate("0.15s ease-out",s.style({opacity:0,"background-image":""})),s.animate("0.3s 20ms ease-out",s.style({height:0}))])])])];(r=t.BodyOutputType||(t.BodyOutputType={}))[r.Default=0]="Default",r[r.TrustedHtml=1]="TrustedHtml",r[r.Component=2]="Component";var l={error:"toast-error",info:"toast-info",wait:"toast-wait",success:"toast-success",warning:"toast-warning"},c={error:"icon-error",info:"icon-info",wait:"icon-wait",success:"icon-success",warning:"icon-warning"},p=function(e){e=e||{},this.limit=e.limit||null,this.tapToDismiss=null==e.tapToDismiss||e.tapToDismiss,this.showCloseButton=null!=e.showCloseButton&&e.showCloseButton,this.closeHtml=e.closeHtml||"<span>×</span>",this.newestOnTop=null==e.newestOnTop||e.newestOnTop,this.timeout=null!=e.timeout?e.timeout:5e3,this.typeClasses=e.typeClasses||l,this.iconClasses=e.iconClasses||c,this.bodyOutputType=e.bodyOutputType||t.BodyOutputType.Default,this.bodyTemplate=e.bodyTemplate||"toasterBodyTmpl.html",this.defaultToastType=e.defaultToastType||"info",this.positionClass=e.positionClass||"toast-top-right",this.titleClass=e.titleClass||"toast-title",this.messageClass=e.messageClass||"toast-message",this.animation=e.animation||"",this.preventDuplicates=null!=e.preventDuplicates&&e.preventDuplicates,this.mouseoverTimerStop=null!=e.mouseoverTimerStop&&e.mouseoverTimerStop,this.toastContainerId=null!=e.toastContainerId?e.toastContainerId:null};p.decorators=[{type:e.Injectable}],p.ctorParameters=function(){return[{type:void 0}]};var h=function(){function t(){}return t.newGuid=function(){return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,(function(t){var e=16*Math.random()|0;return("x"===t?e:3&e|8).toString(16)}))},t}(),d=function(){function t(){var t=this;this.addToast=new o.Observable((function(e){return t._addToast=e})).pipe(i.share()),this.clearToasts=new o.Observable((function(e){return t._clearToasts=e})).pipe(i.share()),this._removeToastSubject=new o.Subject,this.removeToast=this._removeToastSubject.pipe(i.share())}return t.prototype.pop=function(t,e,s){var o="string"==typeof t?{type:t,title:e,body:s}:t;if(o.toastId||(o.toastId=h.newGuid()),!this._addToast)throw new Error("No Toaster Containers have been initialized to receive toasts.");return this._addToast.next(o),o},t.prototype.popAsync=function(t,e,s){var o=this;return setTimeout((function(){o.pop(t,e,s)}),0),this.addToast},t.prototype.clear=function(t,e){var s={toastId:t,toastContainerId:e};this._clearToasts.next(s)},t}();d.ɵprov=e.ɵɵdefineInjectable({factory:function(){return new d},token:d,providedIn:"root"}),d.decorators=[{type:e.Injectable,args:[{providedIn:"root"}]}],d.ctorParameters=function(){return[]};var m=function(){function t(t){this.toasts=[],this.toasterService=t}return t.prototype.ngOnInit=function(){this.registerSubscribers(),this.isNullOrUndefined(this.toasterconfig)&&(this.toasterconfig=new p)},t.prototype.click=function(t,e){t.onClickCallback&&t.onClickCallback(t),((this.isNullOrUndefined(t.tapToDismiss)?this.toasterconfig.tapToDismiss:t.tapToDismiss)||t.showCloseButton&&e)&&this.removeToast(t)},t.prototype.childClick=function(t){this.click(t.value.toast,t.value.isCloseButton)},t.prototype.removeToast=function(t){var e=this.toasts.indexOf(t);if(!(e<0)){var s=this.toastIdOrDefault(t);this.toasts.splice(e,1),t.onHideCallback&&t.onHideCallback(t),this.toasterService._removeToastSubject.next({toastId:s,toastContainerId:t.toastContainerId})}},t.prototype.registerSubscribers=function(){var t=this;this.addToastSubscriber=this.toasterService.addToast.subscribe((function(e){t.addToast(e)})),this.clearToastsSubscriber=this.toasterService.clearToasts.subscribe((function(e){t.clearToasts(e)}))},t.prototype.addToast=function(t){if(!t.toastContainerId||!this.toasterconfig.toastContainerId||t.toastContainerId===this.toasterconfig.toastContainerId){if(t.type&&this.toasterconfig.typeClasses[t.type]&&this.toasterconfig.iconClasses[t.type]||(t.type=this.toasterconfig.defaultToastType),this.toasterconfig.preventDuplicates&&this.toasts.length>0){if(t.toastId&&this.toasts.some((function(e){return e.toastId===t.toastId})))return;if(this.toasts.some((function(e){return e.body===t.body})))return}this.isNullOrUndefined(t.showCloseButton)&&("object"==typeof this.toasterconfig.showCloseButton?t.showCloseButton=this.toasterconfig.showCloseButton[t.type]:"boolean"==typeof this.toasterconfig.showCloseButton&&(t.showCloseButton=this.toasterconfig.showCloseButton)),t.showCloseButton&&(t.closeHtml=t.closeHtml||this.toasterconfig.closeHtml),t.bodyOutputType=t.bodyOutputType||this.toasterconfig.bodyOutputType,this.toasterconfig.newestOnTop?(this.toasts.unshift(t),this.isLimitExceeded()&&this.toasts.pop()):(this.toasts.push(t),this.isLimitExceeded()&&this.toasts.shift()),t.onShowCallback&&t.onShowCallback(t)}},t.prototype.isLimitExceeded=function(){return this.toasterconfig.limit&&this.toasts.length>this.toasterconfig.limit},t.prototype.removeAllToasts=function(){for(var t=this.toasts.length-1;t>=0;t--)this.removeToast(this.toasts[t])},t.prototype.clearToasts=function(t){var e=t.toastId,s=t.toastContainerId;(this.isNullOrUndefined(s)||s===this.toasterconfig.toastContainerId)&&this.clearToastsAction(e)},t.prototype.clearToastsAction=function(t){t?this.removeToast(this.toasts.filter((function(e){return e.toastId===t}))[0]):this.removeAllToasts()},t.prototype.toastIdOrDefault=function(t){return t.toastId||""},t.prototype.isNullOrUndefined=function(t){return null==t},t.prototype.ngOnDestroy=function(){this.addToastSubscriber&&this.addToastSubscriber.unsubscribe(),this.clearToastsSubscriber&&this.clearToastsSubscriber.unsubscribe()},t}();m.decorators=[{type:e.Component,args:[{selector:"toaster-container",template:'\n <div class="toast-container" [ngClass]="[toasterconfig.positionClass]">\n <div toastComp *ngFor="let toast of toasts" class="toast" [toast]="toast"\n [toasterconfig]="toasterconfig"\n [@toastState]="toasterconfig.animation"\n [titleClass]="toasterconfig.titleClass"\n [messageClass]="toasterconfig.messageClass"\n [ngClass]="[\n toasterconfig.iconClasses[toast.type],\n toasterconfig.typeClasses[toast.type]\n ]"\n (click)="click(toast)" (clickEvent)="childClick($event)"\n (removeToastEvent)="removeToast($event)"\n >\n </div>\n </div>\n ',animations:u}]}],m.ctorParameters=function(){return[{type:d}]},m.propDecorators={toasterconfig:[{type:e.Input}]};var f=function(){function s(s,o,i,n,a){this.componentFactoryResolver=s,this.changeDetectorRef=o,this.ngZone=i,this.element=n,this.renderer2=a,this.progressBarWidth=-1,this.bodyOutputType=t.BodyOutputType,this.clickEvent=new e.EventEmitter,this.removeToastEvent=new e.EventEmitter,this.timeoutId=null,this.timeout=0,this.progressBarIntervalId=null}return s.prototype.ngOnInit=function(){this.toast.progressBar&&(this.toast.progressBarDirection=this.toast.progressBarDirection||"decreasing");var t="number"==typeof this.toast.timeout?this.toast.timeout:this.toasterconfig.timeout;"object"==typeof t&&(t=t[this.toast.type]),this.timeout=t},s.prototype.ngAfterViewInit=function(){var t=this;if(this.toast.bodyOutputType===this.bodyOutputType.Component){var e=this.componentFactoryResolver.resolveComponentFactory(this.toast.body);this.componentBody.createComponent(e,void 0,this.componentBody.injector).instance.toast=this.toast,this.changeDetectorRef.detectChanges()}this.toasterconfig.mouseoverTimerStop&&(this.removeMouseOverListener=this.renderer2.listen(this.element.nativeElement,"mouseenter",(function(){return t.stopTimer()}))),this.configureTimer()},s.prototype.click=function(t,e){t.stopPropagation(),this.clickEvent.emit({value:{toast:e,isCloseButton:!0}})},s.prototype.stopTimer=function(){this.progressBarWidth=0,this.clearTimers()},s.prototype.restartTimer=function(){this.toasterconfig.mouseoverTimerStop?this.timeoutId||this.configureTimer():this.timeout&&!this.timeoutId&&this.removeToast()},s.prototype.ngOnDestroy=function(){this.removeMouseOverListener&&this.removeMouseOverListener(),this.clearTimers()},s.prototype.configureTimer=function(){var t=this;!this.timeout||this.timeout<1||(this.toast.progressBar&&(this.removeToastTick=(new Date).getTime()+this.timeout,this.progressBarWidth=-1),this.ngZone.runOutsideAngular((function(){t.timeoutId=window.setTimeout((function(){t.ngZone.run((function(){t.changeDetectorRef.markForCheck(),t.removeToast()}))}),t.timeout),t.toast.progressBar&&(t.progressBarIntervalId=window.setInterval((function(){t.ngZone.run((function(){t.updateProgressBar()}))}),10))})))},s.prototype.updateProgressBar=function(){0!==this.progressBarWidth&&100!==this.progressBarWidth&&(this.progressBarWidth=(this.removeToastTick-(new Date).getTime())/this.timeout*100,"increasing"===this.toast.progressBarDirection&&(this.progressBarWidth=100-this.progressBarWidth),this.progressBarWidth<0&&(this.progressBarWidth=0),this.progressBarWidth>100&&(this.progressBarWidth=100))},s.prototype.clearTimers=function(){this.timeoutId&&window.clearTimeout(this.timeoutId),this.progressBarIntervalId&&window.clearInterval(this.progressBarIntervalId),this.timeoutId=null,this.progressBarIntervalId=null},s.prototype.removeToast=function(){this.removeToastEvent.emit(this.toast)},s}();f.decorators=[{type:e.Component,args:[{selector:"[toastComp]",template:'\n <div class="toast-content">\n <div [ngClass]="titleClass">{{toast.title}}</div>\n <div [ngClass]="messageClass" [ngSwitch]="toast.bodyOutputType">\n <div *ngSwitchCase="bodyOutputType.Component" #componentBody></div>\n <div *ngSwitchCase="bodyOutputType.TrustedHtml" [innerHTML]="toast.body | trustHtml"></div>\n <div *ngSwitchCase="bodyOutputType.Default">{{toast.body}}</div>\n </div>\n </div>\n <button class="toast-close-button" *ngIf="toast.showCloseButton" (click)="click($event, toast)"\n [innerHTML]="toast.closeHtml | trustHtml">\n </button>\n <div *ngIf="toast.progressBar">\n <div class="toast-progress-bar" [style.width]="progressBarWidth + \'%\'"></div>\n </div>'}]}],f.ctorParameters=function(){return[{type:e.ComponentFactoryResolver},{type:e.ChangeDetectorRef},{type:e.NgZone},{type:e.ElementRef},{type:e.Renderer2}]},f.propDecorators={toasterconfig:[{type:e.Input}],toast:[{type:e.Input}],titleClass:[{type:e.Input}],messageClass:[{type:e.Input}],componentBody:[{type:e.ViewChild,args:["componentBody",{read:e.ViewContainerRef,static:!1}]}],clickEvent:[{type:e.Output}],removeToastEvent:[{type:e.Output}],restartTimer:[{type:e.HostListener,args:["mouseleave"]}]};var y=function(){function t(t){this.sanitizer=t}return t.prototype.transform=function(t){return this.sanitizer.bypassSecurityTrustHtml(t)},t}();y.decorators=[{type:e.Pipe,args:[{name:"trustHtml",pure:!0}]}],y.ctorParameters=function(){return[{type:a.DomSanitizer}]};var g=function(){function t(){}return t.forRoot=function(){return{ngModule:t,providers:[d,m]}},t.forChild=function(){return{ngModule:t,providers:[m]}},t}();g.decorators=[{type:e.NgModule,args:[{imports:[n.CommonModule],declarations:[f,m,y],exports:[m,f]}]}],t.DefaultIconClasses=c,t.DefaultTypeClasses=l,t.ToasterConfig=p,t.ToasterContainerComponent=m,t.ToasterModule=g,t.ToasterService=d,t.ɵa=u,t.ɵb=f,t.ɵc=y,Object.defineProperty(t,"__esModule",{value:!0})}));
//# sourceMappingURL=angular2-toaster.umd.min.js.map