EVOgeek
/
Vmeda.Online
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

MOBILE-4733 courses: Add course-id data attribute to course

main
Pau Ferrer Ocaña 2025-01-09 11:00:17 +01:00
parent 988a5b6b39
commit 9108e76f83
9 changed files with 26 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/addons/block/myoverview/components/myoverview/addon-block-myoverview.html
View File

@ -117,11 +117,11 @@
</core-empty-box> </core-empty-box>
<!-- List of courses. --> <!-- List of courses. -->
<div class="safe-area-padding" *ngIf="hasCourses"> <div class="safe-area-padding core-course-list" *ngIf="hasCourses">
<ion-grid class="ion-no-padding" [class.core-no-grid]="layout !== 'card'" [class.list-item-limited-width]="layout !== 'card'"> <ion-grid class="ion-no-padding" [class.core-no-grid]="layout !== 'card'" [class.list-item-limited-width]="layout !== 'card'">
<ion-row class="ion-no-padding"> <ion-row class="ion-no-padding">
<ion-col *ngFor="let course of filteredCourses" class="ion-no-padding" size="12" size-sm="6" size-md="6" size-lg="4" <ion-col *ngFor="let course of filteredCourses" class="ion-no-padding" size="12" size-sm="6" size-md="6" size-lg="4"
size-xl="3"> size-xl="3" [attr.data-course-id]="course.id">
<core-courses-course-list-item [course]="course" class="core-courseoverview" [showDownload]="downloadCourseEnabled" <core-courses-course-list-item [course]="course" class="core-courseoverview" [showDownload]="downloadCourseEnabled"
[layout]="layout" /> [layout]="layout" />
</ion-col> </ion-col>

2
src/addons/block/recentlyaccessedcourses/components/recentlyaccessedcourses/addon-block-recentlyaccessedcourses.html
View File

@ -12,7 +12,7 @@
<!-- List of courses. --> <!-- List of courses. -->
<div [hidden]="courses.length === 0" [id]="scrollElementId" class="core-horizontal-scroll" <div [hidden]="courses.length === 0" [id]="scrollElementId" class="core-horizontal-scroll"
(scroll)="scrollControls.updateScrollPosition()"> (scroll)="scrollControls.updateScrollPosition()">
<div (onResize)="scrollControls.updateScrollPosition()" class="flex-row"> <div (onResize)="scrollControls.updateScrollPosition()" class="flex-row core-course-list">
<div class="safe-area-pseudo-padding-start"></div> <div class="safe-area-pseudo-padding-start"></div>
<ng-container *ngFor="let course of courses"> <ng-container *ngFor="let course of courses">
<core-courses-course-list-item [course]="course" class="core-recentlyaccessedcourses" layout="summarycard" /> <core-courses-course-list-item [course]="course" class="core-recentlyaccessedcourses" layout="summarycard" />

2
src/addons/block/starredcourses/components/starredcourses/addon-block-starredcourses.html
View File

@ -12,7 +12,7 @@
<!-- List of courses. --> <!-- List of courses. -->
<div [hidden]="courses.length === 0" [id]="scrollElementId" class="core-horizontal-scroll" <div [hidden]="courses.length === 0" [id]="scrollElementId" class="core-horizontal-scroll"
(scroll)="scrollControls.updateScrollPosition()"> (scroll)="scrollControls.updateScrollPosition()">
<div (onResize)="scrollControls.updateScrollPosition()" class="flex-row"> <div (onResize)="scrollControls.updateScrollPosition()" class="flex-row core-course-list">
<div class="safe-area-pseudo-padding-start"></div> <div class="safe-area-pseudo-padding-start"></div>
<ng-container *ngFor="let course of courses"> <ng-container *ngFor="let course of courses">
<core-courses-course-list-item [course]="course" class="core-block_starredcourses" layout="summarycard" /> <core-courses-course-list-item [course]="course" class="core-block_starredcourses" layout="summarycard" />

