forked from EVOgeek/Vmeda.Online
MOBILE-3833 blocks: Performance improvements
parent
e7f8b554df
commit
89030c9bc0
|
@ -15,7 +15,12 @@
|
|||
import { Component, OnInit, OnDestroy, Input, OnChanges, SimpleChange } from '@angular/core';
|
||||
import { CoreEventObserver, CoreEvents } from '@singletons/events';
|
||||
import { CoreSites } from '@services/sites';
|
||||
import { CoreCoursesProvider, CoreCoursesMyCoursesUpdatedEventData, CoreCourses } from '@features/courses/services/courses';
|
||||
import {
|
||||
CoreCoursesProvider,
|
||||
CoreCoursesMyCoursesUpdatedEventData,
|
||||
CoreCourses,
|
||||
CoreCourseSummaryData,
|
||||
} from '@features/courses/services/courses';
|
||||
import { CoreCourseSearchedDataWithExtraInfoAndOptions, CoreCoursesHelper } from '@features/courses/services/courses-helper';
|
||||
import { CoreCourseHelper, CorePrefetchStatusInfo } from '@features/course/services/course-helper';
|
||||
import { CoreCourseOptionsDelegate } from '@features/course/services/course-options-delegate';
|
||||
|
@ -35,7 +40,7 @@ export class AddonBlockRecentlyAccessedCoursesComponent extends CoreBlockBaseCom
|
|||
|
||||
@Input() downloadEnabled = false;
|
||||
|
||||
courses: CoreCourseSearchedDataWithExtraInfoAndOptions[] = [];
|
||||
courses: (Omit<CoreCourseSummaryData, 'visible'> & CoreCourseSearchedDataWithExtraInfoAndOptions)[] = [];
|
||||
prefetchCoursesData: CorePrefetchStatusInfo = {
|
||||
icon: '',
|
||||
statusTranslatable: 'core.loading',
|
||||
|
@ -52,7 +57,6 @@ export class AddonBlockRecentlyAccessedCoursesComponent extends CoreBlockBaseCom
|
|||
protected isDestroyed = false;
|
||||
protected coursesObserver?: CoreEventObserver;
|
||||
protected updateSiteObserver?: CoreEventObserver;
|
||||
protected courseIds = [];
|
||||
protected fetchContentDefaultError = 'Error getting recent courses data.';
|
||||
|
||||
constructor() {
|
||||
|
@ -60,7 +64,7 @@ export class AddonBlockRecentlyAccessedCoursesComponent extends CoreBlockBaseCom
|
|||
}
|
||||
|
||||
/**
|
||||
* Component being initialized.
|
||||
* @inheritdoc
|
||||
*/
|
||||
async ngOnInit(): Promise<void> {
|
||||
// Generate unique id for scroll element.
|
||||
|
@ -82,12 +86,8 @@ export class AddonBlockRecentlyAccessedCoursesComponent extends CoreBlockBaseCom
|
|||
this.coursesObserver = CoreEvents.on(
|
||||
CoreCoursesProvider.EVENT_MY_COURSES_UPDATED,
|
||||
(data) => {
|
||||
|
||||
if (this.shouldRefreshOnUpdatedEvent(data)) {
|
||||
this.refreshCourseList();
|
||||
}
|
||||
this.refreshCourseList(data);
|
||||
},
|
||||
|
||||
CoreSites.getCurrentSiteId(),
|
||||
);
|
||||
|
||||
|
@ -95,7 +95,7 @@ export class AddonBlockRecentlyAccessedCoursesComponent extends CoreBlockBaseCom
|
|||
}
|
||||
|
||||
/**
|
||||
* Detect changes on input properties.
|
||||
* @inheritdoc
|
||||
*/
|
||||
ngOnChanges(changes: {[name: string]: SimpleChange}): void {
|
||||
if (changes.downloadEnabled && !changes.downloadEnabled.previousValue && this.downloadEnabled && this.loaded) {
|
||||
|
@ -105,21 +105,35 @@ export class AddonBlockRecentlyAccessedCoursesComponent extends CoreBlockBaseCom
|
|||
}
|
||||
|
||||
/**
|
||||
* Perform the invalidate content function.
|
||||
*
|
||||
* @return Resolved when done.
|
||||
* @inheritdoc
|
||||
*/
|
||||
protected async invalidateContent(): Promise<void> {
|
||||
const courseIds = this.courses.map((course) => course.id);
|
||||
|
||||
await this.invalidateCourses(courseIds);
|
||||
}
|
||||
|
||||
/**
|
||||
* Helper function to invalidate only selected courses.
|
||||
*
|
||||
* @param courseIds Course Id array.
|
||||
* @return Promise resolved when done.
|
||||
*/
|
||||
protected async invalidateCourses(courseIds: number[]): Promise<void> {
|
||||
const promises: Promise<void>[] = [];
|
||||
|
||||
promises.push(CoreCourses.invalidateRecentCourses().finally(() =>
|
||||
// Invalidate course completion data.
|
||||
CoreUtils.allPromises(this.courseIds.map((courseId) =>
|
||||
promises.push(CoreCourses.invalidateRecentCourses().finally(() =>
|
||||
CoreUtils.allPromises(courseIds.map((courseId) =>
|
||||
AddonCourseCompletion.invalidateCourseCompletion(courseId)))));
|
||||
|
||||
if (courseIds.length == 1) {
|
||||
promises.push(CoreCourseOptionsDelegate.clearAndInvalidateCoursesOptions(courseIds[0]));
|
||||
} else {
|
||||
promises.push(CoreCourseOptionsDelegate.clearAndInvalidateCoursesOptions());
|
||||
if (this.courseIds.length > 0) {
|
||||
promises.push(CoreCourses.invalidateCoursesByField('ids', this.courseIds.join(',')));
|
||||
}
|
||||
if (courseIds.length > 0) {
|
||||
promises.push(CoreCourses.invalidateCoursesByField('ids', courseIds.join(',')));
|
||||
}
|
||||
|
||||
await CoreUtils.allPromises(promises).finally(() => {
|
||||
|
@ -128,9 +142,7 @@ export class AddonBlockRecentlyAccessedCoursesComponent extends CoreBlockBaseCom
|
|||
}
|
||||
|
||||
/**
|
||||
* Fetch the courses for recent courses.
|
||||
*
|
||||
* @return Promise resolved when done.
|
||||
* @inheritdoc
|
||||
*/
|
||||
protected async fetchContent(): Promise<void> {
|
||||
const showCategories = this.block.configsRecord && this.block.configsRecord.displaycategories &&
|
||||
|
@ -140,17 +152,17 @@ export class AddonBlockRecentlyAccessedCoursesComponent extends CoreBlockBaseCom
|
|||
const courseIds = recentCourses.map((course) => course.id);
|
||||
|
||||
// Get the courses using getCoursesByField to get more info about each course.
|
||||
const courses: CoreCourseSearchedDataWithExtraInfoAndOptions[] = await CoreCourses.getCoursesByField(
|
||||
'ids',
|
||||
courseIds.join(','),
|
||||
);
|
||||
const courses = await CoreCourses.getCoursesByField('ids', courseIds.join(','));
|
||||
|
||||
// Sort them in the original order.
|
||||
courses.sort((courseA, courseB) => courseIds.indexOf(courseA.id) - courseIds.indexOf(courseB.id));
|
||||
this.courses = recentCourses.map((recentCourse) => {
|
||||
const course = courses.find((course) => recentCourse.id == course.id);
|
||||
|
||||
return Object.assign(recentCourse, course);
|
||||
});
|
||||
|
||||
// Get course options and extra info.
|
||||
const options = await CoreCourses.getCoursesAdminAndNavOptions(courseIds);
|
||||
courses.forEach((course) => {
|
||||
this.courses.forEach((course) => {
|
||||
course.navOptions = options.navOptions[course.id];
|
||||
course.admOptions = options.admOptions[course.id];
|
||||
|
||||
|
@ -161,24 +173,9 @@ export class AddonBlockRecentlyAccessedCoursesComponent extends CoreBlockBaseCom
|
|||
|
||||
await CoreCoursesHelper.loadCoursesColorAndImage(courses);
|
||||
|
||||
this.courses = courses;
|
||||
|
||||
this.initPrefetchCoursesIcons();
|
||||
}
|
||||
|
||||
/**
|
||||
* Refresh the list of courses.
|
||||
*
|
||||
* @return Promise resolved when done.
|
||||
*/
|
||||
protected async refreshCourseList(): Promise<void> {
|
||||
CoreEvents.trigger(CoreCoursesProvider.EVENT_MY_COURSES_REFRESHED);
|
||||
|
||||
await CoreUtils.ignoreErrors(CoreCourses.invalidateRecentCourses());
|
||||
|
||||
await this.loadContent(true);
|
||||
}
|
||||
|
||||
/**
|
||||
* Initialize the prefetch icon for selected courses.
|
||||
*/
|
||||
|
@ -194,44 +191,39 @@ export class AddonBlockRecentlyAccessedCoursesComponent extends CoreBlockBaseCom
|
|||
}
|
||||
|
||||
/**
|
||||
* Whether list should be refreshed based on a EVENT_MY_COURSES_UPDATED event.
|
||||
* Refresh course list based on a EVENT_MY_COURSES_UPDATED event.
|
||||
*
|
||||
* @param data Event data.
|
||||
* @return Whether to refresh.
|
||||
* @return Promise resolved when done.
|
||||
*/
|
||||
protected shouldRefreshOnUpdatedEvent(data: CoreCoursesMyCoursesUpdatedEventData): boolean {
|
||||
protected async refreshCourseList(data: CoreCoursesMyCoursesUpdatedEventData): Promise<void> {
|
||||
if (data.action == CoreCoursesProvider.ACTION_ENROL) {
|
||||
// Always update if user enrolled in a course.
|
||||
return true;
|
||||
return await this.refreshContent();
|
||||
}
|
||||
|
||||
if (data.action == CoreCoursesProvider.ACTION_VIEW && data.courseId != CoreSites.getCurrentSiteHomeId() &&
|
||||
this.courses[0] && data.courseId != this.courses[0].id) {
|
||||
// Update list if user viewed a course that isn't the most recent one and isn't site home.
|
||||
return true;
|
||||
const courseIndex = this.courses.findIndex((course) => course.id == data.courseId);
|
||||
const course = this.courses[courseIndex];
|
||||
if (data.action == CoreCoursesProvider.ACTION_VIEW && data.courseId != CoreSites.getCurrentSiteHomeId()) {
|
||||
if (!course) {
|
||||
// Not found, use WS update.
|
||||
return await this.refreshContent();
|
||||
}
|
||||
|
||||
if (data.action == CoreCoursesProvider.ACTION_STATE_CHANGED && data.state == CoreCoursesProvider.STATE_FAVOURITE &&
|
||||
data.courseId && this.hasCourse(data.courseId)) {
|
||||
// Update list if a visible course is now favourite or unfavourite.
|
||||
return true;
|
||||
// Place at the begining.
|
||||
this.courses.splice(courseIndex, 1);
|
||||
this.courses.unshift(course);
|
||||
|
||||
await this.invalidateCourses([course.id]);
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
if (data.action == CoreCoursesProvider.ACTION_STATE_CHANGED &&
|
||||
data.state == CoreCoursesProvider.STATE_FAVOURITE && course) {
|
||||
course.isfavourite = !!data.value;
|
||||
await this.invalidateCourses([course.id]);
|
||||
|
||||
/**
|
||||
* Check if a certain course is in the list of courses.
|
||||
*
|
||||
* @param courseId Course ID to search.
|
||||
* @return Whether it's in the list.
|
||||
*/
|
||||
protected hasCourse(courseId: number): boolean {
|
||||
if (!this.courses) {
|
||||
return false;
|
||||
this.initPrefetchCoursesIcons();
|
||||
}
|
||||
|
||||
return !!this.courses.find((course) => course.id == courseId);
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -253,7 +245,7 @@ export class AddonBlockRecentlyAccessedCoursesComponent extends CoreBlockBaseCom
|
|||
}
|
||||
|
||||
/**
|
||||
* Component being destroyed.
|
||||
* @inheritdoc
|
||||
*/
|
||||
ngOnDestroy(): void {
|
||||
this.isDestroyed = true;
|
||||
|
|
|
@ -52,7 +52,6 @@ export class AddonBlockStarredCoursesComponent extends CoreBlockBaseComponent im
|
|||
protected isDestroyed = false;
|
||||
protected coursesObserver?: CoreEventObserver;
|
||||
protected updateSiteObserver?: CoreEventObserver;
|
||||
protected courseIds: number[] = [];
|
||||
protected fetchContentDefaultError = 'Error getting starred courses data.';
|
||||
|
||||
constructor() {
|
||||
|
@ -60,7 +59,7 @@ export class AddonBlockStarredCoursesComponent extends CoreBlockBaseComponent im
|
|||
}
|
||||
|
||||
/**
|
||||
* Component being initialized.
|
||||
* @inheritdoc
|
||||
*/
|
||||
async ngOnInit(): Promise<void> {
|
||||
// Generate unique id for scroll element.
|
||||
|
@ -76,17 +75,12 @@ export class AddonBlockStarredCoursesComponent extends CoreBlockBaseComponent im
|
|||
this.updateSiteObserver = CoreEvents.on(CoreEvents.SITE_UPDATED, () => {
|
||||
this.downloadCourseEnabled = !CoreCourses.isDownloadCourseDisabledInSite();
|
||||
this.downloadCoursesEnabled = !CoreCourses.isDownloadCoursesDisabledInSite();
|
||||
|
||||
}, CoreSites.getCurrentSiteId());
|
||||
|
||||
this.coursesObserver = CoreEvents.on(
|
||||
CoreCoursesProvider.EVENT_MY_COURSES_UPDATED,
|
||||
(data) => {
|
||||
|
||||
if (this.shouldRefreshOnUpdatedEvent(data)) {
|
||||
this.refreshCourseList();
|
||||
}
|
||||
this.refreshContent();
|
||||
this.refreshCourseList(data);
|
||||
},
|
||||
|
||||
CoreSites.getCurrentSiteId(),
|
||||
|
@ -96,7 +90,7 @@ export class AddonBlockStarredCoursesComponent extends CoreBlockBaseComponent im
|
|||
}
|
||||
|
||||
/**
|
||||
* Detect changes on input properties.
|
||||
* @inheritdoc
|
||||
*/
|
||||
ngOnChanges(changes: {[name: string]: SimpleChange}): void {
|
||||
if (changes.downloadEnabled && !changes.downloadEnabled.previousValue && this.downloadEnabled && this.loaded) {
|
||||
|
@ -106,21 +100,35 @@ export class AddonBlockStarredCoursesComponent extends CoreBlockBaseComponent im
|
|||
}
|
||||
|
||||
/**
|
||||
* Perform the invalidate content function.
|
||||
*
|
||||
* @return Resolved when done.
|
||||
* @inheritdoc
|
||||
*/
|
||||
protected async invalidateContent(): Promise<void> {
|
||||
const courseIds = this.courses.map((course) => course.id);
|
||||
|
||||
await this.invalidateCourses(courseIds);
|
||||
}
|
||||
|
||||
/**
|
||||
* Helper function to invalidate only selected courses.
|
||||
*
|
||||
* @param courseIds Course Id array.
|
||||
* @return Promise resolved when done.
|
||||
*/
|
||||
protected async invalidateCourses(courseIds: number[]): Promise<void> {
|
||||
const promises: Promise<void>[] = [];
|
||||
|
||||
promises.push(CoreCourses.invalidateUserCourses().finally(() =>
|
||||
// Invalidate course completion data.
|
||||
CoreUtils.allPromises(this.courseIds.map((courseId) =>
|
||||
promises.push(CoreCourses.invalidateUserCourses().finally(() =>
|
||||
CoreUtils.allPromises(courseIds.map((courseId) =>
|
||||
AddonCourseCompletion.invalidateCourseCompletion(courseId)))));
|
||||
|
||||
if (courseIds.length == 1) {
|
||||
promises.push(CoreCourseOptionsDelegate.clearAndInvalidateCoursesOptions(courseIds[0]));
|
||||
} else {
|
||||
promises.push(CoreCourseOptionsDelegate.clearAndInvalidateCoursesOptions());
|
||||
if (this.courseIds.length > 0) {
|
||||
promises.push(CoreCourses.invalidateCoursesByField('ids', this.courseIds.join(',')));
|
||||
}
|
||||
if (courseIds.length > 0) {
|
||||
promises.push(CoreCourses.invalidateCoursesByField('ids', courseIds.join(',')));
|
||||
}
|
||||
|
||||
await CoreUtils.allPromises(promises).finally(() => {
|
||||
|
@ -129,54 +137,54 @@ export class AddonBlockStarredCoursesComponent extends CoreBlockBaseComponent im
|
|||
}
|
||||
|
||||
/**
|
||||
* Fetch the courses.
|
||||
*
|
||||
* @return Promise resolved when done.
|
||||
* @inheritdoc
|
||||
*/
|
||||
protected async fetchContent(): Promise<void> {
|
||||
const showCategories = this.block.configsRecord && this.block.configsRecord.displaycategories &&
|
||||
this.block.configsRecord.displaycategories.value == '1';
|
||||
|
||||
// @TODO: Sort won't coincide with website because timemodified is not informed.
|
||||
this.courses = await CoreCoursesHelper.getUserCoursesWithOptions('timemodified', 0, 'isfavourite', showCategories);
|
||||
|
||||
this.initPrefetchCoursesIcons();
|
||||
}
|
||||
|
||||
/**
|
||||
* Refresh the list of courses.
|
||||
*
|
||||
* @return Promise resolved when done.
|
||||
*/
|
||||
protected async refreshCourseList(): Promise<void> {
|
||||
CoreEvents.trigger(CoreCoursesProvider.EVENT_MY_COURSES_REFRESHED);
|
||||
|
||||
try {
|
||||
await CoreCourses.invalidateUserCourses();
|
||||
} catch (error) {
|
||||
// Ignore errors.
|
||||
}
|
||||
|
||||
await this.loadContent(true);
|
||||
}
|
||||
|
||||
/**
|
||||
* Whether list should be refreshed based on a EVENT_MY_COURSES_UPDATED event.
|
||||
* Refresh course list based on a EVENT_MY_COURSES_UPDATED event.
|
||||
*
|
||||
* @param data Event data.
|
||||
* @return Whether to refresh.
|
||||
* @return Promise resolved when done.
|
||||
*/
|
||||
protected shouldRefreshOnUpdatedEvent(data: CoreCoursesMyCoursesUpdatedEventData): boolean {
|
||||
protected async refreshCourseList(data: CoreCoursesMyCoursesUpdatedEventData): Promise<void> {
|
||||
if (data.action == CoreCoursesProvider.ACTION_ENROL) {
|
||||
// Always update if user enrolled in a course.
|
||||
// New courses shouldn't be favourite by default, but just in case.
|
||||
return true;
|
||||
return await this.refreshContent();
|
||||
}
|
||||
|
||||
if (data.action == CoreCoursesProvider.ACTION_STATE_CHANGED && data.state == CoreCoursesProvider.STATE_FAVOURITE) {
|
||||
// Update list when making a course favourite or not.
|
||||
return true;
|
||||
const courseIndex = this.courses.findIndex((course) => course.id == data.courseId);
|
||||
if (courseIndex < 0) {
|
||||
// Not found, use WS update. Usually new favourite.
|
||||
return await this.refreshContent();
|
||||
}
|
||||
|
||||
return false;
|
||||
const course = this.courses[courseIndex];
|
||||
if (data.value === false) {
|
||||
// Unfavourite, just remove.
|
||||
this.courses.splice(courseIndex, 1);
|
||||
} else {
|
||||
// List is not synced, favourite course and place it at the begining.
|
||||
course.isfavourite = !!data.value;
|
||||
|
||||
this.courses.splice(courseIndex, 1);
|
||||
this.courses.unshift(course);
|
||||
}
|
||||
|
||||
await this.invalidateCourses([course.id]);
|
||||
this.initPrefetchCoursesIcons();
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -212,7 +220,7 @@ export class AddonBlockStarredCoursesComponent extends CoreBlockBaseComponent im
|
|||
}
|
||||
|
||||
/**
|
||||
* Component being destroyed.
|
||||
* @inheritdoc
|
||||
*/
|
||||
ngOnDestroy(): void {
|
||||
this.isDestroyed = true;
|
||||
|
|
Loading…
Reference in New Issue