From 2c66bf23ae452dbe679785633fea6c7167e70792 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= Date: Fri, 16 Nov 2018 15:07:34 +0100 Subject: [PATCH] MOBILE-1070 ux: Add retry button when infinite loading fails --- src/addon/calendar/pages/list/list.html | 2 +- src/addon/calendar/pages/list/list.ts | 5 ++- .../messages/pages/discussion/discussion.html | 2 +- .../messages/pages/discussion/discussion.ts | 5 +++ .../index/addon-mod-forum-index.html | 2 +- src/addon/mod/forum/components/index/index.ts | 9 ++++-- .../index/addon-mod-glossary-index.html | 2 +- .../mod/glossary/components/index/index.ts | 6 ++-- src/addon/notifications/pages/list/list.html | 2 +- src/addon/notifications/pages/list/list.ts | 7 ++-- .../core-infinite-loading.html | 32 ++++++++++++------- .../infinite-loading/infinite-loading.ts | 1 + src/core/courses/pages/search/search.html | 2 +- src/core/courses/pages/search/search.ts | 5 ++- .../participants/core-user-participants.html | 2 +- .../components/participants/participants.ts | 4 ++- 16 files changed, 61 insertions(+), 27 deletions(-) diff --git a/src/addon/calendar/pages/list/list.html b/src/addon/calendar/pages/list/list.html index 33ec3cebc..9ee1e90b7 100644 --- a/src/addon/calendar/pages/list/list.html +++ b/src/addon/calendar/pages/list/list.html @@ -29,7 +29,7 @@ - + \ No newline at end of file diff --git a/src/addon/calendar/pages/list/list.ts b/src/addon/calendar/pages/list/list.ts index 2e92feba4..21d0d56ca 100644 --- a/src/addon/calendar/pages/list/list.ts +++ b/src/addon/calendar/pages/list/list.ts @@ -59,6 +59,7 @@ export class AddonCalendarListPage implements OnDestroy { notificationsEnabled = false; filteredEvents = []; canLoadMore = false; + loadMoreError = false; filter = { course: this.allCourses }; @@ -127,6 +128,8 @@ export class AddonCalendarListPage implements OnDestroy { * @return {Promise} Promise resolved when done. */ fetchEvents(refresh: boolean = false): Promise { + this.loadMoreError = false; + return this.calendarProvider.getEventsList(this.daysLoaded, AddonCalendarProvider.DAYS_INTERVAL).then((events) => { this.daysLoaded += AddonCalendarProvider.DAYS_INTERVAL; if (events.length === 0) { @@ -168,7 +171,7 @@ export class AddonCalendarListPage implements OnDestroy { this.content.resize(); }).catch((error) => { this.domUtils.showErrorModalDefault(error, 'addon.calendar.errorloadevents', true); - this.canLoadMore = false; // Set to false to prevent infinite calls with infinite-loading. + this.loadMoreError = true; // Set to prevent infinite calls with infinite-loading. }).then(() => { // Success retrieving events. Get categories if needed. if (this.getCategories) { diff --git a/src/addon/messages/pages/discussion/discussion.html b/src/addon/messages/pages/discussion/discussion.html index da8d7e7c4..81330c3ab 100644 --- a/src/addon/messages/pages/discussion/discussion.html +++ b/src/addon/messages/pages/discussion/discussion.html @@ -15,7 +15,7 @@ - + diff --git a/src/addon/messages/pages/discussion/discussion.ts b/src/addon/messages/pages/discussion/discussion.ts index 3080b974a..558421290 100644 --- a/src/addon/messages/pages/discussion/discussion.ts +++ b/src/addon/messages/pages/discussion/discussion.ts @@ -62,6 +62,7 @@ export class AddonMessagesDiscussionPage implements OnDestroy { loaded = false; showKeyboard = false; canLoadMore = false; + loadMoreError = false; messages = []; showDelete = false; canDelete = false; @@ -206,6 +207,8 @@ export class AddonMessagesDiscussionPage implements OnDestroy { * @return {Promise} Resolved when done. */ protected fetchData(): Promise { + this.loadMoreError = false; + this.logger.debug(`Polling new messages for discussion with user '${this.userId}'`); if (this.messagesBeingSent > 0) { // We do not poll while a message is being sent or we could confuse the user. @@ -552,6 +555,8 @@ export class AddonMessagesDiscussionPage implements OnDestroy { this.pagesLoaded++; this.fetchData().catch((error) => { + this.loadMoreError = true; // Set to prevent infinite calls with infinite-loading. + this.pagesLoaded--; this.domUtils.showErrorModalDefault(error, 'addon.messages.errorwhileretrievingmessages', true); }).finally(() => { diff --git a/src/addon/mod/forum/components/index/addon-mod-forum-index.html b/src/addon/mod/forum/components/index/addon-mod-forum-index.html index dc4b05221..103fffd9d 100644 --- a/src/addon/mod/forum/components/index/addon-mod-forum-index.html +++ b/src/addon/mod/forum/components/index/addon-mod-forum-index.html @@ -88,7 +88,7 @@ - + diff --git a/src/addon/mod/forum/components/index/index.ts b/src/addon/mod/forum/components/index/index.ts index 46ccc4c13..774c8ae4d 100644 --- a/src/addon/mod/forum/components/index/index.ts +++ b/src/addon/mod/forum/components/index/index.ts @@ -41,6 +41,7 @@ export class AddonModForumIndexComponent extends CoreCourseModuleMainActivityCom descriptionNote: string; forum: any; canLoadMore = false; + loadMoreError = false; discussions = []; offlineDiscussions = []; selectedDiscussion = 0; // Disucssion ID or negative timecreated if it's an offline discussion. @@ -130,6 +131,8 @@ export class AddonModForumIndexComponent extends CoreCourseModuleMainActivityCom * @return {Promise} Promise resolved when done. */ protected fetchContent(refresh: boolean = false, sync: boolean = false, showErrors: boolean = false): Promise { + this.loadMoreError = false; + return this.forumProvider.getForum(this.courseId, this.module.id).then((forum) => { this.forum = forum; @@ -184,7 +187,7 @@ export class AddonModForumIndexComponent extends CoreCourseModuleMainActivityCom this.domUtils.showErrorModalDefault(message, 'addon.mod_forum.errorgetforum', true); - this.canLoadMore = false; // Set to false to prevent infinite calls with infinite-loading. + this.loadMoreError = true; // Set to prevent infinite calls with infinite-loading. }); } @@ -241,6 +244,8 @@ export class AddonModForumIndexComponent extends CoreCourseModuleMainActivityCom * @return {Promise} Promise resolved when done. */ protected fetchDiscussions(refresh: boolean): Promise { + this.loadMoreError = false; + if (refresh) { this.page = 0; } @@ -314,7 +319,7 @@ export class AddonModForumIndexComponent extends CoreCourseModuleMainActivityCom return this.fetchDiscussions(false).catch((message) => { this.domUtils.showErrorModalDefault(message, 'addon.mod_forum.errorgetforum', true); - this.canLoadMore = false; // Set to false to prevent infinite calls with infinite-loading. + this.loadMoreError = true; // Set to prevent infinite calls with infinite-loading. }).finally(() => { infiniteComplete && infiniteComplete(); }); diff --git a/src/addon/mod/glossary/components/index/addon-mod-glossary-index.html b/src/addon/mod/glossary/components/index/addon-mod-glossary-index.html index 8745e6f6b..5eb594112 100644 --- a/src/addon/mod/glossary/components/index/addon-mod-glossary-index.html +++ b/src/addon/mod/glossary/components/index/addon-mod-glossary-index.html @@ -56,7 +56,7 @@ - + diff --git a/src/addon/mod/glossary/components/index/index.ts b/src/addon/mod/glossary/components/index/index.ts index 0d619978d..f896e602f 100644 --- a/src/addon/mod/glossary/components/index/index.ts +++ b/src/addon/mod/glossary/components/index/index.ts @@ -44,6 +44,7 @@ export class AddonModGlossaryIndexComponent extends CoreCourseModuleMainActivity offlineEntries = []; canAdd = false; canLoadMore = false; + loadMoreError = false; loadingMessage = this.translate.instant('core.loading'); selectedEntry: number; @@ -139,6 +140,8 @@ export class AddonModGlossaryIndexComponent extends CoreCourseModuleMainActivity * @return {Promise} Promise resolved when done. */ protected fetchEntries(append: boolean = false): Promise { + this.loadMoreError = false; + if (!this.fetchFunction || !this.fetchArguments) { // This happens in search mode with an empty query. return Promise.resolve({entries: [], count: 0}); @@ -155,8 +158,6 @@ export class AddonModGlossaryIndexComponent extends CoreCourseModuleMainActivity } this.canLoadMore = this.entries.length < result.count; }).catch((error) => { - this.canLoadMore = false; // Set to false to prevent infinite calls with infinite-loading. - return Promise.reject(error); }); } @@ -294,6 +295,7 @@ export class AddonModGlossaryIndexComponent extends CoreCourseModuleMainActivity */ loadMoreEntries(infiniteComplete?: any): Promise { return this.fetchEntries(true).catch((error) => { + this.loadMoreError = true; this.domUtils.showErrorModalDefault(error, 'addon.mod_glossary.errorloadingentries', true); }).finally(() => { infiniteComplete && infiniteComplete(); diff --git a/src/addon/notifications/pages/list/list.html b/src/addon/notifications/pages/list/list.html index 0ee4eb357..234690dd6 100644 --- a/src/addon/notifications/pages/list/list.html +++ b/src/addon/notifications/pages/list/list.html @@ -32,6 +32,6 @@ - + diff --git a/src/addon/notifications/pages/list/list.ts b/src/addon/notifications/pages/list/list.ts index fe21ee62f..3d0d5aa85 100644 --- a/src/addon/notifications/pages/list/list.ts +++ b/src/addon/notifications/pages/list/list.ts @@ -36,6 +36,7 @@ export class AddonNotificationsListPage { notifications = []; notificationsLoaded = false; canLoadMore = false; + loadMoreError = false; canMarkAllNotificationsAsRead = false; loadingMarkAllNotificationsAsRead = false; @@ -76,6 +77,8 @@ export class AddonNotificationsListPage { * @return {Promise} Resolved when done. */ protected fetchNotifications(refresh?: boolean): Promise { + this.loadMoreError = false; + if (refresh) { this.readCount = 0; this.unreadCount = 0; @@ -107,7 +110,7 @@ export class AddonNotificationsListPage { }).catch((error) => { if (unread.length == 0) { this.domUtils.showErrorModalDefault(error, 'addon.notifications.errorgetnotifications', true); - this.canLoadMore = false; // Set to false to prevent infinite calls with infinite-loading. + this.loadMoreError = true; // Set to prevent infinite calls with infinite-loading. } })); } else { @@ -125,7 +128,7 @@ export class AddonNotificationsListPage { }); }).catch((error) => { this.domUtils.showErrorModalDefault(error, 'addon.notifications.errorgetnotifications', true); - this.canLoadMore = false; // Set to false to prevent infinite calls with infinite-loading. + this.loadMoreError = true; // Set to prevent infinite calls with infinite-loading. }); } diff --git a/src/components/infinite-loading/core-infinite-loading.html b/src/components/infinite-loading/core-infinite-loading.html index e52c393a5..35a8285a8 100644 --- a/src/components/infinite-loading/core-infinite-loading.html +++ b/src/components/infinite-loading/core-infinite-loading.html @@ -1,18 +1,28 @@ -
- -
+ +
+ + +
+
- + -
- -
+ +
+ + +
+
diff --git a/src/components/infinite-loading/infinite-loading.ts b/src/components/infinite-loading/infinite-loading.ts index 7c7b3b4d6..6b72837f0 100644 --- a/src/components/infinite-loading/infinite-loading.ts +++ b/src/components/infinite-loading/infinite-loading.ts @@ -27,6 +27,7 @@ import { InfiniteScroll } from 'ionic-angular'; }) export class CoreInfiniteLoadingComponent { @Input() enabled: boolean; + @Input() error = false; @Input() position = 'bottom'; @Output() action: EventEmitter<() => void>; // Will emit an event when triggered. diff --git a/src/core/courses/pages/search/search.html b/src/core/courses/pages/search/search.html index 0174eb683..098a55bdf 100644 --- a/src/core/courses/pages/search/search.html +++ b/src/core/courses/pages/search/search.html @@ -10,7 +10,7 @@ {{ 'core.courses.totalcoursesearchresults' | translate:{$a: total} }} - +
diff --git a/src/core/courses/pages/search/search.ts b/src/core/courses/pages/search/search.ts index 38607e129..e73c88b90 100644 --- a/src/core/courses/pages/search/search.ts +++ b/src/core/courses/pages/search/search.ts @@ -29,6 +29,7 @@ export class CoreCoursesSearchPage { total = 0; courses: any[]; canLoadMore: boolean; + loadMoreError = false; protected page = 0; protected currentSearch = ''; @@ -68,6 +69,8 @@ export class CoreCoursesSearchPage { * @return {Promise} Promise resolved when done. */ protected searchCourses(): Promise { + this.loadMoreError = false; + return this.coursesProvider.search(this.currentSearch, this.page).then((response) => { if (this.page === 0) { this.courses = response.courses; @@ -79,7 +82,7 @@ export class CoreCoursesSearchPage { this.page++; this.canLoadMore = this.courses.length < this.total; }).catch((error) => { - this.canLoadMore = false; + this.loadMoreError = true; // Set to prevent infinite calls with infinite-loading. this.domUtils.showErrorModalDefault(error, 'core.courses.errorsearching', true); }); } diff --git a/src/core/user/components/participants/core-user-participants.html b/src/core/user/components/participants/core-user-participants.html index 287c76baa..893b5a78a 100644 --- a/src/core/user/components/participants/core-user-participants.html +++ b/src/core/user/components/participants/core-user-participants.html @@ -16,7 +16,7 @@

{{ 'core.lastaccess' | translate }}: {{ participant.lastaccess * 1000 | coreFormatDate:"dfmediumdate"}}

- + \ No newline at end of file diff --git a/src/core/user/components/participants/participants.ts b/src/core/user/components/participants/participants.ts index f933be290..35475a2b4 100644 --- a/src/core/user/components/participants/participants.ts +++ b/src/core/user/components/participants/participants.ts @@ -34,6 +34,7 @@ export class CoreUserParticipantsComponent implements OnInit { participantId: number; participants = []; canLoadMore = false; + loadMoreError = false; participantsLoaded = false; constructor(private userProvider: CoreUserProvider, private domUtils: CoreDomUtilsProvider) { } @@ -68,6 +69,7 @@ export class CoreUserParticipantsComponent implements OnInit { */ fetchData(refresh: boolean = false): Promise { const firstToGet = refresh ? 0 : this.participants.length; + this.loadMoreError = false; return this.userProvider.getParticipants(this.courseId, firstToGet).then((data) => { if (refresh) { @@ -78,7 +80,7 @@ export class CoreUserParticipantsComponent implements OnInit { this.canLoadMore = data.canLoadMore; }).catch((error) => { this.domUtils.showErrorModalDefault(error, 'Error loading participants'); - this.canLoadMore = false; // Set to false to prevent infinite calls with infinite-loading. + this.loadMoreError = true; // Set to prevent infinite calls with infinite-loading. }); }