Merge pull request #1306 from dpalou/MOBILE-2392

MOBILE-2392 course: Update download course label
main
Juan Leyva 2018-05-14 15:28:58 +02:00 committed by GitHub
commit 7280f244ec
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 90 additions and 35 deletions

View File

@ -18,6 +18,7 @@
"hiddenfromstudents": "Hidden from students",
"nocontentavailable": "No content available at the moment.",
"overriddennotice": "Your final grade from this activity was manually adjusted.",
"refreshcourse": "Refresh course",
"sections": "Sections",
"useactivityonbrowser": "You can still use it using your device's web browser."
}

View File

@ -13,7 +13,7 @@
<core-navbar-buttons>
<core-context-menu>
<core-context-menu-item *ngIf="displayEnableDownload" [priority]="2000" [content]="'core.settings.enabledownloadsection' | translate" (action)="toggleDownload()" [iconAction]="downloadEnabledIcon"></core-context-menu-item>
<core-context-menu-item [priority]="1900" [content]="'core.course.downloadcourse' | translate" (action)="prefetchCourse()" [iconAction]="prefetchCourseData.prefetchCourseIcon" [closeOnClick]="false"></core-context-menu-item>
<core-context-menu-item [priority]="1900" [content]="prefetchCourseData.title | translate" (action)="prefetchCourse()" [iconAction]="prefetchCourseData.prefetchCourseIcon" [closeOnClick]="false"></core-context-menu-item>
</core-context-menu>
</core-navbar-buttons>
<ion-content>

View File

