MOBILE-3068 blogs: Fix infinite loading performance on my entries

main
Pau Ferrer Ocaña 2019-08-23 13:33:53 +02:00
parent f3a51a3717
commit fd6c700ff8
2 changed files with 63 additions and 12 deletions

View File

@ -4,9 +4,9 @@
</ion-refresher>
<core-loading [hideUntil]="loaded" class="core-loading-center">
<div class="safe-padding-horizontal">
<ion-item *ngIf="showMyIssuesToggle">
<ion-item *ngIf="showMyEntriesToggle">
<ion-label>{{ 'addon.blog.showonlyyourentries' | translate }}</ion-label>
<ion-toggle [(ngModel)]="onlyMyEntries"></ion-toggle>
<ion-toggle [(ngModel)]="onlyMyEntries" (ionChange)="onlyMyEntriesToggleChanged(onlyMyEntries)">></ion-toggle>
</ion-item>
</div>
<core-empty-box *ngIf="entries && entries.length == 0" icon="fa-newspaper-o" [message]="'addon.blog.noentriesyet' | translate"></core-empty-box>

View File

@ -15,6 +15,7 @@
import { Component, Input, OnInit, ViewChild } from '@angular/core';
import { Content } from 'ionic-angular';
import { CoreDomUtilsProvider } from '@providers/utils/dom';
import { CoreUtilsProvider } from '@providers/utils/utils';
import { CoreSitesProvider } from '@providers/sites';
import { CoreUserProvider } from '@core/user/providers/user';
import { AddonBlogProvider } from '../../providers/blog';
@ -38,6 +39,9 @@ export class AddonBlogEntriesComponent implements OnInit {
protected filter = {};
protected pageLoaded = 0;
protected userPageLoaded = 0;
protected canLoadMoreEntries = false;
protected canLoadMoreUserEntries = true;
@ViewChild(Content) content: Content;
@ -46,14 +50,14 @@ export class AddonBlogEntriesComponent implements OnInit {
loadMoreError = false;
entries = [];
currentUserId: number;
showMyIssuesToggle = false;
showMyEntriesToggle = false;
onlyMyEntries = false;
component = AddonBlogProvider.COMPONENT;
commentsEnabled: boolean;
tagsEnabled: boolean;
constructor(protected blogProvider: AddonBlogProvider, protected domUtils: CoreDomUtilsProvider,
protected userProvider: CoreUserProvider, sitesProvider: CoreSitesProvider,
protected userProvider: CoreUserProvider, sitesProvider: CoreSitesProvider, protected utils: CoreUtilsProvider,
protected commentsProvider: CoreCommentsProvider, private tagProvider: CoreTagProvider) {
this.currentUserId = sitesProvider.getCurrentSiteUserId();
}
@ -65,6 +69,7 @@ export class AddonBlogEntriesComponent implements OnInit {
if (this.userId) {
this.filter['userid'] = this.userId;
}
this.showMyEntriesToggle = !this.userId;
if (this.courseId) {
this.filter['courseid'] = this.courseId;
@ -107,9 +112,12 @@ export class AddonBlogEntriesComponent implements OnInit {
if (refresh) {
this.pageLoaded = 0;
this.userPageLoaded = 0;
}
return this.blogProvider.getEntries(this.filter, this.pageLoaded).then((result) => {
const loadPage = this.onlyMyEntries ? this.userPageLoaded : this.pageLoaded;
return this.blogProvider.getEntries(this.filter, loadPage).then((result) => {
const promises = result.entries.map((entry) => {
switch (entry.publishstate) {
case 'draft':
@ -134,16 +142,25 @@ export class AddonBlogEntriesComponent implements OnInit {
});
if (refresh) {
this.showMyIssuesToggle = false;
this.entries = result.entries;
} else {
this.entries = this.entries.concat(result.entries);
this.entries = this.utils.uniqueArray(this.entries.concat(result.entries), 'id').sort((a, b) => {
return b.created - a.created;
});
}
this.canLoadMore = result.totalentries > this.entries.length;
this.pageLoaded++;
this.showMyIssuesToggle = !this.userId;
if (this.onlyMyEntries) {
const count = this.entries.filter((entry) => {
return entry.userid == this.currentUserId;
}).length;
this.canLoadMoreUserEntries = result.totalentries > count;
this.canLoadMore = this.canLoadMoreUserEntries;
this.userPageLoaded++;
} else {
this.canLoadMoreEntries = result.totalentries > this.entries.length;
this.canLoadMore = this.canLoadMoreEntries;
this.pageLoaded++;
}
return Promise.all(promises);
}).catch((message) => {
@ -154,6 +171,30 @@ export class AddonBlogEntriesComponent implements OnInit {
});
}
/**
* Toggle between showing only my entries or not.
*
* @param {boolean} enabled If true, filter my entries. False otherwise.
*/
onlyMyEntriesToggleChanged(enabled: boolean): void {
if (enabled) {
const count = this.entries.filter((entry) => {
return entry.userid == this.currentUserId;
}).length;
this.userPageLoaded = Math.floor(count / AddonBlogProvider.ENTRIES_PER_PAGE);
this.filter['userid'] = this.currentUserId;
if (count == 0 && this.canLoadMoreUserEntries) {
// First time but no entry loaded. Try to load some.
this.loadMore();
}
} else {
delete this.filter['userid'];
}
this.canLoadMore = enabled ? this.canLoadMoreUserEntries : this.canLoadMoreEntries;
}
/**
* Function to load more entries.
*
@ -178,7 +219,17 @@ export class AddonBlogEntriesComponent implements OnInit {
promises.push(this.blogProvider.invalidateEntries(this.filter));
Promise.all(promises).finally(() => {
if (this.showMyEntriesToggle) {
this.filter['userid'] = this.currentUserId;
promises.push(this.blogProvider.invalidateEntries(this.filter));
if (!this.showMyEntriesToggle) {
delete this.filter['userid'];
}
}
this.utils.allPromises(promises).finally(() => {
this.fetchEntries(true).finally(() => {
if (refresher) {
refresher.complete();