Merge pull request #1663 from crazyserver/MOBILE-2790

Mobile 2790
main
Juan Leyva 2018-12-14 16:09:41 +01:00 committed by GitHub
commit 34481c3cbe
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
13 changed files with 74 additions and 38 deletions

View File

@ -1,10 +1,3 @@
<!-- Buttons to add to the header. -->
<core-navbar-buttons end>
<button [hidden]="!loaded || !showFilterSwitchButton()" ion-button icon-only [attr.aria-label]="'core.courses.filtermycourses' | translate" (click)="switchFilter()">
<ion-icon name="funnel"></ion-icon>
</button>
</core-navbar-buttons>
<ion-item-divider color="light">
<h2>{{ 'addon.block_myoverview.pluginname' | translate }}</h2>
<!-- Download all courses. -->
@ -15,6 +8,9 @@
<ion-badge class="core-course-download-courses-progress" *ngIf="prefetchCoursesData[selectedFilter].badge">{{prefetchCoursesData[selectedFilter].badge}}</ion-badge>
<ion-spinner *ngIf="!prefetchCoursesData[selectedFilter].icon || prefetchCoursesData[selectedFilter].icon == 'spinner'"></ion-spinner>
</div>
<core-context-menu item-end>
<core-context-menu-item *ngIf="loaded && showFilterSwitchButton()" [priority]="1000" [content]="'core.courses.filtermycourses' | translate" (action)="switchFilter()" iconAction="funnel"></core-context-menu-item>
</core-context-menu>
</ion-item-divider>
<core-loading [hideUntil]="loaded" class="core-loading-center">
<div padding ion-row justify-content-end [hidden]="showFilter" class="safe-padding-horizontal">
@ -47,7 +43,7 @@
<ion-grid no-padding>
<ion-row no-padding>
<ion-col *ngFor="let course of filteredCourses" no-padding col-12 col-sm-6 col-md-6 col-lg-4 col-xl-4 align-self-stretch>
<core-courses-course-progress [course]="course" class="core-courseoverview" showAll="true"></core-courses-course-progress>
<core-courses-course-progress [course]="course" class="core-courseoverview" showAll="true" [showDownload]="downloadAllCoursesEnabled"></core-courses-course-progress>
</ion-col>
</ion-row>
</ion-grid>

View File