@ -49,7 +49,8 @@ export class CoreCourseSectionPage implements OnDestroy {
downloadEnabled: boolean;
downloadEnabledIcon = 'square-outline'; // Disabled by default.
prefetchCourseData = {
prefetchCourseIcon: 'spinner'
prefetchCourseIcon: 'spinner',
title: 'core.course.downloadcourse'
};
moduleId: number;
displayEnableDownload: boolean;
@ -83,7 +84,7 @@ export class CoreCourseSectionPage implements OnDestroy {
// Listen for changes in course status.
this.courseStatusObserver = eventsProvider.on(CoreEventsProvider.COURSE_STATUS_CHANGED, (data) => {
if (data.courseId == this.course.id) {
this.prefetchCourseData.prefetchCourseIcon = this.courseHelper.getCourseStatusIconFromStatus(data.status);
this.updateCourseStatus(data.status);
}
}, sitesProvider.getCurrentSiteId());
}
@ -116,7 +117,7 @@ export class CoreCourseSectionPage implements OnDestroy {
} else {
// No download, this probably means that the app was closed while downloading. Set previous status.
this.courseProvider.setCoursePreviousStatus(this.course.id).then((status) => {
this.prefetchCourseData.prefetchCourseIcon = this.courseHelper.getCourseStatusIconFromStatus(status);
this.updateCourseStatus(status);
});
}
}
@ -273,8 +274,9 @@ export class CoreCourseSectionPage implements OnDestroy {
* @return {Promise<void>} Promise resolved when done.
*/
protected determineCoursePrefetchIcon(): Promise<void> {
return this.courseHelper.getCourseStatusIcon(this.course.id).then((icon) => {
this.prefetchCourseData.prefetchCourseIcon = icon;
return this.courseHelper.getCourseStatusIconAndTitle(this.course.id).then((data) => {
this.prefetchCourseData.prefetchCourseIcon = data.icon;
this.prefetchCourseData.title = data.title;
});
}
@ -305,6 +307,18 @@ export class CoreCourseSectionPage implements OnDestroy {
this.downloadEnabledIcon = this.downloadEnabled ? 'checkbox-outline' : 'square-outline';
}
/**
* Update the course status icon and title.
*
* @param {string} status Status to show.
*/
protected updateCourseStatus(status: string): void {
const statusData = this.courseHelper.getCourseStatusIconAndTitleFromStatus(status);
this.prefetchCourseData.prefetchCourseIcon = statusData.icon;
this.prefetchCourseData.title = statusData.title;
}
/**
* Page destroyed.
*/

View File

@ -245,20 +245,22 @@ export class CoreCourseHelperProvider {
* This function will set the icon to "spinner" when starting and it will also set it back to the initial icon if the
* user cancels. All the other updates of the icon should be made when CoreEventsProvider.COURSE_STATUS_CHANGED is received.
*
* @param {any} iconData An object where to store the course icon. It will be stored with the name "prefetchCourseIcon".
* @param {any} data An object where to store the course icon and title: "prefetchCourseIcon" and "title".
* @param {any} course Course to prefetch.
* @param {any[]} [sections] List of course sections.
* @param {CoreCourseOptionsHandlerToDisplay[]} courseHandlers List of course handlers.
* @return {Promise<boolean>} Promise resolved when the download finishes, rejected if an error occurs or the user cancels.
*/
confirmAndPrefetchCourse(iconData: any, course: any, sections?: any[], courseHandlers?: CoreCourseOptionsHandlerToDisplay[])
confirmAndPrefetchCourse(data: any, course: any, sections?: any[], courseHandlers?: CoreCourseOptionsHandlerToDisplay[])
: Promise<boolean> {
const initialIcon = iconData.prefetchCourseIcon,
const initialIcon = data.prefetchCourseIcon,
initialTitle = data.title,
siteId = this.sitesProvider.getCurrentSiteId();
let promise;
iconData.prefetchCourseIcon = 'spinner';
data.prefetchCourseIcon = 'spinner';
data.title = 'core.downloading';
// Get the sections first if needed.
if (sections) {
@ -286,7 +288,8 @@ export class CoreCourseHelperProvider {
});
}, (error): any => {
// User cancelled or there was an error calculating the size.
iconData.prefetchCourseIcon = initialIcon;
data.prefetchCourseIcon = initialIcon;
data.title = initialTitle;
return Promise.reject(error);
});
@ -729,32 +732,41 @@ export class CoreCourseHelperProvider {
}
/**
* Get a course status icon.
* Get a course status icon and the langkey to use as a title.
*
* @param {number} courseId Course ID.
* @param {string} [siteId] Site ID. If not defined, current site.
* @return {Promise<string>} Promise resolved with the icon name.
* @return {Promise<{icon: string, title: string}>} Promise resolved with the icon name and the title key.
*/
getCourseStatusIcon(courseId: number, siteId?: string): Promise<string> {
getCourseStatusIconAndTitle(courseId: number, siteId?: string): Promise<{icon: string, title: string}> {
return this.courseProvider.getCourseStatus(courseId, siteId).then((status) => {
return this.getCourseStatusIconFromStatus(status);
return this.getCourseStatusIconAndTitleFromStatus(status);
});
}
/**
* Get a course status icon from status.
* Get a course status icon and the langkey to use as a title from status.
*
* @param {string} status Course status.
* @return {string} Icon name.
* @return {{icon: string, title: string}} Title and icon name.
*/
getCourseStatusIconFromStatus(status: string): string {
getCourseStatusIconAndTitleFromStatus(status: string): {icon: string, title: string} {
if (status == CoreConstants.DOWNLOADED) {
// Always show refresh icon, we cannot knew if there's anything new in course options.
return 'refresh';
return {
icon: 'refresh',
title: 'core.course.refreshcourse'
};
} else if (status == CoreConstants.DOWNLOADING) {
return 'spinner';
return {
icon: 'spinner',
title: 'core.downloading'
};
} else {
return 'cloud-download';
return {
icon: 'cloud-download',
title: 'core.course.downloadcourse'
};
}
}

View File

@ -4,7 +4,7 @@
<div class="core-button-spinner">
<!-- Download course. -->
<button *ngIf="prefetchCourseData.prefetchCourseIcon != 'spinner'" ion-button icon-only clear color="dark" (click)="prefetchCourse($event)">
<button *ngIf="prefetchCourseData.prefetchCourseIcon != 'spinner'" ion-button icon-only clear color="dark" (click)="prefetchCourse($event)" [attr.aria-label]="prefetchCourseData.title | translate">
<ion-icon [name]="prefetchCourseData.prefetchCourseIcon"></ion-icon>
</button>
<!-- Download course spinner. -->

View File

@ -38,7 +38,8 @@ export class CoreCoursesCourseProgressComponent implements OnInit, OnDestroy {
isDownloading: boolean;
prefetchCourseData = {
prefetchCourseIcon: 'spinner'
prefetchCourseIcon: 'spinner',
title: 'core.course.downloadcourse'
};
protected isDestroyed = false;
@ -50,7 +51,7 @@ export class CoreCoursesCourseProgressComponent implements OnInit, OnDestroy {
// Listen for status change in course.
this.courseStatusObserver = eventsProvider.on(CoreEventsProvider.COURSE_STATUS_CHANGED, (data) => {
if (data.courseId == this.course.id) {
this.prefetchCourseData.prefetchCourseIcon = this.courseHelper.getCourseStatusIconFromStatus(data.status);
this.updateCourseStatus(data.status);
}
}, sitesProvider.getCurrentSiteId());
}
@ -60,10 +61,11 @@ export class CoreCoursesCourseProgressComponent implements OnInit, OnDestroy {
*/
ngOnInit(): void {
// Determine course prefetch icon.
this.courseHelper.getCourseStatusIcon(this.course.id).then((icon) => {
this.prefetchCourseData.prefetchCourseIcon = icon;
this.courseHelper.getCourseStatusIconAndTitle(this.course.id).then((data) => {
this.prefetchCourseData.prefetchCourseIcon = data.icon;
this.prefetchCourseData.title = data.title;
if (icon == 'spinner') {
if (data.icon == 'spinner') {
// Course is being downloaded. Get the download promise.
const promise = this.courseHelper.getCourseDownloadPromise(this.course.id);
if (promise) {
@ -106,6 +108,18 @@ export class CoreCoursesCourseProgressComponent implements OnInit, OnDestroy {
});
}
/**
* Update the course status icon and title.
*
* @param {string} status Status to show.
*/
protected updateCourseStatus(status: string): void {
const statusData = this.courseHelper.getCourseStatusIconAndTitleFromStatus(status);
this.prefetchCourseData.prefetchCourseIcon = statusData.icon;
this.prefetchCourseData.title = statusData.title;
}
/**
* Component destroyed.
*/

View File

@ -41,7 +41,7 @@
<ion-item *ngIf="!isEnrolled && !selfEnrolInstances.length && !paypalEnabled">
<p>{{ 'core.courses.notenrollable' | translate }}</p>
</ion-item>
<a ion-item *ngIf="canAccessCourse" (click)="prefetchCourse()" detail-none>
<a ion-item *ngIf="canAccessCourse" (click)="prefetchCourse()" detail-none [attr.aria-label]="prefetchCourseData.title | translate">
<ion-icon *ngIf="prefetchCourseData.prefetchCourseIcon != 'spinner'" [name]="prefetchCourseData.prefetchCourseIcon" item-start></ion-icon>
<ion-spinner *ngIf="prefetchCourseData.prefetchCourseIcon == 'spinner'" item-start></ion-spinner>
<h2>{{ 'core.course.downloadcourse' | translate }}</h2>

View File

@ -42,7 +42,8 @@ export class CoreCoursesCoursePreviewPage implements OnDestroy {
paypalEnabled: boolean;
dataLoaded: boolean;
prefetchCourseData = {
prefetchCourseIcon: 'spinner'
prefetchCourseIcon: 'spinner',
title: 'core.course.downloadcourse'
};
protected guestWSAvailable: boolean;
@ -73,7 +74,7 @@ export class CoreCoursesCoursePreviewPage implements OnDestroy {
// Listen for status change in course.
this.courseStatusObserver = eventsProvider.on(CoreEventsProvider.COURSE_STATUS_CHANGED, (data) => {
if (data.courseId == this.course.id) {
this.prefetchCourseData.prefetchCourseIcon = this.courseHelper.getCourseStatusIconFromStatus(data.status);
this.updateCourseStatus(data.status);
}
}, sitesProvider.getCurrentSiteId());
}
@ -101,10 +102,11 @@ export class CoreCoursesCoursePreviewPage implements OnDestroy {
this.getCourse().finally(() => {
// Determine course prefetch icon.
this.courseHelper.getCourseStatusIcon(this.course.id).then((icon) => {
this.prefetchCourseData.prefetchCourseIcon = icon;
this.courseHelper.getCourseStatusIconAndTitle(this.course.id).then((data) => {
this.prefetchCourseData.prefetchCourseIcon = data.icon;
this.prefetchCourseData.title = data.title;
if (icon == 'spinner') {
if (data.icon == 'spinner') {
// Course is being downloaded. Get the download promise.
const promise = this.courseHelper.getCourseDownloadPromise(this.course.id);
if (promise) {
@ -378,6 +380,18 @@ export class CoreCoursesCoursePreviewPage implements OnDestroy {
});
}
/**
* Update the course status icon and title.
*
* @param {string} status Status to show.
*/
protected updateCourseStatus(status: string): void {
const statusData = this.courseHelper.getCourseStatusIconAndTitleFromStatus(status);
this.prefetchCourseData.prefetchCourseIcon = statusData.icon;
this.prefetchCourseData.title = statusData.title;
}
/**
* Wait for the user to be enrolled in the course.
*

View File

@ -191,7 +191,7 @@ export class CoreCoursesMyCoursesPage implements OnDestroy {
}
this.courseHelper.determineCoursesStatus(this.courses).then((status) => {
let icon = this.courseHelper.getCourseStatusIconFromStatus(status);
let icon = this.courseHelper.getCourseStatusIconAndTitleFromStatus(status).icon;
if (icon == 'spinner') {
// It seems all courses are being downloaded, show a download button instead.
icon = 'cloud-download';

View File

@ -394,7 +394,7 @@ export class CoreCoursesMyOverviewPage implements OnDestroy {
}
this.courseHelper.determineCoursesStatus(this.courses[filter]).then((status) => {
let icon = this.courseHelper.getCourseStatusIconFromStatus(status);
let icon = this.courseHelper.getCourseStatusIconAndTitleFromStatus(status).icon;
if (icon == 'spinner') {
// It seems all courses are being downloaded, show a download button instead.
icon = 'cloud-download';