@sumaris-net/ngx-components 1.22.11-rc5 → 1.22.11-rc6
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 +10 -6
- 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.list.js +3 -4
- package/fesm2015/sumaris-net.ngx-components.js +9 -5
- 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/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
|
|
|
@@ -31018,7 +31023,7 @@
|
|
|
31018
31023
|
};
|
|
31019
31024
|
UserEventNotificationList.prototype._initInfiniteScroll = function (threshold) {
|
|
31020
31025
|
return __awaiter(this, void 0, void 0, function () {
|
|
31021
|
-
var panel
|
|
31026
|
+
var panel;
|
|
31022
31027
|
var _this = this;
|
|
31023
31028
|
return __generator(this, function (_b) {
|
|
31024
31029
|
switch (_b.label) {
|
|
@@ -31032,9 +31037,8 @@
|
|
|
31032
31037
|
return [4 /*yield*/, this.ionContent.getScrollElement()];
|
|
31033
31038
|
case 2:
|
|
31034
31039
|
panel = _b.sent();
|
|
31035
|
-
scrollEnd$ = fromScrollEndEvent(panel, threshold);
|
|
31036
31040
|
// Trigger fetch more, end end scroll reached
|
|
31037
|
-
this._fetchMoreSubscription =
|
|
31041
|
+
this._fetchMoreSubscription = fromScrollEndEvent(panel, threshold, 250 /*force to check when no scrollbar - e.g. in large screen*/)
|
|
31038
31042
|
.subscribe(function () { return _this.fetchMore(); });
|
|
31039
31043
|
this.subscriptions.add(this._fetchMoreSubscription);
|
|
31040
31044
|
return [2 /*return*/];
|
|
@@ -31050,7 +31054,7 @@
|
|
|
31050
31054
|
UserEventNotificationList.decorators = [
|
|
31051
31055
|
{ type: i0.Component, args: [{
|
|
31052
31056
|
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 userEvent of $items | async; last as last\"\n [lines]=\"last ? 'none' : undefined\"\n (click)=\"click($event, userEvent)\"\n >\n\n <ion-avatar slot=\"start\">\n\n <img *ngIf=\"userEvent.avatar; else avatarIcon\" src=\"{{ userEvent.avatar }}\">\n\n <ng-template #avatarIcon>\n <app-icon\n *ngIf=\"userEvent.avatarIcon\"\n [ref]=\"userEvent.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>\n <p [class.unread]=\"!userEvent.readDate\" [innerHTML]=\"userEvent.message\"></p>\n </ion-col>\n </ion-row>\n <ion-row *ngIf=\"userEvent.actions?.length\">\n <ion-col>\n <span *ngFor=\"let action of userEvent.actions\" class=\"action\">\n <a (click)=\"executeAction($event, action, userEvent)\" [title]=\"action.title|translate\">\n <app-icon *ngIf=\"action.iconRef\" slot=\"start\" height=\"20\" width=\"20\" [ref]=\"action.iconRef\"></app-icon>\n {{ action.name | translate }}\n </a>\n </span>\n </ion-col>\n </ion-row>\n <ion-row>\n <ion-col>\n <app-icon\n *ngIf=\"userEvent.icon\"\n [ref]=\"userEvent.icon\"\n height=\"16\"\n width=\"16\"\n style=\"vertical-align: sub; margin-right: 3px\"\n ></app-icon>\n <small>\n <span>{{userEvent.creationDate|dateFromNow}}</span>\n <span style=\"color: gray\">{{ ' | ' + (userEvent.creationDate|dateFormat:{time:true}) }}</span>\n </small>\n </ion-col>\n </ion-row>\n </ion-grid>\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 <!--
|
|
31057
|
+
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 userEvent of $items | async; last as last\"\n [lines]=\"last ? 'none' : undefined\"\n (click)=\"click($event, userEvent)\"\n >\n\n <ion-avatar slot=\"start\">\n\n <img *ngIf=\"userEvent.avatar; else avatarIcon\" src=\"{{ userEvent.avatar }}\">\n\n <ng-template #avatarIcon>\n <app-icon\n *ngIf=\"userEvent.avatarIcon\"\n [ref]=\"userEvent.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>\n <p [class.unread]=\"!userEvent.readDate\" [innerHTML]=\"userEvent.message\"></p>\n </ion-col>\n </ion-row>\n <ion-row *ngIf=\"userEvent.actions?.length\">\n <ion-col>\n <span *ngFor=\"let action of userEvent.actions\" class=\"action\">\n <a (click)=\"executeAction($event, action, userEvent)\" [title]=\"action.title|translate\">\n <app-icon *ngIf=\"action.iconRef\" slot=\"start\" height=\"20\" width=\"20\" [ref]=\"action.iconRef\"></app-icon>\n {{ action.name | translate }}\n </a>\n </span>\n </ion-col>\n </ion-row>\n <ion-row>\n <ion-col>\n <app-icon\n *ngIf=\"userEvent.icon\"\n [ref]=\"userEvent.icon\"\n height=\"16\"\n width=\"16\"\n style=\"vertical-align: sub; margin-right: 3px\"\n ></app-icon>\n <small>\n <span>{{userEvent.creationDate|dateFromNow}}</span>\n <span style=\"color: gray\">{{ ' | ' + (userEvent.creationDate|dateFormat:{time:true}) }}</span>\n </small>\n </ion-col>\n </ion-row>\n </ion-grid>\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
31058
|
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
31055
31059
|
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)}.unread{font-weight:700}.message{font-size:.9em}.message p{margin-top:5px;margin-bottom:5px}.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}.action a{margin-right:10px;cursor:pointer}.action app-icon{vertical-align:middle}"]
|
|
31056
31060
|
},] }
|