MOBILE-2302 myoverview: Remove roundProgress and move filter option

src/core/courses/components/course-progress/course-progress.html

@@ -1,26 +1,8 @@
 <ion-card>
-    <a ion-item text-wrap class="item-course" [class.item-progress]="roundProgress" (click)="openCourse(course)" [title]="course.fullname">
-        <div class="progress-chart-container" *ngIf="roundProgress">
-            <div *ngIf="course.progress !== false" class="progress-doughnut">
-                <div class="progress-text has-percent">{{course.progress}}&#37;</div>
-                <div class="progress-indicator">
-                    <svg xmlns="http://www.w3.org/2000/svg">
-                        <g>
-                            <title>{{course.progress}}&#37;</title>
-                            <!-- Commenting circle because it throws an error in console:
-                                Cannot assign to read only property 'className' of object '[object SVGCircleElement]'
-                                <circle class="circle percent-{{course.progress}}" r="27.5" cx="35" cy="35"/> -->
-                        </g>
-                    </svg>
-                </div>
-            </div>
-            <div *ngIf="course.progress === false" class="no-progress">
-                <ion-icon name="ionic"></ion-icon>
-            </div>
-        </div>
+    <a ion-item text-wrap class="item-course" (click)="openCourse(course)" [title]="course.fullname">
         <h2><core-format-text [text]="course.fullname"></core-format-text></h2>
-        <core-progress-bar *ngIf="!roundProgress && course.progress !== false" [progress]="course.progress"></core-progress-bar>
-        <!-- Course options. -->
+        <core-progress-bar *ngIf="course.progress !== false" [progress]="course.progress"></core-progress-bar>
+        <!-- @todo: Download button. -->
         <!-- <i *ngIf="actionsLoaded" class="icon ion-android-more-vertical mm-animate-show-hide" ng-click="showCourseActions($event)"></i>
         <ion-spinner *ngIf="!actionsLoaded" class="mm-animate-show-hide"></ion-spinner> -->
         <!-- Download course spinner. -->

src/core/courses/components/course-progress/course-progress.ts

@@ -31,7 +31,6 @@ import { CoreUtilsProvider } from '../../../../providers/utils/utils';
 })
 export class CoreCoursesCourseProgressComponent implements OnInit {
     @Input() course: any; // The course to render.
-    @Input() roundProgress?: boolean|string; // Whether to show the progress.
     @Input() showSummary?: boolean|string; // Whether to show the summary.
 
     actionsLoaded = true;
@@ -57,8 +56,6 @@ export class CoreCoursesCourseProgressComponent implements OnInit {
      */
     ngOnInit() {
         // @todo: Handle course prefetch.
-        // @todo: Handle course handlers (participants, etc.).
-        this.roundProgress = this.utils.isTrueOrOne(this.roundProgress);
         this.showSummary = this.utils.isTrueOrOne(this.showSummary);
     }
 

src/core/courses/pages/my-overview/my-overview.html

@@ -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>
+            <button *ngIf="tabShown == 'courses' && courses[courses.selected] && courses[courses.selected].length > 5" ion-button icon-only (click)="switchFilter()" [attr.aria-label]="'core.courses.filtermycourses' | translate">
+                <ion-icon name="funnel"></ion-icon>
+            </button>
         </ion-buttons>
     </ion-navbar>
 </ion-header>
@@ -14,6 +17,7 @@
         <ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content>
     </ion-refresher>
 
+    <!-- @todo: Use a component to render the tabs. -->
     <div class="tabs tabs-striped tabs-free mm-tabs-color">
         <a ion-button class="tab-item" [class.active]="tabShown == 'timeline'" (click)="switchTab('timeline')">{{ 'core.courses.timeline' | translate }}</a>
         <a ion-button class="tab-item" [class.active]="tabShown == 'courses'" (click)="switchTab('courses')">{{ 'core.courses.courses' | translate }}</a>
@@ -31,7 +35,7 @@
         </core-loading>
         <core-loading [hideUntil]="timelineCourses.loaded" [hidden]="tabShown != 'timeline' || timeline.sort != 'sortbycourses'" class="block mm-loading-center">
             <div class="block mm-course-grid">
-                <core-courses-course-progress *ngFor="let course of timelineCourses.courses" [course]="course" roundProgress="true" showSummary="true">
+                <core-courses-course-progress *ngFor="let course of timelineCourses.courses" [course]="course" showSummary="true">
                     <core-courses-overview-events [events]="course.events" [canLoadMore]="course.canLoadMore" (loadMore)="loadMoreCourse(course)"></core-courses-overview-events>
                 </core-courses-course-progress>
             </div>
@@ -49,11 +53,7 @@
                     </ion-item>
                 </ion-col>
                 <ion-col col-1 class="text-right" [hidden]="!courses[courses.selected] || !courses[courses.selected].length">
-                    <core-context-menu>
-                        <core-context-menu-item [hidden]="!courses[courses.selected] || courses[courses.selected].length <= 5" [priority]="700" [content]="'core.courses.filtermycourses' | translate" (action)="switchFilter()" [iconAction]="'funnel'"></core-context-menu-item>
-                        <core-context-menu-item [hidden]="showGrid" [priority]="601" [content]="'core.layoutgrid' | translate" (action)="switchGrid()" [iconAction]="'apps'"></core-context-menu-item>
-                        <core-context-menu-item [hidden]="!showGrid" [priority]="600" [content]="'core.list' | translate" (action)="switchGrid()" [iconAction]="'list'"></core-context-menu-item>
-                    </core-context-menu>
+                    <!-- @todo: Download button. -->
                 </ion-col>
             </ion-row>
             <div [hidden]="!showFilter" class="mm-filter-box">
@@ -67,7 +67,7 @@
             </div>
 
             <div [class.mm-course-grid]="showGrid">
-                <core-courses-course-progress *ngFor="let course of filteredCourses" [course]="course" [roundProgress]="showGrid" [showSummary]="showGrid"></core-courses-course-progress>
+                <core-courses-course-progress *ngFor="let course of filteredCourses" [course]="course" [showSummary]="showGrid"></core-courses-course-progress>
             </div>
 
             <core-empty-box *ngIf="courses[courses.selected].length == 0 && courses.selected == 'inprogress'" image="assets/img/icons/courses.svg" [message]="'core.courses.nocoursesinprogress' | translate"></core-empty-box>

src/core/courses/pages/my-overview/my-overview.ts

@@ -166,7 +166,6 @@ export class CoreCoursesMyOverviewPage {
             // Load course options of the course.
             return this.coursesProvider.getCoursesOptions(courseIds).then((options) => {
                 courses.forEach((course) => {
-                    course.showProgress = true;
                     course.progress = isNaN(parseInt(course.progress, 10)) ? false : parseInt(course.progress, 10);
 
                     course.navOptions = options.navOptions[course.id];