Commit ae3ea3138b78047794f3630d899b17e6116e3905

Authored by Igor Kulikov
1 parent 85748665

Toast improvements

... ... @@ -19,7 +19,7 @@ import {
19 19 Component,
20 20 Directive,
21 21 ElementRef,
22   - Inject, Input,
  22 + Inject, Input, NgZone,
23 23 OnDestroy,
24 24 ViewContainerRef
25 25 } from '@angular/core';
... ... @@ -48,40 +48,43 @@ export class ToastDirective implements AfterViewInit, OnDestroy {
48 48 private hideNotificationSubscription: Subscription = null;
49 49
50 50 private snackBarRef: MatSnackBarRef<TbSnackBarComponent> = null;
  51 + private currentMessage: NotificationMessage = null;
51 52
52 53 constructor(public elementRef: ElementRef,
53 54 public viewContainerRef: ViewContainerRef,
54 55 private notificationService: NotificationService,
55 56 public snackBar: MatSnackBar,
  57 + private ngZone: NgZone,
56 58 private breakpointObserver: BreakpointObserver) {
57 59 }
58 60
59 61 ngAfterViewInit(): void {
60 62 this.notificationSubscription = this.notificationService.getNotification().subscribe(
61 63 (notificationMessage) => {
62   - if (notificationMessage && notificationMessage.message) {
63   - const target = notificationMessage.target || 'root';
64   - if (this.toastTarget === target) {
65   - const data = {
66   - parent: this.elementRef,
67   - notification: notificationMessage
68   - };
69   - const isGtSm = this.breakpointObserver.isMatched(MediaBreakpoints['gt-sm']);
70   - const config: MatSnackBarConfig = {
71   - horizontalPosition: notificationMessage.horizontalPosition || 'left',
72   - verticalPosition: !isGtSm ? 'bottom' : (notificationMessage.verticalPosition || 'top'),
73   - viewContainerRef: this.viewContainerRef,
74   - duration: notificationMessage.duration,
75   - data
76   - };
  64 + if (this.shouldDisplayMessage(notificationMessage)) {
  65 + this.currentMessage = notificationMessage;
  66 + const data = {
  67 + parent: this.elementRef,
  68 + notification: notificationMessage
  69 + };
  70 + const isGtSm = this.breakpointObserver.isMatched(MediaBreakpoints['gt-sm']);
  71 + const config: MatSnackBarConfig = {
  72 + horizontalPosition: notificationMessage.horizontalPosition || 'left',
  73 + verticalPosition: !isGtSm ? 'bottom' : (notificationMessage.verticalPosition || 'top'),
  74 + viewContainerRef: this.viewContainerRef,
  75 + duration: notificationMessage.duration,
  76 + data
  77 + };
  78 + this.ngZone.run(() => {
77 79 if (this.snackBarRef) {
78 80 this.snackBarRef.dismiss();
79 81 }
80 82 this.snackBarRef = this.snackBar.openFromComponent(TbSnackBarComponent, config);
81 83 this.snackBarRef.afterDismissed().subscribe(() => {
82 84 this.snackBarRef = null;
  85 + this.currentMessage = null;
83 86 });
84   - }
  87 + });
85 88 }
86 89 }
87 90 );
... ... @@ -91,13 +94,30 @@ export class ToastDirective implements AfterViewInit, OnDestroy {
91 94 if (hideNotification) {
92 95 const target = hideNotification.target || 'root';
93 96 if (this.toastTarget === target) {
94   - this.snackBar.dismiss();
  97 + this.ngZone.run(() => {
  98 + if (this.snackBarRef) {
  99 + this.snackBarRef.dismiss();
  100 + }
  101 + });
95 102 }
96 103 }
97 104 }
98 105 );
99 106 }
100 107
  108 + private shouldDisplayMessage(notificationMessage: NotificationMessage): boolean {
  109 + if (notificationMessage && notificationMessage.message) {
  110 + const target = notificationMessage.target || 'root';
  111 + if (this.toastTarget === target) {
  112 + if (!this.currentMessage || this.currentMessage.message !== notificationMessage.message
  113 + || this.currentMessage.type !== notificationMessage.type) {
  114 + return true;
  115 + }
  116 + }
  117 + }
  118 + return false;
  119 + }
  120 +
101 121 ngOnDestroy(): void {
102 122 if (this.notificationSubscription) {
103 123 this.notificationSubscription.unsubscribe();
... ...