diff --git a/config/environment.default.js b/config/environment.default.js
index ad7be69b9e..bb0ac12680 100644
--- a/config/environment.default.js
+++ b/config/environment.default.js
@@ -21,6 +21,12 @@ module.exports = {
msToLive: 15 * 60 * 1000, // 15 minute
control: 'max-age=60' // revalidate browser
},
+ // Notifications
+ notifications: {
+ rtl: false,
+ position: ['top', 'right'],
+ maxStack: 8
+ },
// Angular Universal settings
universal: {
preboot: true,
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 3e71fafc5c..d806bb8323 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -3,9 +3,7 @@
+ [options]="config.notifications">
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index f5ace25acf..c0bc7a1147 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -10,7 +10,6 @@ import { MetadataService } from './core/metadata/metadata.service';
import { HostWindowResizeAction } from './shared/host-window.actions';
import { HostWindowState } from './shared/host-window.reducer';
import { NativeWindowRef, NativeWindowService } from './shared/window.service';
-import { INotificationBoardOptions } from './shared/notifications/models/notification-options.model';
@Component({
selector: 'ds-app',
@@ -21,22 +20,6 @@ import { INotificationBoardOptions } from './shared/notifications/models/notific
})
export class AppComponent implements OnInit {
- public boardOptions: INotificationBoardOptions = {
- position: ['top', 'right'],
- maxStack: 5,
- rtl: false
- };
-
- notificationCreated(event) {
- console.log('Notification created');
- console.log(event);
- }
-
- notificationDestroyed() {
- console.log('Notification destroyed');
- console.log(event);
- }
-
constructor(@Inject(GLOBAL_CONFIG) public config: GlobalConfig,
@Inject(NativeWindowService) private _window: NativeWindowRef,
private translate: TranslateService,
diff --git a/src/app/shared/notifications/models/notification-options.model.ts b/src/app/shared/notifications/models/notification-options.model.ts
index 3520727ec3..0520bd1918 100644
--- a/src/app/shared/notifications/models/notification-options.model.ts
+++ b/src/app/shared/notifications/models/notification-options.model.ts
@@ -3,35 +3,20 @@ import { NotificationAnimationsType } from './notification-animations-type';
export interface INotificationOptions {
timeOut: number;
clickToClose: boolean;
- rtl: boolean;
animate: NotificationAnimationsType;
- position: ['top' | 'bottom' | 'middle', 'right' | 'left' | 'center'];
}
export class NotificationOptions implements INotificationOptions {
public timeOut: number;
public clickToClose: boolean;
- public rtl: boolean;
public animate: any;
- public position: any;
constructor(timeOut = 0,
clickToClose = true,
- animate = NotificationAnimationsType.Scale,
- position = ['top' , 'right'],
- rtl = false) {
+ animate = NotificationAnimationsType.Scale) {
this.timeOut = timeOut;
this.clickToClose = clickToClose;
this.animate = animate;
- this.position = position;
- this.rtl = rtl;
}
}
-
-export interface INotificationBoardOptions {
- rtl: boolean;
- position: ['top' | 'bottom' | 'middle', 'right' | 'left' | 'center'];
- maxStack: number;
- maxLength?: number;
-}
diff --git a/src/app/shared/notifications/notification/notification.component.ts b/src/app/shared/notifications/notification/notification.component.ts
index da0d9948ed..59bc4ab8f3 100644
--- a/src/app/shared/notifications/notification/notification.component.ts
+++ b/src/app/shared/notifications/notification/notification.component.ts
@@ -61,11 +61,8 @@ export class NotificationComponent implements OnInit, OnDestroy {
private steps: number;
private speed: number;
private count = 0;
-
private start: any;
private diff: any;
-
- // 'fade' | 'fromTop' | 'fromRight' | 'fromBottom' | 'fromLeft' | 'rotate' | 'scale' ;
public animate: string;
constructor(private notificationService: NotificationsService,
diff --git a/src/app/shared/notifications/notifications-board/notifications-board.component.ts b/src/app/shared/notifications/notifications-board/notifications-board.component.ts
index 833397b7cd..80a4a99972 100644
--- a/src/app/shared/notifications/notifications-board/notifications-board.component.ts
+++ b/src/app/shared/notifications/notifications-board/notifications-board.component.ts
@@ -2,11 +2,9 @@ import {
ChangeDetectionStrategy,
ChangeDetectorRef,
Component,
- EventEmitter,
Input,
OnDestroy,
OnInit,
- Output,
ViewEncapsulation
} from '@angular/core';
import { NotificationsService } from '../notifications.service';
@@ -16,8 +14,8 @@ import { notificationsStateSelector } from '../selectors';
import { difference } from 'lodash';
import { INotification } from '../models/notification.model';
import { NotificationsState } from '../notifications.reducers';
-import { INotificationBoardOptions } from '../models/notification-options.model';
import { Subscription } from 'rxjs/Subscription';
+import { INotificationBoardOptions } from '../../../../config/notifications-config.interfaces';
@Component({
selector: 'ds-notifications-board',
@@ -33,9 +31,6 @@ export class NotificationsBoardComponent implements OnInit, OnDestroy {
this.attachChanges(opt);
}
- @Output() onCreate = new EventEmitter();
- @Output() onDestroy = new EventEmitter();
-
public notifications: INotification[] = [];
public position: ['top' | 'bottom' | 'middle', 'right' | 'left' | 'center'] = ['bottom', 'right'];
@@ -60,8 +55,6 @@ export class NotificationsBoardComponent implements OnInit, OnDestroy {
} else if (state.length > this.notifications.length) {
// Add
const newElem = difference(state, this.notifications);
- console.log('new Elements #', newElem.length);
-
newElem.forEach((notification) => {
this.add(notification);
});
diff --git a/src/config/notifications-config.interfaces.ts b/src/config/notifications-config.interfaces.ts
new file mode 100644
index 0000000000..6bd28a69d1
--- /dev/null
+++ b/src/config/notifications-config.interfaces.ts
@@ -0,0 +1,7 @@
+import { Config } from './config.interface';
+
+export interface INotificationBoardOptions extends Config {
+ rtl: boolean;
+ position: ['top' | 'bottom' | 'middle', 'right' | 'left' | 'center'];
+ maxStack: number;
+}