253 lines
27 KiB
JavaScript
253 lines
27 KiB
JavaScript
|
import { NgIf } from '@angular/common';
|
||
|
|
import { Component, HostBinding, HostListener, NgModule, } from '@angular/core';
|
||
|
|
import { DefaultNoComponentGlobalConfig, TOAST_CONFIG, } from './toastr-config';
|
||
|
|
import * as i0 from "@angular/core";
|
||
|
|
import * as i1 from "./toastr.service";
|
||
|
|
import * as i2 from "./toastr-config";
|
||
|
|
class ToastNoAnimation {
|
||
|
|
toastrService;
|
||
|
|
toastPackage;
|
||
|
|
appRef;
|
||
|
|
message;
|
||
|
|
title;
|
||
|
|
options;
|
||
|
|
duplicatesCount;
|
||
|
|
originalTimeout;
|
||
|
|
/** width of progress bar */
|
||
|
|
width = -1;
|
||
|
|
/** a combination of toast type and options.toastClass */
|
||
|
|
toastClasses = '';
|
||
|
|
/** hides component when waiting to be displayed */
|
||
|
|
get displayStyle() {
|
||
|
|
if (this.state === 'inactive') {
|
||
|
|
return 'none';
|
||
|
|
}
|
||
|
|
}
|
||
|
|
/** controls animation */
|
||
|
|
state = 'inactive';
|
||
|
|
timeout;
|
||
|
|
intervalId;
|
||
|
|
hideTime;
|
||
|
|
sub;
|
||
|
|
sub1;
|
||
|
|
sub2;
|
||
|
|
sub3;
|
||
|
|
constructor(toastrService, toastPackage, appRef) {
|
||
|
|
this.toastrService = toastrService;
|
||
|
|
this.toastPackage = toastPackage;
|
||
|
|
this.appRef = appRef;
|
||
|
|
this.message = toastPackage.message;
|
||
|
|
this.title = toastPackage.title;
|
||
|
|
this.options = toastPackage.config;
|
||
|
|
this.originalTimeout = toastPackage.config.timeOut;
|
||
|
|
this.toastClasses = `${toastPackage.toastType} ${toastPackage.config.toastClass}`;
|
||
|
|
this.sub = toastPackage.toastRef.afterActivate().subscribe(() => {
|
||
|
|
this.activateToast();
|
||
|
|
});
|
||
|
|
this.sub1 = toastPackage.toastRef.manualClosed().subscribe(() => {
|
||
|
|
this.remove();
|
||
|
|
});
|
||
|
|
this.sub2 = toastPackage.toastRef.timeoutReset().subscribe(() => {
|
||
|
|
this.resetTimeout();
|
||
|
|
});
|
||
|
|
this.sub3 = toastPackage.toastRef.countDuplicate().subscribe(count => {
|
||
|
|
this.duplicatesCount = count;
|
||
|
|
});
|
||
|
|
}
|
||
|
|
ngOnDestroy() {
|
||
|
|
this.sub.unsubscribe();
|
||
|
|
this.sub1.unsubscribe();
|
||
|
|
this.sub2.unsubscribe();
|
||
|
|
this.sub3.unsubscribe();
|
||
|
|
clearInterval(this.intervalId);
|
||
|
|
clearTimeout(this.timeout);
|
||
|
|
}
|
||
|
|
/**
|
||
|
|
* activates toast and sets timeout
|
||
|
|
*/
|
||
|
|
activateToast() {
|
||
|
|
this.state = 'active';
|
||
|
|
if (!(this.options.disableTimeOut === true || this.options.disableTimeOut === 'timeOut') && this.options.timeOut) {
|
||
|
|
this.timeout = setTimeout(() => {
|
||
|
|
this.remove();
|
||
|
|
}, this.options.timeOut);
|
||
|
|
this.hideTime = new Date().getTime() + this.options.timeOut;
|
||
|
|
if (this.options.progressBar) {
|
||
|
|
this.intervalId = setInterval(() => this.updateProgress(), 10);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
if (this.options.onActivateTick) {
|
||
|
|
this.appRef.tick();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
/**
|
||
|
|
* updates progress bar width
|
||
|
|
*/
|
||
|
|
updateProgress() {
|
||
|
|
if (this.width === 0 || this.width === 100 || !this.options.timeOut) {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
const now = new Date().getTime();
|
||
|
|
const remaining = this.hideTime - now;
|
||
|
|
this.width = (remaining / this.options.timeOut) * 100;
|
||
|
|
if (this.options.progressAnimation === 'increasing') {
|
||
|
|
this.width = 100 - this.width;
|
||
|
|
}
|
||
|
|
if (this.width <= 0) {
|
||
|
|
this.width = 0;
|
||
|
|
}
|
||
|
|
if (this.width >= 100) {
|
||
|
|
this.width = 100;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
resetTimeout() {
|
||
|
|
clearTimeout(this.timeout);
|
||
|
|
clearInterval(this.intervalId);
|
||
|
|
this.state = 'active';
|
||
|
|
this.options.timeOut = this.originalTimeout;
|
||
|
|
this.timeout = setTimeout(() => this.remove(), this.originalTimeout);
|
||
|
|
this.hideTime = new Date().getTime() + (this.originalTimeout || 0);
|
||
|
|
this.width = -1;
|
||
|
|
if (this.options.progressBar) {
|
||
|
|
this.intervalId = setInterval(() => this.updateProgress(), 10);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
/**
|
||
|
|
* tells toastrService to remove this toast after animation time
|
||
|
|
*/
|
||
|
|
remove() {
|
||
|
|
if (this.state === 'removed') {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
clearTimeout(this.timeout);
|
||
|
|
this.state = 'removed';
|
||
|
|
this.timeout = setTimeout(() => this.toastrService.remove(this.toastPackage.toastId));
|
||
|
|
}
|
||
|
|
tapToast() {
|
||
|
|
if (this.state === 'removed') {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
this.toastPackage.triggerTap();
|
||
|
|
if (this.options.tapToDismiss) {
|
||
|
|
this.remove();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
stickAround() {
|
||
|
|
if (this.state === 'removed') {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
clearTimeout(this.timeout);
|
||
|
|
this.options.timeOut = 0;
|
||
|
|
this.hideTime = 0;
|
||
|
|
// disable progressBar
|
||
|
|
clearInterval(this.intervalId);
|
||
|
|
this.width = 0;
|
||
|
|
}
|
||
|
|
delayedHideToast() {
|
||
|
|
if ((this.options.disableTimeOut === true || this.options.disableTimeOut === 'extendedTimeOut') ||
|
||
|
|
this.options.extendedTimeOut === 0 ||
|
||
|
|
this.state === 'removed') {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
this.timeout = setTimeout(() => this.remove(), this.options.extendedTimeOut);
|
||
|
|
this.options.timeOut = this.options.extendedTimeOut;
|
||
|
|
this.hideTime = new Date().getTime() + (this.options.timeOut || 0);
|
||
|
|
this.width = -1;
|
||
|
|
if (this.options.progressBar) {
|
||
|
|
this.intervalId = setInterval(() => this.updateProgress(), 10);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ToastNoAnimation, deps: [{ token: i1.ToastrService }, { token: i2.ToastPackage }, { token: i0.ApplicationRef }], target: i0.ɵɵFactoryTarget.Component });
|
||
|
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: ToastNoAnimation, isStandalone: true, selector: "[toast-component]", host: { listeners: { "click": "tapToast()", "mouseenter": "stickAround()", "mouseleave": "delayedHideToast()" }, properties: { "class": "this.toastClasses", "style.display": "this.displayStyle" } }, ngImport: i0, template: `
|
||
|
|
<button *ngIf="options.closeButton" (click)="remove()" type="button" class="toast-close-button" aria-label="Close">
|
||
|
|
<span aria-hidden="true">×</span>
|
||
|
|
</button>
|
||
|
|
<div *ngIf="title" [class]="options.titleClass" [attr.aria-label]="title">
|
||
|
|
{{ title }} <ng-container *ngIf="duplicatesCount">[{{ duplicatesCount + 1 }}]</ng-container>
|
||
|
|
</div>
|
||
|
|
<div *ngIf="message && options.enableHtml" role="alert"
|
||
|
|
[class]="options.messageClass" [innerHTML]="message">
|
||
|
|
</div>
|
||
|
|
<div *ngIf="message && !options.enableHtml" role="alert"
|
||
|
|
[class]="options.messageClass" [attr.aria-label]="message">
|
||
|
|
{{ message }}
|
||
|
|
</div>
|
||
|
|
<div *ngIf="options.progressBar">
|
||
|
|
<div class="toast-progress" [style.width]="width + '%'"></div>
|
||
|
|
</div>
|
||
|
|
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
||
|
|
}
|
||
|
|
export { ToastNoAnimation };
|
||
|
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ToastNoAnimation, decorators: [{
|
||
|
|
type: Component,
|
||
|
|
args: [{
|
||
|
|
selector: '[toast-component]',
|
||
|
|
template: `
|
||
|
|
<button *ngIf="options.closeButton" (click)="remove()" type="button" class="toast-close-button" aria-label="Close">
|
||
|
|
<span aria-hidden="true">×</span>
|
||
|
|
</button>
|
||
|
|
<div *ngIf="title" [class]="options.titleClass" [attr.aria-label]="title">
|
||
|
|
{{ title }} <ng-container *ngIf="duplicatesCount">[{{ duplicatesCount + 1 }}]</ng-container>
|
||
|
|
</div>
|
||
|
|
<div *ngIf="message && options.enableHtml" role="alert"
|
||
|
|
[class]="options.messageClass" [innerHTML]="message">
|
||
|
|
</div>
|
||
|
|
<div *ngIf="message && !options.enableHtml" role="alert"
|
||
|
|
[class]="options.messageClass" [attr.aria-label]="message">
|
||
|
|
{{ message }}
|
||
|
|
</div>
|
||
|
|
<div *ngIf="options.progressBar">
|
||
|
|
<div class="toast-progress" [style.width]="width + '%'"></div>
|
||
|
|
</div>
|
||
|
|
`,
|
||
|
|
standalone: true,
|
||
|
|
imports: [NgIf]
|
||
|
|
}]
|
||
|
|
}], ctorParameters: function () { return [{ type: i1.ToastrService }, { type: i2.ToastPackage }, { type: i0.ApplicationRef }]; }, propDecorators: { toastClasses: [{
|
||
|
|
type: HostBinding,
|
||
|
|
args: ['class']
|
||
|
|
}], displayStyle: [{
|
||
|
|
type: HostBinding,
|
||
|
|
args: ['style.display']
|
||
|
|
}], tapToast: [{
|
||
|
|
type: HostListener,
|
||
|
|
args: ['click']
|
||
|
|
}], stickAround: [{
|
||
|
|
type: HostListener,
|
||
|
|
args: ['mouseenter']
|
||
|
|
}], delayedHideToast: [{
|
||
|
|
type: HostListener,
|
||
|
|
args: ['mouseleave']
|
||
|
|
}] } });
|
||
|
|
export const DefaultNoAnimationsGlobalConfig = {
|
||
|
|
...DefaultNoComponentGlobalConfig,
|
||
|
|
toastComponent: ToastNoAnimation,
|
||
|
|
};
|
||
|
|
class ToastNoAnimationModule {
|
||
|
|
static forRoot(config = {}) {
|
||
|
|
return {
|
||
|
|
ngModule: ToastNoAnimationModule,
|
||
|
|
providers: [
|
||
|
|
{
|
||
|
|
provide: TOAST_CONFIG,
|
||
|
|
useValue: {
|
||
|
|
default: DefaultNoAnimationsGlobalConfig,
|
||
|
|
config,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
],
|
||
|
|
};
|
||
|
|
}
|
||
|
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ToastNoAnimationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
||
|
|
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.1", ngImport: i0, type: ToastNoAnimationModule, imports: [ToastNoAnimation], exports: [ToastNoAnimation] });
|
||
|
|
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ToastNoAnimationModule });
|
||
|
|
}
|
||
|
|
export { ToastNoAnimationModule };
|
||
|
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ToastNoAnimationModule, decorators: [{
|
||
|
|
type: NgModule,
|
||
|
|
args: [{
|
||
|
|
imports: [ToastNoAnimation],
|
||
|
|
exports: [ToastNoAnimation],
|
||
|
|
}]
|
||
|
|
}] });
|
||
|
|
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9hc3Qtbm9hbmltYXRpb24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2xpYi90b2FzdHIvdG9hc3Qtbm9hbmltYXRpb24uY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUV2QyxPQUFPLEVBRUwsU0FBUyxFQUNULFdBQVcsRUFDWCxZQUFZLEVBQ1osUUFBUSxHQUVULE1BQU0sZUFBZSxDQUFDO0FBSXZCLE9BQU8sRUFDTCw4QkFBOEIsRUFJOUIsWUFBWSxHQUNiLE1BQU0saUJBQWlCLENBQUM7Ozs7QUFHekIsTUF1QmEsZ0JBQWdCO0lBOEJmO0lBQ0g7SUFDRztJQS9CWixPQUFPLENBQWlCO0lBQ3hCLEtBQUssQ0FBVTtJQUNmLE9BQU8sQ0FBbUI7SUFDMUIsZUFBZSxDQUFVO0lBQ3pCLGVBQWUsQ0FBUztJQUN4Qiw0QkFBNEI7SUFDNUIsS0FBSyxHQUFHLENBQUMsQ0FBQyxDQUFDO0lBQ1gseURBQXlEO0lBQ25DLFlBQVksR0FBRyxFQUFFLENBQUM7SUFFeEMsbURBQW1EO0lBQ25ELElBQ0ksWUFBWTtRQUNkLElBQUksSUFBSSxDQUFDLEtBQUssS0FBSyxVQUFVLEVBQUU7WUFDN0IsT0FBTyxNQUFNLENBQUM7U0FDZjtJQUNILENBQUM7SUFFRCx5QkFBeUI7SUFDekIsS0FBSyxHQUFHLFVBQVUsQ0FBQztJQUNYLE9BQU8sQ0FBTTtJQUNiLFVBQVUsQ0FBTTtJQUNoQixRQUFRLENBQVU7SUFDbEIsR0FBRyxDQUFlO0lBQ2xCLElBQUksQ0FBZTtJQUNuQixJQUFJLENBQWU7SUFDbkIsSUFBSSxDQUFlO0lBRTNCLFlBQ1ksYUFBNEIsRUFDL0IsWUFBMEIsRUFDdkIsTUFBc0I7UUFGdEIsa0JBQWEsR0FBYixhQUFhLENBQWU7UUFDL0IsaUJBQVksR0FBWixZQUFZLENBQWM7UUFDdkIsV0FBTSxHQUFOLE1BQU0s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
|