2
src/addons/block/timeline/components/events/addon-block-timeline-events.html
View File

@ -14,7 +14,7 @@
</ion-item> </ion-item>
<ng-container *ngFor="let event of dayEvents.events"> <ng-container *ngFor="let event of dayEvents.events">
<ion-item class="addon-block-timeline-activity" [detail]="false" (click)="action($event, event.url)" [attr.aria-label]="event.name" <ion-item class="addon-block-timeline-activity" [detail]="false" (click)="action($event, event.url)" [attr.aria-label]="event.name"
button lines="full"> button lines="full" [attr.data-event-course-id]="event.course?.id">
<ion-label> <ion-label>
<ion-row class="ion-justify-content-between ion-align-items-center ion-nowrap ion-no-padding"> <ion-row class="ion-justify-content-between ion-align-items-center ion-nowrap ion-no-padding">
<ion-col class="addon-block-timeline-activity-time ion-no-padding ion-text-nowrap"> <ion-col class="addon-block-timeline-activity-time ion-no-padding ion-text-nowrap">

6
src/addons/block/timeline/components/events/events.ts
View File

@ -12,7 +12,7 @@
// See the License for the specific language governing permissions and // See the License for the specific language governing permissions and
// limitations under the License. // limitations under the License.
import { Component, Input, Output, EventEmitter, OnInit } from '@angular/core'; import { Component, Input, Output, EventEmitter, OnInit, HostBinding } from '@angular/core';
import { CoreSites } from '@services/sites'; import { CoreSites } from '@services/sites';
import { CoreLoadings } from '@services/loadings'; import { CoreLoadings } from '@services/loadings';
import { CoreText } from '@singletons/text'; import { CoreText } from '@singletons/text';
@ -44,6 +44,10 @@ export class AddonBlockTimelineEventsComponent implements OnInit {
colorizeIcons = false; colorizeIcons = false;
@HostBinding('attr.data-course-id') protected get courseId(): number | null {
return this.course?.id ?? null;
}
/** /**
* @inheritdoc * @inheritdoc
*/ */

8
src/core/features/courses/components/course-list-item/course-list-item.ts
View File

@ -13,7 +13,7 @@
// limitations under the License. // limitations under the License.
import { DownloadStatus } from '@/core/constants'; import { DownloadStatus } from '@/core/constants';
import { Component, ElementRef, Input, OnChanges, OnDestroy, OnInit } from '@angular/core'; import { Component, ElementRef, HostBinding, Input, OnChanges, OnDestroy, OnInit } from '@angular/core';
import { CoreCourse } from '@features/course/services/course'; import { CoreCourse } from '@features/course/services/course';
import { CoreCourseHelper, CorePrefetchStatusInfo } from '@features/course/services/course-helper'; import { CoreCourseHelper, CorePrefetchStatusInfo } from '@features/course/services/course-helper';
import { CoreUser } from '@features/user/services/user'; import { CoreUser } from '@features/user/services/user';
@ -43,7 +43,7 @@ import { CORE_COURSE_ALL_COURSES_CLEARED, CORE_COURSE_PROGRESS_UPDATED_EVENT } f
* *
* Example usage: * Example usage:
* *
* <core-courses-course-list-item [course]="course"></core-courses-course-list-item> * <core-courses-course-list-item [course]="course" />
*/ */
@Component({ @Component({
selector: 'core-courses-course-list-item', selector: 'core-courses-course-list-item',
@ -83,6 +83,10 @@ export class CoreCoursesCourseListItemComponent implements OnInit, OnDestroy, On
protected element: HTMLElement; protected element: HTMLElement;
protected progressObserver: CoreEventObserver; protected progressObserver: CoreEventObserver;
@HostBinding('attr.data-course-id') protected get courseId(): number {
return this.course.id;
}
constructor(element: ElementRef) { constructor(element: ElementRef) {
this.element = element.nativeElement; this.element = element.nativeElement;
const siteId = CoreSites.getCurrentSiteId(); const siteId = CoreSites.getCurrentSiteId();

10
src/core/features/courses/pages/categories/categories.html
View File

@ -38,13 +38,13 @@
</ion-label> </ion-label>
</ion-item> </ion-item>
<ng-container *ngIf="categories.length > 0"> <div *ngIf="categories.length > 0" class="core-category-list">
<ion-item-divider> <ion-item-divider>
<ion-label> <ion-label>
<h2 class="big">{{ 'core.courses.categories' | translate }}</h2> <h2 class="big">{{ 'core.courses.categories' | translate }}</h2>
</ion-label> </ion-label>
</ion-item-divider> </ion-item-divider>
<ion-card *ngFor="let category of categories"> <ion-card *ngFor="let category of categories" [attr.data-category-id]="category.id">
<ion-item button class="ion-text-wrap" (click)="openCategory(category.id)" [attr.aria-label]="category.name" <ion-item button class="ion-text-wrap" (click)="openCategory(category.id)" [attr.aria-label]="category.name"
[detail]="true"> [detail]="true">
<ion-icon name="fas-folder" slot="start" [attr.aria-label]="'core.category' | translate" /> <ion-icon name="fas-folder" slot="start" [attr.aria-label]="'core.category' | translate" />
@ -59,9 +59,9 @@
</ion-badge> </ion-badge>
</ion-item> </ion-item>
</ion-card> </ion-card>
</ng-container> </div>
<ng-container *ngIf="courses.length > 0"> <div *ngIf="courses.length > 0" class="core-course-list">
<ion-item-divider> <ion-item-divider>
<ion-label> <ion-label>
<h2 *ngIf="!showOnlyEnrolled" class="big">{{ 'core.courses.courses' | translate }}</h2> <h2 *ngIf="!showOnlyEnrolled" class="big">{{ 'core.courses.courses' | translate }}</h2>
@ -69,7 +69,7 @@
</ion-label> </ion-label>
</ion-item-divider> </ion-item-divider>
<core-courses-course-list-item *ngFor="let course of courses" [course]="course" [showDownload]="downloadEnabled" /> <core-courses-course-list-item *ngFor="let course of courses" [course]="course" [showDownload]="downloadEnabled" />
</ng-container> </div>
</ion-list> </ion-list>
<core-empty-box *ngIf="!categories.length && !courses.length" icon="fas-graduation-cap" <core-empty-box *ngIf="!categories.length && !courses.length" icon="fas-graduation-cap"
[message]="'core.courses.nocoursesyet' | translate" /> [message]="'core.courses.nocoursesyet' | translate" />

2
src/core/features/courses/pages/list/list.html
View File

@ -37,7 +37,7 @@
</ion-item-divider> </ion-item-divider>
</ng-container> </ng-container>
<ion-list class="list-item-limited-width"> <ion-list class="list-item-limited-width core-course-list">
<core-courses-course-list-item *ngFor="let course of courses" [course]="course" [showDownload]="downloadEnabled" /> <core-courses-course-list-item *ngFor="let course of courses" [course]="course" [showDownload]="downloadEnabled" />
</ion-list> </ion-list>

6
src/theme/theme.base.scss
View File

@ -241,7 +241,8 @@ ion-content.limited-width > :not([slot]) {
min-height: 100%; min-height: 100%;
} }
.core-anchor, core-format-text a { .core-anchor,
core-format-text a {
color: var(--core-link-color); color: var(--core-link-color);
cursor: pointer; cursor: pointer;
text-decoration: underline; text-decoration: underline;
@ -262,7 +263,8 @@ ion-content.limited-width > :not([slot]) {
// Text formats. // Text formats.
// Highlight text. // Highlight text.
mark, .matchtext { mark,
.matchtext {
background-color: var(--text-hightlight-background-color); background-color: var(--text-hightlight-background-color);
} }