@ -65,7 +65,7 @@ export class AddonBlockMyOverviewComponent extends CoreBlockBaseComponent implem
protected prefetchIconsInitialized = false;
protected isDestroyed;
protected updateSiteObserver;
protected downloadButtonObserver;
protected coursesObserver;
protected courseIds = [];
protected fetchContentDefaultError = 'Error getting my overview data.';
@ -83,13 +83,12 @@ export class AddonBlockMyOverviewComponent extends CoreBlockBaseComponent implem
* Component being initialized.
*/
ngOnInit(): void {
this.downloadAllCoursesEnabled = !this.coursesProvider.isDownloadCoursesDisabledInSite();
// Refresh the enabled flags if site is updated.
this.updateSiteObserver = this.eventsProvider.on(CoreEventsProvider.SITE_UPDATED, () => {
// Refresh the enabled flags if enabled.
this.downloadButtonObserver = this.eventsProvider.on(CoreCoursesProvider.EVENT_DASHBOARD_DOWNLOAD_ENABLED_CHANGED,
(data) => {
const wasEnabled = this.downloadAllCoursesEnabled;
this.downloadAllCoursesEnabled = !this.coursesProvider.isDownloadCoursesDisabledInSite();
this.downloadAllCoursesEnabled = data.enabled;
if (!wasEnabled && this.downloadAllCoursesEnabled && this.loaded) {
// Download all courses is enabled now, initialize it.
@ -332,6 +331,6 @@ export class AddonBlockMyOverviewComponent extends CoreBlockBaseComponent implem
ngOnDestroy(): void {
this.isDestroyed = true;
this.coursesObserver && this.coursesObserver.off();
this.updateSiteObserver && this.updateSiteObserver.off();
this.downloadButtonObserver && this.downloadButtonObserver.off();
}
}

View File

@ -14,7 +14,7 @@
<div class="safe-area-page">
<div class="core-horizontal-scroll">
<ng-container *ngFor="let course of courses">
<core-courses-course-progress [course]="course" class="core-recentlyaccessedcourses"></core-courses-course-progress>
<core-courses-course-progress [course]="course" class="core-recentlyaccessedcourses" [showDownload]="downloadAllCoursesEnabled"></core-courses-course-progress>
</ng-container>
</div>
</div>

View File

@ -40,7 +40,7 @@ export class AddonBlockRecentlyAccessedCoursesComponent extends CoreBlockBaseCom
protected prefetchIconsInitialized = false;
protected isDestroyed;
protected updateSiteObserver;
protected downloadButtonObserver;
protected coursesObserver;
protected courseIds = [];
protected fetchContentDefaultError = 'Error getting recent courses data.';
@ -58,19 +58,18 @@ export class AddonBlockRecentlyAccessedCoursesComponent extends CoreBlockBaseCom
* Component being initialized.
*/
ngOnInit(): void {
this.downloadAllCoursesEnabled = !this.coursesProvider.isDownloadCoursesDisabledInSite();
// Refresh the enabled flags if site is updated.
this.updateSiteObserver = this.eventsProvider.on(CoreEventsProvider.SITE_UPDATED, () => {
// Refresh the enabled flags if enabled.
this.downloadButtonObserver = this.eventsProvider.on(CoreCoursesProvider.EVENT_DASHBOARD_DOWNLOAD_ENABLED_CHANGED,
(data) => {
const wasEnabled = this.downloadAllCoursesEnabled;
this.downloadAllCoursesEnabled = !this.coursesProvider.isDownloadCoursesDisabledInSite();
this.downloadAllCoursesEnabled = data.enabled;
if (!wasEnabled && this.downloadAllCoursesEnabled && this.loaded) {
// Download all courses is enabled now, initialize it.
this.initPrefetchCoursesIcons();
}
}, this.sitesProvider.getCurrentSiteId());
});
this.coursesObserver = this.eventsProvider.on(CoreCoursesProvider.EVENT_MY_COURSES_UPDATED, () => {
this.refreshContent();
@ -155,6 +154,6 @@ export class AddonBlockRecentlyAccessedCoursesComponent extends CoreBlockBaseCom
ngOnDestroy(): void {
this.isDestroyed = true;
this.coursesObserver && this.coursesObserver.off();
this.updateSiteObserver && this.updateSiteObserver.off();
this.downloadButtonObserver && this.downloadButtonObserver.off();
}
}

View File

@ -14,7 +14,7 @@
<div class="safe-area-page">
<div class="core-horizontal-scroll">
<ng-container *ngFor="let course of courses">
<core-courses-course-progress [course]="course" class="core-block_starredcourses"></core-courses-course-progress>
<core-courses-course-progress [course]="course" class="core-block_starredcourses" [showDownload]="downloadAllCoursesEnabled"></core-courses-course-progress>
</ng-container>
</div>
</div>

View File

@ -40,7 +40,7 @@ export class AddonBlockStarredCoursesComponent extends CoreBlockBaseComponent im
protected prefetchIconsInitialized = false;
protected isDestroyed;
protected updateSiteObserver;
protected downloadButtonObserver;
protected coursesObserver;
protected courseIds = [];
protected fetchContentDefaultError = 'Error getting starred courses data.';
@ -58,19 +58,18 @@ export class AddonBlockStarredCoursesComponent extends CoreBlockBaseComponent im
* Component being initialized.
*/
ngOnInit(): void {
this.downloadAllCoursesEnabled = !this.coursesProvider.isDownloadCoursesDisabledInSite();
// Refresh the enabled flags if site is updated.
this.updateSiteObserver = this.eventsProvider.on(CoreEventsProvider.SITE_UPDATED, () => {
// Refresh the enabled flags if enabled.
this.downloadButtonObserver = this.eventsProvider.on(CoreCoursesProvider.EVENT_DASHBOARD_DOWNLOAD_ENABLED_CHANGED,
(data) => {
const wasEnabled = this.downloadAllCoursesEnabled;
this.downloadAllCoursesEnabled = !this.coursesProvider.isDownloadCoursesDisabledInSite();
this.downloadAllCoursesEnabled = data.enabled;
if (!wasEnabled && this.downloadAllCoursesEnabled && this.loaded) {
// Download all courses is enabled now, initialize it.
this.initPrefetchCoursesIcons();
}
}, this.sitesProvider.getCurrentSiteId());
});
this.coursesObserver = this.eventsProvider.on(CoreCoursesProvider.EVENT_MY_COURSES_UPDATED, () => {
this.refreshContent();
@ -155,6 +154,6 @@ export class AddonBlockStarredCoursesComponent extends CoreBlockBaseComponent im
ngOnDestroy(): void {
this.isDestroyed = true;
this.coursesObserver && this.coursesObserver.off();
this.updateSiteObserver && this.updateSiteObserver.off();
this.downloadButtonObserver && this.downloadButtonObserver.off();
}
}

View File

@ -20,4 +20,8 @@ ion-app.app-root core-block {
.item-divider .core-button-spinner {
margin: 0;
}
.item-divider .icon {
color: $black;
}
}

View File

@ -3,7 +3,7 @@
<img *ngIf="course.courseImage" [src]="course.courseImage" core-external-content alt=""/>
</div>
<ion-item tappable text-wrap detail-none (click)="openCourse(course)" [title]="course.displayname || course.fullname" class="core-course-link" [class.item-disabled]="course.visible == 0" [class.core-course-more-than-title]="(course.progress != null && course.progress >= 0)">
<div class="core-course-title">
<div class="core-course-title" [class.core-course-with-buttons]="courseOptionMenuEnabled || (downloadCourseEnabled && showDownload)">
<p *ngIf="course.displayname && course.shortname && course.fullname != course.displayname" class="core-course-shortname"><core-format-text [text]="course.shortname"></core-format-text></p>
<h2>
<core-icon name="fa-star" *ngIf="course.isfavourite"></core-icon>
@ -11,7 +11,7 @@
</h2>
</div>
<div class="core-button-spinner" *ngIf="downloadCourseEnabled && !courseOptionMenuEnabled">
<div class="core-button-spinner" *ngIf="downloadCourseEnabled && !courseOptionMenuEnabled && showDownload">
<!-- Download course. -->
<button *ngIf="prefetchCourseData.prefetchCourseIcon != 'spinner'" ion-button icon-only clear color="dark" (click)="prefetchCourse($event)" [attr.aria-label]="prefetchCourseData.title | translate">
<core-icon [name]="prefetchCourseData.prefetchCourseIcon"></core-icon>

View File

@ -54,12 +54,16 @@ ion-app.app-root core-courses-course-progress {
.core-course-title {
margin: 5px 0;
flex-grow: 1;
max-width: calc(100% - 50px);
max-width: calc(100% - 5px);
h2 ion-icon {
margin-right: 4px;
color: $core-star-color;
}
&.core-course-with-buttons {
max-width: calc(100% - 50px);
}
}
&.core-course-more-than-title {
@ -112,7 +116,6 @@ ion-app.app-root .core-horizontal-scroll core-courses-course-progress {
.core-course-title {
margin: 3px 0;
max-width: calc(100% - 40px);
h2 {
font-size: 1.5rem;
@ -120,6 +123,10 @@ ion-app.app-root .core-horizontal-scroll core-courses-course-progress {
margin-right: 2px;
}
}
&.core-course-with-buttons {
max-width: calc(100% - 40px);
}
}
.core-button-spinner {
min-height: 40px;

View File

@ -39,6 +39,7 @@ import { CoreCoursesCourseOptionsMenuComponent } from '../course-options-menu/co
export class CoreCoursesCourseProgressComponent implements OnInit, OnDestroy {
@Input() course: any; // The course to render.
@Input() showAll = false; // If true, will show all actions, options, star and progress.
@Input() showDownload = true; // If true, will show download button. Only works if the options menu is not shown.
isDownloading: boolean;
prefetchCourseData = {

View File

@ -1,4 +1,4 @@
<ion-header>
<ion-header>
<ion-navbar core-back-button>
<ion-title><core-format-text [text]="siteName"></core-format-text></ion-title>
@ -6,6 +6,9 @@
<button *ngIf="searchEnabled" ion-button icon-only (click)="openSearch()" [attr.aria-label]="'core.courses.searchcourses' | translate">
<ion-icon name="search"></ion-icon>
</button>
<core-context-menu>
<core-context-menu-item *ngIf="downloadCourseEnabled" [priority]="1000" [content]="'core.settings.showdownloadoptions' | translate" (action)="toggleDownload()" [iconAction]="downloadEnabledIcon"></core-context-menu-item>
</core-context-menu>
</ion-buttons>
</ion-navbar>
</ion-header>

View File

@ -49,6 +49,10 @@ export class CoreCoursesDashboardPage implements OnDestroy {
userId: number;
dashboardLoaded = false;
downloadEnabled: boolean;
downloadEnabledIcon = 'square-outline'; // Disabled by default.
downloadCourseEnabled: boolean;
protected isDestroyed;
protected updateSiteObserver;
@ -64,10 +68,15 @@ export class CoreCoursesDashboardPage implements OnDestroy {
*/
ionViewDidLoad(): void {
this.searchEnabled = !this.coursesProvider.isSearchCoursesDisabledInSite();
this.downloadCourseEnabled = !this.coursesProvider.isDownloadCourseDisabledInSite();
// Refresh the enabled flags if site is updated.
this.updateSiteObserver = this.eventsProvider.on(CoreEventsProvider.SITE_UPDATED, () => {
this.searchEnabled = !this.coursesProvider.isSearchCoursesDisabledInSite();
this.downloadCourseEnabled = !this.coursesProvider.isDownloadCourseDisabledInSite();
this.switchDownload(this.downloadEnabled);
this.loadSiteName();
}, this.sitesProvider.getCurrentSiteId());
@ -174,6 +183,24 @@ export class CoreCoursesDashboardPage implements OnDestroy {
});
}
/**
* Toggle download enabled.
*/
toggleDownload(): void {
this.switchDownload(!this.downloadEnabled);
}
/**
* Convenience function to switch download enabled.
*
* @param {boolean} enable If enable or disable.
*/
protected switchDownload(enable: boolean): void {
this.downloadEnabled = this.downloadCourseEnabled && enable;
this.downloadEnabledIcon = this.downloadEnabled ? 'checkbox-outline' : 'square-outline';
this.eventsProvider.trigger(CoreCoursesProvider.EVENT_DASHBOARD_DOWNLOAD_ENABLED_CHANGED, {enabled: this.downloadEnabled});
}
/**
* Load fallback blocks to shown before 3.6 when dashboard blocks are not supported.
*/

View File

@ -26,6 +26,7 @@ export class CoreCoursesProvider {
static ENROL_INVALID_KEY = 'CoreCoursesEnrolInvalidKey';
static EVENT_MY_COURSES_UPDATED = 'courses_my_courses_updated';
static EVENT_MY_COURSES_REFRESHED = 'courses_my_courses_refreshed';
static EVENT_DASHBOARD_DOWNLOAD_ENABLED_CHANGED = 'dashboard_download_enabled_changed';
protected ROOT_CACHE_KEY = 'mmCourses:';
protected logger;