angular2-toaster-mod
Version:
An Angular 2 Toaster Notification library based on AngularJS-Toaster
1 lines • 12.6 kB
JavaScript
(function(global,factory){typeof exports==="object"&&typeof module!=="undefined"?factory(exports,require("@angular/core"),require("@angular/platform-browser"),require("rxjs/Observable"),require("rxjs/add/operator/share"),require("rxjs/Subject"),require("@angular/common")):typeof define==="function"&&define.amd?define(["exports","@angular/core","@angular/platform-browser","rxjs/Observable","rxjs/add/operator/share","rxjs/Subject","@angular/common"],factory):factory(global.angular2toaster=global.angular2toaster||{},global.ng.core,global._angular_platformBrowser,global.Rx,global.Rx,global.Rx,global.ng.common)})(this,function(exports,_angular_core,_angular_platformBrowser,rxjs_Observable,rxjs_add_operator_share,rxjs_Subject,_angular_common){"use strict";(function(BodyOutputType){BodyOutputType[BodyOutputType["Default"]=0]="Default";BodyOutputType[BodyOutputType["TrustedHtml"]=1]="TrustedHtml";BodyOutputType[BodyOutputType["Component"]=2]="Component"})(exports.BodyOutputType||(exports.BodyOutputType={}));var ToastComponent=function(){function ToastComponent(sanitizer,componentFactoryResolver,changeDetectorRef){this.sanitizer=sanitizer;this.componentFactoryResolver=componentFactoryResolver;this.changeDetectorRef=changeDetectorRef;this.bodyOutputType=exports.BodyOutputType;this.clickEvent=new _angular_core.EventEmitter}ToastComponent.prototype.ngOnInit=function(){if(this.toast.closeHtml){this.safeCloseHtml=this.sanitizer.bypassSecurityTrustHtml(this.toast.closeHtml)}};ToastComponent.prototype.ngAfterViewInit=function(){if(this.toast.bodyOutputType===this.bodyOutputType.Component){var component=this.componentFactoryResolver.resolveComponentFactory(this.toast.body);var componentInstance=this.componentBody.createComponent(component,null,this.componentBody.injector);componentInstance.instance.toast=this.toast;this.changeDetectorRef.detectChanges()}};ToastComponent.prototype.click=function(event,toast){event.stopPropagation();this.clickEvent.emit({value:{toast:toast,isCloseButton:true}})};ToastComponent.decorators=[{type:_angular_core.Component,args:[{selector:"[toastComp]",template:'\n <i class="toaster-icon" [ngClass]="iconClass"></i>\n <div class="toast-content">\n <div [ngClass]="toast.toasterConfig.titleClass">{{toast.title}}</div>\n <div [ngClass]="toast.toasterConfig.messageClass" [ngSwitch]="toast.bodyOutputType">\n <div *ngSwitchCase="bodyOutputType.Component" #componentBody></div>\n <div *ngSwitchCase="bodyOutputType.TrustedHtml" [innerHTML]="toast.body"></div>\n <div *ngSwitchCase="bodyOutputType.Default">{{toast.body}}</div>\n </div>\n </div>\n <div class="toast-close-button" *ngIf="toast.showCloseButton" (click)="click($event, toast)"\n [innerHTML]="safeCloseHtml">\n </div>',outputs:["clickEvent"]}]}];ToastComponent.ctorParameters=function(){return[{type:_angular_platformBrowser.DomSanitizer},{type:_angular_core.ComponentFactoryResolver},{type:_angular_core.ChangeDetectorRef}]};ToastComponent.propDecorators={toast:[{type:_angular_core.Input}],iconClass:[{type:_angular_core.Input}],componentBody:[{type:_angular_core.ViewChild,args:["componentBody",{read:_angular_core.ViewContainerRef}]}]};return ToastComponent}();var ToasterConfig=function(){function ToasterConfig(configOverrides){configOverrides=configOverrides||{};this.limit=configOverrides.limit||null;this.tapToDismiss=configOverrides.tapToDismiss!=null?configOverrides.tapToDismiss:true;this.showCloseButton=configOverrides.showCloseButton!=null?configOverrides.showCloseButton:false;this.closeHtml=configOverrides.closeHtml||'<button class="toast-close-button" type="button">×</button>';this.newestOnTop=configOverrides.newestOnTop!=null?configOverrides.newestOnTop:true;this.timeout=configOverrides.timeout!=null?configOverrides.timeout:5e3;this.typeClasses=configOverrides.typeClasses||{error:"toast-error",info:"toast-info",wait:"toast-wait",success:"toast-success",warning:"toast-warning"};this.iconClasses=configOverrides.iconClasses||{error:"icon-error",info:"icon-info",wait:"icon-wait",success:"icon-success",warning:"icon-warning"};this.bodyOutputType=configOverrides.bodyOutputType||exports.BodyOutputType.Default;this.bodyTemplate=configOverrides.bodyTemplate||"toasterBodyTmpl.html";this.defaultTypeClass=configOverrides.defaultTypeClass||"toast-info";this.positionClass=configOverrides.positionClass||"toast-top-right";this.animationClass=configOverrides.animationClass||"";this.titleClass=configOverrides.titleClass||"toast-title";this.messageClass=configOverrides.messageClass||"toast-message";this.preventDuplicates=configOverrides.preventDuplicates!=null?configOverrides.preventDuplicates:false;this.mouseoverTimerStop=configOverrides.mouseoverTimerStop!=null?configOverrides.mouseoverTimerStop:false;this.toastContainerId=configOverrides.toastContainerId!=null?configOverrides.toastContainerId:null}return ToasterConfig}();var ToasterService=function(){function ToasterService(){var _this=this;this.addToast=new rxjs_Observable.Observable(function(observer){return _this._addToast=observer}).share();this.clearToasts=new rxjs_Observable.Observable(function(observer){return _this._clearToasts=observer}).share();this._removeToastSubject=new rxjs_Subject.Subject;this.removeToast=this._removeToastSubject.share()}ToasterService.prototype.pop=function(type,title,body){var toast=typeof type==="string"?{type:type,title:title,body:body}:type;toast.toastId=Guid.newGuid();if(!this._addToast){throw new Error("No Toaster Containers have been initialized to receive toasts.")}this._addToast.next(toast);return toast};ToasterService.prototype.popAsync=function(type,title,body){var _this=this;setTimeout(function(){_this.pop(type,title,body)},0);return this.addToast};ToasterService.prototype.clear=function(toastId,toastContainerId){var clearWrapper={toastId:toastId,toastContainerId:toastContainerId};this._clearToasts.next(clearWrapper)};ToasterService.decorators=[{type:_angular_core.Injectable}];ToasterService.ctorParameters=function(){return[]};return ToasterService}();var Guid=function(){function Guid(){}Guid.newGuid=function(){return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,function(c){var r=Math.random()*16|0,v=c=="x"?r:r&3|8;return v.toString(16)})};return Guid}();var ToasterContainerComponent=function(){function ToasterContainerComponent(toasterService,ref,ngZone){this.ref=ref;this.ngZone=ngZone;this.toasts=[];this.toasterService=toasterService}ToasterContainerComponent.prototype.ngOnInit=function(){this.registerSubscribers();if(this.toasterconfig===null||typeof this.toasterconfig==="undefined"){this.toasterconfig=new ToasterConfig}};ToasterContainerComponent.prototype.click=function(toast,isCloseButton){if(this.toasterconfig.tapToDismiss||toast.showCloseButton&&isCloseButton){var removeToast=true;if(toast.clickHandler){if(typeof toast.clickHandler==="function"){removeToast=toast.clickHandler(toast,isCloseButton)}else{console.log("The toast click handler is not a callable function.");return false}}if(removeToast){this.removeToast(toast)}}};ToasterContainerComponent.prototype.childClick=function($event){this.click($event.value.toast,$event.value.isCloseButton)};ToasterContainerComponent.prototype.stopTimer=function(toast){if(this.toasterconfig.mouseoverTimerStop){if(toast.timeoutId){window.clearTimeout(toast.timeoutId);toast.timeoutId=null}}};ToasterContainerComponent.prototype.restartTimer=function(toast){if(this.toasterconfig.mouseoverTimerStop){if(!toast.timeoutId){this.configureTimer(toast)}}else if(toast.timeoutId===null){this.removeToast(toast)}};ToasterContainerComponent.prototype.registerSubscribers=function(){var _this=this;this.addToastSubscriber=this.toasterService.addToast.subscribe(function(toast){_this.addToast(toast)});this.clearToastsSubscriber=this.toasterService.clearToasts.subscribe(function(clearWrapper){_this.clearToasts(clearWrapper)})};ToasterContainerComponent.prototype.addToast=function(toast){var _this=this;toast.toasterConfig=this.toasterconfig;if(toast.toastContainerId&&this.toasterconfig.toastContainerId&&toast.toastContainerId!==this.toasterconfig.toastContainerId)return;if(!toast.type){toast.type=this.toasterconfig.defaultTypeClass}if(this.toasterconfig.preventDuplicates&&this.toasts.length>0){if(toast.toastId&&this.toasts.some(function(t){return t.toastId===toast.toastId})){return}else if(this.toasts.some(function(t){return t.body===toast.body})){return}}if(toast.showCloseButton===null||typeof toast.showCloseButton==="undefined"){if(typeof this.toasterconfig.showCloseButton==="object"){toast.showCloseButton=this.toasterconfig.showCloseButton[toast.type]}else if(typeof this.toasterconfig.showCloseButton==="boolean"){toast.showCloseButton=this.toasterconfig.showCloseButton}}if(toast.showCloseButton){toast.closeHtml=toast.closeHtml||this.toasterconfig.closeHtml}toast.bodyOutputType=toast.bodyOutputType||this.toasterconfig.bodyOutputType;this.configureTimer(toast);if(this.toasterconfig.newestOnTop){this.ngZone.run(function(){_this.toasts.unshift(toast)});if(this.isLimitExceeded()){this.toasts.pop()}}else{this.toasts.push(toast);if(this.isLimitExceeded()){this.toasts.shift()}}if(toast.onShowCallback){toast.onShowCallback(toast)}};ToasterContainerComponent.prototype.configureTimer=function(toast){var _this=this;var timeout=typeof toast.timeout==="number"?toast.timeout:this.toasterconfig.timeout;if(typeof timeout==="object")timeout=timeout[toast.type];if(timeout>0){toast.timeoutId=window.setTimeout(function(){_this.ref.markForCheck();_this.removeToast(toast)},timeout)}};ToasterContainerComponent.prototype.isLimitExceeded=function(){return this.toasterconfig.limit&&this.toasts.length>this.toasterconfig.limit};ToasterContainerComponent.prototype.removeToast=function(toast){var index=this.toasts.indexOf(toast);if(index<0)return;this.toasts.splice(index,1);if(toast.timeoutId){window.clearTimeout(toast.timeoutId);toast.timeoutId=null}if(toast.onHideCallback)toast.onHideCallback(toast);this.toasterService._removeToastSubject.next({toastId:toast.toastId,toastContainerId:toast.toastContainerId})};ToasterContainerComponent.prototype.removeAllToasts=function(){for(var i=this.toasts.length-1;i>=0;i--){this.removeToast(this.toasts[i])}};ToasterContainerComponent.prototype.clearToasts=function(clearWrapper){var toastId=clearWrapper.toastId;var toastContainerId=clearWrapper.toastContainerId;if(toastContainerId===null||typeof toastContainerId==="undefined"){this.clearToastsAction(toastId)}else if(toastContainerId===this.toasterconfig.toastContainerId){this.clearToastsAction(toastId)}};ToasterContainerComponent.prototype.clearToastsAction=function(toastId){if(toastId){this.removeToast(this.toasts.filter(function(t){return t.toastId===toastId})[0])}else{this.removeAllToasts()}};ToasterContainerComponent.prototype.ngOnDestroy=function(){if(this.addToastSubscriber){this.addToastSubscriber.unsubscribe()}if(this.clearToastsSubscriber){this.clearToastsSubscriber.unsubscribe()}};ToasterContainerComponent.decorators=[{type:_angular_core.Component,args:[{selector:"toaster-container",template:'\n <div id="toast-container" [ngClass]="[toasterconfig.positionClass, toasterconfig.animationClass]" class="ng-animate">\n <div toastComp *ngFor="let toast of toasts" class="toast" [toast]="toast"\n [iconClass]="toasterconfig.iconClasses[toast.type]" \n [ngClass]="toasterconfig.typeClasses[toast.type]"\n (click)="click(toast)" (clickEvent)="childClick($event)" \n (mouseover)="stopTimer(toast)" (mouseout)="restartTimer(toast)">\n </div>\n </div>\n '}]}];ToasterContainerComponent.ctorParameters=function(){return[{type:ToasterService},{type:_angular_core.ChangeDetectorRef},{type:_angular_core.NgZone}]};ToasterContainerComponent.propDecorators={toasterconfig:[{type:_angular_core.Input}]};return ToasterContainerComponent}();var ToasterModule=function(){function ToasterModule(){}ToasterModule.decorators=[{type:_angular_core.NgModule,args:[{imports:[_angular_common.CommonModule],declarations:[ToastComponent,ToasterContainerComponent],providers:[ToasterService],exports:[ToasterContainerComponent,ToastComponent]}]}];ToasterModule.ctorParameters=function(){return[]};return ToasterModule}();exports.ToastComponent=ToastComponent;exports.ToasterContainerComponent=ToasterContainerComponent;exports.ToasterService=ToasterService;exports.ToasterConfig=ToasterConfig;exports.ToasterModule=ToasterModule;Object.defineProperty(exports,"__esModule",{value:true})});