From 65f0407659a8a618ba7a0eab9ec1ff11b98a4cbb Mon Sep 17 00:00:00 2001 From: Albert Gasset Date: Wed, 10 Apr 2019 13:30:30 +0200 Subject: [PATCH] MOBILE-2949 data: Display loading spinner until all entry info is loaded --- src/addon/mod/data/pages/entry/entry.html | 10 ++-- src/addon/mod/data/pages/entry/entry.ts | 56 ++++++++++++++++++----- 2 files changed, 49 insertions(+), 17 deletions(-) diff --git a/src/addon/mod/data/pages/entry/entry.html b/src/addon/mod/data/pages/entry/entry.html index 1767dc9c0..aef6d0da0 100644 --- a/src/addon/mod/data/pages/entry/entry.html +++ b/src/addon/mod/data/pages/entry/entry.html @@ -4,10 +4,10 @@ - + - +
@@ -25,14 +25,14 @@
- +
- + - + diff --git a/src/addon/mod/data/pages/entry/entry.ts b/src/addon/mod/data/pages/entry/entry.ts index 6f6cf7649..2c568ab8d 100644 --- a/src/addon/mod/data/pages/entry/entry.ts +++ b/src/addon/mod/data/pages/entry/entry.ts @@ -12,7 +12,7 @@ // See the License for the specific language governing permissions and // limitations under the License. -import { Component, ViewChild, OnDestroy } from '@angular/core'; +import { ChangeDetectorRef, Component, ViewChild, OnDestroy } from '@angular/core'; import { Content, IonicPage, NavParams, NavController } from 'ionic-angular'; import { CoreUtilsProvider } from '@providers/utils/utils'; import { CoreDomUtilsProvider } from '@providers/utils/dom'; @@ -51,6 +51,9 @@ export class AddonModDataEntryPage implements OnDestroy { moduleName = 'data'; component = AddonModDataProvider.COMPONENT; entryLoaded = false; + renderingEntry = false; + loadingComments = false; + loadingRating = false; selectedGroup = 0; entry: any; offlineActions = []; @@ -61,18 +64,19 @@ export class AddonModDataEntryPage implements OnDestroy { data: any; groupInfo: any; showComments: any; - entryRendered = ''; + entryHtml = ''; siteId: string; extraImports = [AddonModDataComponentsModule]; jsData; ratingInfo: CoreRatingInfo; + isPullingToRefresh = false; // Whether the last fetching of data was started by a pull-to-refresh action constructor(params: NavParams, protected utils: CoreUtilsProvider, protected groupsProvider: CoreGroupsProvider, protected domUtils: CoreDomUtilsProvider, protected fieldsDelegate: AddonModDataFieldsDelegate, protected courseProvider: CoreCourseProvider, protected dataProvider: AddonModDataProvider, protected dataOffline: AddonModDataOfflineProvider, protected dataHelper: AddonModDataHelperProvider, - sitesProvider: CoreSitesProvider, protected navCtrl: NavController, - protected eventsProvider: CoreEventsProvider) { + sitesProvider: CoreSitesProvider, protected navCtrl: NavController, protected eventsProvider: CoreEventsProvider, + private cdr: ChangeDetectorRef) { this.module = params.get('module') || {}; this.entryId = params.get('entryId') || null; this.courseId = params.get('courseId'); @@ -122,12 +126,15 @@ export class AddonModDataEntryPage implements OnDestroy { /** * Fetch the entry data. * - * @param {boolean} refresh If refresh the current data or not. - * @return {Promise} Resolved when done. + * @param {boolean} [refresh] Whether to refresh the current data or not. + * @param {boolean} [isPtr] Whether is a pull to refresh action. + * @return {Promise} Resolved when done. */ - protected fetchEntryData(refresh?: boolean): Promise { + protected fetchEntryData(refresh?: boolean, isPtr?: boolean): Promise { let fieldsArray; + this.isPullingToRefresh = isPtr; + return this.dataProvider.getDatabase(this.courseId, this.module.id).then((data) => { this.title = data.name || this.title; this.data = data; @@ -176,7 +183,7 @@ export class AddonModDataEntryPage implements OnDestroy { const actions = this.dataHelper.getActions(this.data, this.access, this.entry); const templte = this.data.singletemplate || this.dataHelper.getDefaultTemplate('single', fieldsArray); - this.entryRendered = this.dataHelper.displayShowFields(templte, fieldsArray, this.entry, this.offset, 'show', actions); + this.entryHtml = this.dataHelper.displayShowFields(templte, fieldsArray, this.entry, this.offset, 'show', actions); this.showComments = actions.comments; const entries = {}; @@ -191,7 +198,7 @@ export class AddonModDataEntryPage implements OnDestroy { }).catch((message) => { if (!refresh) { // Some call failed, retry without using cache since it might be a new activity. - return this.refreshAllData(); + return this.refreshAllData(isPtr); } this.domUtils.showErrorModalDefault(message, 'core.course.errorgetmodule', true); @@ -219,9 +226,10 @@ export class AddonModDataEntryPage implements OnDestroy { /** * Refresh all the data. * + * @param {boolean} [isPtr] Whether is a pull to refresh action. * @return {Promise} Promise resolved when done. */ - protected refreshAllData(): Promise { + protected refreshAllData(isPtr?: boolean): Promise { const promises = []; promises.push(this.dataProvider.invalidateDatabaseData(this.courseId)); @@ -232,7 +240,7 @@ export class AddonModDataEntryPage implements OnDestroy { } return Promise.all(promises).finally(() => { - return this.fetchEntryData(true); + return this.fetchEntryData(true, isPtr); }); } @@ -244,7 +252,7 @@ export class AddonModDataEntryPage implements OnDestroy { */ refreshDatabase(refresher?: any): Promise { if (this.entryLoaded) { - return this.refreshAllData().finally(() => { + return this.refreshAllData(true).finally(() => { refresher && refresher.complete(); }); } @@ -310,6 +318,30 @@ export class AddonModDataEntryPage implements OnDestroy { }); } + /** + * Function called when entry is being rendered. + */ + setRenderingEntry(rendering: boolean): void { + this.renderingEntry = rendering; + this.cdr.detectChanges(); + } + + /** + * Function called when comments component is loading data. + */ + setLoadingComments(loading: boolean): void { + this.loadingComments = loading; + this.cdr.detectChanges(); + } + + /** + * Function called when rate component is loading data. + */ + setLoadingRating(loading: boolean): void { + this.loadingRating = loading; + this.cdr.detectChanges(); + } + /** * Function called when rating is updated online. */