@sumaris-net/ngx-components 1.22.11-rc5 → 1.22.11-rc9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/sumaris-net.ngx-components.umd.js +40 -13
- package/bundles/sumaris-net.ngx-components.umd.js.map +1 -1
- package/bundles/sumaris-net.ngx-components.umd.min.js +2 -2
- package/bundles/sumaris-net.ngx-components.umd.min.js.map +1 -1
- package/esm2015/src/app/shared/events.js +8 -3
- package/esm2015/src/app/social/user-event/notification/user-event-notification.icon.js +2 -2
- package/esm2015/src/app/social/user-event/notification/user-event-notification.list.js +12 -9
- package/esm2015/src/app/social/user-event/testing/user-event.testing.js +19 -2
- package/esm2015/src/app/social/user-event/user-event.model.js +1 -1
- package/esm2015/src/app/social/user-event/user-event.service.js +2 -1
- package/fesm2015/sumaris-net.ngx-components.js +38 -12
- package/fesm2015/sumaris-net.ngx-components.js.map +1 -1
- package/package.json +1 -1
- package/src/app/shared/events.d.ts +1 -1
- package/src/app/social/user-event/notification/user-event-notification.list.d.ts +1 -0
- package/src/app/social/user-event/testing/user-event.testing.d.ts +1 -0
- package/src/app/social/user-event/user-event.model.d.ts +1 -0
- package/src/theme/_ngx-components.scss +12 -0
- package/sumaris-net.ngx-components.metadata.json +1 -1
|
@@ -1151,7 +1151,7 @@
|
|
|
1151
1151
|
* @param element
|
|
1152
1152
|
* @param threshold default to '15%'
|
|
1153
1153
|
*/
|
|
1154
|
-
function fromScrollEndEvent(element, threshold) {
|
|
1154
|
+
function fromScrollEndEvent(element, threshold, dueTime) {
|
|
1155
1155
|
threshold = threshold || '15%';
|
|
1156
1156
|
var isEnd;
|
|
1157
1157
|
// Listen using percentage
|
|
@@ -1173,7 +1173,12 @@
|
|
|
1173
1173
|
else {
|
|
1174
1174
|
throw new Error('Invalid argument \'threshold\'. Expected value unit: \'px\' or \'%\' ');
|
|
1175
1175
|
}
|
|
1176
|
-
|
|
1176
|
+
// Check bottom reach, even if NO scroll event (e.g. when already reach the bottom)
|
|
1177
|
+
if (dueTime > 0) {
|
|
1178
|
+
return rxjs.merge(rxjs.fromEvent(element, 'scroll'), rxjs.timer(dueTime))
|
|
1179
|
+
.pipe(operators.filter(function () { return isEnd(); }));
|
|
1180
|
+
}
|
|
1181
|
+
return rxjs.fromEvent(element, 'scroll')
|
|
1177
1182
|
.pipe(operators.filter(function () { return isEnd(); }));
|
|
1178
1183
|
}
|
|
1179
1184
|
|
|
@@ -30457,6 +30462,7 @@
|
|
|
30457
30462
|
filter = this.defaultFilter();
|
|
30458
30463
|
// Apply last reset date as start date
|
|
30459
30464
|
filter.startDate = this.resetCountDate;
|
|
30465
|
+
filter.excludeRead = true;
|
|
30460
30466
|
filter = this.asFilter(filter);
|
|
30461
30467
|
if (this._debug)
|
|
30462
30468
|
console.debug(this._logPrefix + "[WS] Listening count changes for user events with filter:", filter);
|
|
@@ -30890,7 +30896,7 @@
|
|
|
30890
30896
|
}
|
|
30891
30897
|
Object.defineProperty(UserEventNotificationList.prototype, "canFetchMore", {
|
|
30892
30898
|
get: function () {
|
|
30893
|
-
return !!this._fetchMoreFn;
|
|
30899
|
+
return this.enableInfiniteScroll && !!this._fetchMoreFn;
|
|
30894
30900
|
},
|
|
30895
30901
|
enumerable: false,
|
|
30896
30902
|
configurable: true
|
|
@@ -30926,11 +30932,15 @@
|
|
|
30926
30932
|
return; // Skip
|
|
30927
30933
|
// MarkAsRead
|
|
30928
30934
|
this.markAsRead(event, userEvent);
|
|
30929
|
-
|
|
30930
|
-
|
|
30931
|
-
|
|
30935
|
+
// Get the default action (if any)
|
|
30936
|
+
var defaultAction = ((userEvent === null || userEvent === void 0 ? void 0 : userEvent.actions) || []).find(function (a) { return a.default; });
|
|
30937
|
+
if (defaultAction) {
|
|
30938
|
+
this.executeAction(event, defaultAction, userEvent);
|
|
30932
30939
|
}
|
|
30933
30940
|
};
|
|
30941
|
+
UserEventNotificationList.prototype.isDefaultAction = function (action) {
|
|
30942
|
+
return action && action.default || false;
|
|
30943
|
+
};
|
|
30934
30944
|
UserEventNotificationList.prototype.markAsRead = function (event, userEvent) {
|
|
30935
30945
|
var _a;
|
|
30936
30946
|
if (userEvent === null || userEvent === void 0 ? void 0 : userEvent.readDate)
|
|
@@ -31018,7 +31028,7 @@
|
|
|
31018
31028
|
};
|
|
31019
31029
|
UserEventNotificationList.prototype._initInfiniteScroll = function (threshold) {
|
|
31020
31030
|
return __awaiter(this, void 0, void 0, function () {
|
|
31021
|
-
var panel
|
|
31031
|
+
var panel;
|
|
31022
31032
|
var _this = this;
|
|
31023
31033
|
return __generator(this, function (_b) {
|
|
31024
31034
|
switch (_b.label) {
|
|
@@ -31032,9 +31042,8 @@
|
|
|
31032
31042
|
return [4 /*yield*/, this.ionContent.getScrollElement()];
|
|
31033
31043
|
case 2:
|
|
31034
31044
|
panel = _b.sent();
|
|
31035
|
-
scrollEnd$ = fromScrollEndEvent(panel, threshold);
|
|
31036
31045
|
// Trigger fetch more, end end scroll reached
|
|
31037
|
-
this._fetchMoreSubscription =
|
|
31046
|
+
this._fetchMoreSubscription = fromScrollEndEvent(panel, threshold, 250 /*force to check when no scrollbar - e.g. in large screen*/)
|
|
31038
31047
|
.subscribe(function () { return _this.fetchMore(); });
|
|
31039
31048
|
this.subscriptions.add(this._fetchMoreSubscription);
|
|
31040
31049
|
return [2 /*return*/];
|
|
@@ -31050,9 +31059,9 @@
|
|
|
31050
31059
|
UserEventNotificationList.decorators = [
|
|
31051
31060
|
{ type: i0.Component, args: [{
|
|
31052
31061
|
selector: 'app-user-event-notification-list',
|
|
31053
|
-
template: "<ion-content>\n <ion-list class=\"ion-list-popover\">\n\n <ion-row class=\"ion-list-header column\">\n <ion-col>\n <ion-label>{{titleI18n | translate}}</ion-label>\n </ion-col>\n <ion-col class=\"top-action\" *ngIf=\"$items|async|isNotEmptyArray\">\n <ion-text color=\"primary\">\n <a (click)=\"markAllAsRead($event)\">{{'SOCIAL.USER_EVENT.NOTIFICATION.READ_ALL' | translate}}</a>\n </ion-text>\n </ion-col>\n </ion-row>\n\n <ion-item\n *ngFor=\"let
|
|
31062
|
+
template: "<ion-content>\n <ion-list class=\"ion-list-popover\">\n\n <ion-row class=\"ion-list-header column\">\n <ion-col>\n <ion-label>{{titleI18n | translate}}</ion-label>\n </ion-col>\n <ion-col class=\"top-action\" *ngIf=\"$items|async|isNotEmptyArray\">\n <ion-text color=\"primary\">\n <a (click)=\"markAllAsRead($event)\">{{'SOCIAL.USER_EVENT.NOTIFICATION.READ_ALL' | translate}}</a>\n </ion-text>\n </ion-col>\n </ion-row>\n\n <ion-item\n *ngFor=\"let item of $items | async; last as last\"\n [lines]=\"last ? 'none' : undefined\"\n [class.unread]=\"!item.readDate\"\n [class.tappable]=\"item.actions|arrayFilter:isDefaultAction|isNotEmptyArray\"\n (click)=\"click($event, item)\">\n\n <ion-avatar slot=\"start\">\n\n <img *ngIf=\"item.avatar; else avatarIcon\" src=\"{{ item.avatar }}\">\n\n <ng-template #avatarIcon>\n <app-icon\n *ngIf=\"item.avatarIcon\"\n [ref]=\"item.avatarIcon\"\n height=\"40\"\n width=\"40\"\n ></app-icon>\n </ng-template>\n\n </ion-avatar>\n\n <ion-grid class=\"ion-no-margin ion-no-padding message\">\n <ion-row>\n <ion-col size=\"12\">\n <p [class.unread]=\"!item.readDate\" [innerHTML]=\"item.message\"></p>\n </ion-col>\n </ion-row>\n\n <!-- date -->\n <ion-row>\n <ion-col size=\"12\">\n <app-icon\n *ngIf=\"item.icon\"\n [ref]=\"item.icon\"\n height=\"16\"\n width=\"16\"\n style=\"vertical-align: sub; margin-right: 3px\"\n ></app-icon>\n <small>\n <span>{{item.creationDate|dateFromNow}}</span>\n <span style=\"color: gray\">{{ ' | ' + (item.creationDate|dateFormat:{time:true}) }}</span>\n </small>\n </ion-col>\n </ion-row>\n\n <!-- actions -->\n <ion-row *ngIf=\"item.actions|isNotEmptyArray\">\n <ion-col></ion-col>\n <ion-col size=\"auto\">\n <ng-container *ngFor=\"let action of item.actions\">\n <a *ngIf=\"!action.default\" class=\"action\" (click)=\"executeAction($event, action, item)\" [title]=\"(action.title || action.name) |translate\">\n <app-icon *ngIf=\"action.iconRef\" slot=\"start\" height=\"20\" width=\"20\" [ref]=\"action.iconRef\"></app-icon>\n <span>{{ action.name | translate }}</span>\n </a>\n </ng-container>\n </ion-col>\n </ion-row>\n\n </ion-grid>\n\n <mat-icon slot=\"end\" *ngIf=\"item.actions|arrayFilter: isDefaultAction|isNotEmptyArray\">chevron_right</mat-icon>\n </ion-item>\n\n <!-- loading -->\n <ion-item *ngIf=\"!($items|async); else noResult\" lines=\"none\" disabled>\n <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n </ion-item>\n\n <!-- no result -->\n <ng-template #noResult>\n <ion-item *ngIf=\"$items|async|isEmptyArray\" lines=\"none\">\n <ion-text color=\"dark\" class=\"text-italic\">{{'SOCIAL.USER_EVENT.NOTIFICATION.EMPTY' | translate}}</ion-text>\n </ion-item>\n </ng-template>\n\n <!-- Loading more spinner -->\n <ion-item *ngIf=\"canFetchMore\" (ngInit)=\"_initInfiniteScroll()\" lines=\"none\" disabled>\n <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n </ion-item>\n\n <!-- footer -->\n <ion-row *ngIf=\"$itemCount|async; let count\"\n class=\"ion-list-footer column\">\n <ion-col>\n <ion-text class=\"ion-float-end ion-padding-end\"><i>{{'COMMON.RESULT_COUNT'|translate: {count: count} }}</i></ion-text>\n </ion-col>\n </ion-row>\n\n </ion-list>\n</ion-content>\n",
|
|
31054
31063
|
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
31055
|
-
styles: [":host(.popover-viewport){overflow-y:auto;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;max-height:calc(90vh - 20px)}.
|
|
31064
|
+
styles: [":host(.popover-viewport){overflow-y:auto;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;max-height:calc(90vh - 20px)}ion-list ion-item.tappable{cursor:pointer}ion-list ion-item.tappable:hover{--ion-item-background:var(--ion-item-background-color-hover)}.message{font-size:.9em}.message p{margin-top:5px;margin-bottom:5px}.message p.unread{font-weight:700}.top-action{text-align:end;margin-right:8px}.top-action a{cursor:pointer;color:var(--ion-color-contrast)}.top-action a:hover{text-decoration:underline}a.action{font-size:.9em;margin-right:10px;cursor:pointer}a.action:hover span{text-decoration:underline}a.action app-icon{vertical-align:middle}"]
|
|
31056
31065
|
},] }
|
|
31057
31066
|
];
|
|
31058
31067
|
UserEventNotificationList.ctorParameters = function () { return [
|
|
@@ -31149,7 +31158,7 @@
|
|
|
31149
31158
|
keyboardClose: true,
|
|
31150
31159
|
event: event,
|
|
31151
31160
|
translucent: true,
|
|
31152
|
-
cssClass: 'popover-large'
|
|
31161
|
+
cssClass: 'popover-large popover-notifications'
|
|
31153
31162
|
})];
|
|
31154
31163
|
case 1:
|
|
31155
31164
|
popover = _a.sent();
|
|
@@ -34409,6 +34418,24 @@
|
|
|
34409
34418
|
]
|
|
34410
34419
|
}));
|
|
34411
34420
|
};
|
|
34421
|
+
UserEventTestingPage.prototype.addNotificationWithDefaultAction = function () {
|
|
34422
|
+
var _this = this;
|
|
34423
|
+
this.userEventService.add(exports.UserEvent.fromObject({
|
|
34424
|
+
issuer: 'system',
|
|
34425
|
+
recipient: 'me',
|
|
34426
|
+
type: 'message',
|
|
34427
|
+
level: 'INFO',
|
|
34428
|
+
message: 'message with action',
|
|
34429
|
+
creationDate: moment$a(),
|
|
34430
|
+
actions: [
|
|
34431
|
+
{
|
|
34432
|
+
default: true,
|
|
34433
|
+
name: 'default',
|
|
34434
|
+
executeAction: function (event) { _this.showMessage('default action'); }
|
|
34435
|
+
}
|
|
34436
|
+
]
|
|
34437
|
+
}));
|
|
34438
|
+
};
|
|
34412
34439
|
UserEventTestingPage.prototype.showMessage = function (text) {
|
|
34413
34440
|
return Alerts.showError(text, this.alertController, this.translateService);
|
|
34414
34441
|
};
|
|
@@ -34417,7 +34444,7 @@
|
|
|
34417
34444
|
UserEventTestingPage.decorators = [
|
|
34418
34445
|
{ type: i0.Component, args: [{
|
|
34419
34446
|
selector: 'job-progression-testing',
|
|
34420
|
-
template: "<ion-toolbar color=\"primary\">\n <ion-title>User events</ion-title>\n</ion-toolbar>\n\n<ion-content class=\"ion-padding\">\n\n <app-user-event-notification-icon #notification [debug]=\"true\"></app-user-event-notification-icon>\n\n <p>\n <ion-button (click)=\"addNotification()\">Add notification</ion-button>\n <ion-button (click)=\"addError()\">Add error</ion-button>\n <ion-button (click)=\"addWarning()\">Add warning</ion-button>\n <ion-button (click)=\"addDebug()\">Add debug</ion-button>\n </p>\n <p>\n <ion-button (click)=\"addNotificationWithLink()\">Add notification with link</ion-button>\n <ion-button (click)=\"addNotificationWithAction()\">Add notification with action</ion-button>\n </p>\n</ion-content>\n"
|
|
34447
|
+
template: "<ion-toolbar color=\"primary\">\n <ion-title>User events</ion-title>\n</ion-toolbar>\n\n<ion-content class=\"ion-padding\">\n\n <app-user-event-notification-icon #notification [debug]=\"true\"></app-user-event-notification-icon>\n\n <p>\n <ion-button (click)=\"addNotification()\">Add notification</ion-button>\n <ion-button (click)=\"addError()\">Add error</ion-button>\n <ion-button (click)=\"addWarning()\">Add warning</ion-button>\n <ion-button (click)=\"addDebug()\">Add debug</ion-button>\n </p>\n <p>\n <ion-button (click)=\"addNotificationWithLink()\">Add notification with link</ion-button>\n <ion-button (click)=\"addNotificationWithAction()\">Add notification with action</ion-button>\n <ion-button (click)=\"addNotificationWithDefaultAction()\">Add notification with default action</ion-button>\n </p>\n</ion-content>\n"
|
|
34421
34448
|
},] }
|
|
34422
34449
|
];
|
|
34423
34450
|
UserEventTestingPage.ctorParameters = function () { return [
|