Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
37 changes: 19 additions & 18 deletions src/addons/badges/pages/badge-class/badge-class.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,77 +4,78 @@
<ion-back-button [text]="'core.back' | translate" />
</ion-buttons>
<ion-title>
@if (badge) {
<h1>{{ badge.name }}</h1>
@let badgeToShow = badge();
@if (badgeToShow) {
<h1>{{ badgeToShow.name }}</h1>
} @else {
<h1>{{ 'addon.badges.badgedetails' | translate }}</h1>
}
</ion-title>
</ion-toolbar>
</ion-header>
<ion-content class="limited-width">
<ion-refresher slot="fixed" [disabled]="!badgeLoaded" (ionRefresh)="refreshBadgeClass($event.target)">
<ion-refresher slot="fixed" [disabled]="!loaded()" (ionRefresh)="refreshBadgeClass($event.target)">
<ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}" />
</ion-refresher>
<core-loading [hideUntil]="badgeLoaded" placeholderType="imageandboxes">
@if (badge) {
<core-loading [hideUntil]="loaded()" placeholderType="imageandboxes">
@if (badgeToShow) {
<ion-item-group>
<ion-item class="ion-text-wrap ion-text-center">
<ion-label>
@if (badge.image) {
<img class="large-avatar" [url]="badge.image" core-external-content [alt]="badge.name" />
@if (badgeToShow.image) {
<img class="large-avatar" [url]="badgeToShow.image" core-external-content [alt]="badgeToShow.name" />
}
</ion-label>
</ion-item>
@if (badge.name) {
@if (badgeToShow.name) {
<ion-item class="ion-text-wrap">
<ion-label>
<p class="item-heading">{{ 'core.name' | translate}}</p>
<p>{{ badge.name }}</p>
<p>{{ badgeToShow.name }}</p>
</ion-label>
</ion-item>
}
@if (badge.issuer) {
@if (badgeToShow.issuer) {
<ion-item class="ion-text-wrap">
<ion-label>
<p class="item-heading">{{ 'addon.badges.issuername' | translate}}</p>
<p>
<core-format-text [text]="badge.issuer" contextLevel="system" [contextInstanceId]="0"
<core-format-text [text]="badgeToShow.issuer" contextLevel="system" [contextInstanceId]="0"
[wsNotFiltered]="true" />
</p>
</ion-label>
</ion-item>
}
@if (badge.coursefullname) {
@if (badgeToShow.coursefullname) {
<ion-item class="ion-text-wrap">
<ion-label>
<p class="item-heading">{{ 'core.course' | translate}}</p>
<p>
<core-format-text [text]="badge.coursefullname" contextLevel="course"
[contextInstanceId]="badge.courseid" />
<core-format-text [text]="badgeToShow.coursefullname" contextLevel="course"
[contextInstanceId]="badgeToShow.courseid" />
</p>
</ion-label>
</ion-item>
}
@if (badge.description) {
@if (badgeToShow.description) {
<ion-item class="ion-text-wrap">
<ion-label>
<p class="item-heading">{{ 'core.description' | translate}}</p>
<p>{{ badge.description }}</p>
<p>{{ badgeToShow.description }}</p>
</ion-label>
</ion-item>
}
</ion-item-group>

<!-- Competencies alignment -->
@if (badge.alignment?.length) {
@if (badgeToShow.alignment?.length) {
<ion-item-group>
<ion-item-divider>
<ion-label>
<h2>{{ 'addon.badges.alignment' | translate}}</h2>
</ion-label>
</ion-item-divider>
<ion-item class="ion-text-wrap" *ngFor="let alignment of badge.alignment" [href]="alignment.targetUrl" core-link
<ion-item class="ion-text-wrap" *ngFor="let alignment of badgeToShow.alignment" [href]="alignment.targetUrl" core-link
[autoLogin]="false">
<ion-label>
<p class="item-heading">{{ alignment.targetName }}</p>
Expand Down
23 changes: 10 additions & 13 deletions src/addons/badges/pages/badge-class/badge-class.ts
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
// See the License for the specific language governing permissions and
// limitations under the License.

import { Component, OnInit, inject } from '@angular/core';
import { Component, OnInit, inject, signal } from '@angular/core';
import { CorePromiseUtils } from '@singletons/promise-utils';
import { CoreNavigator } from '@services/navigator';
import { ActivatedRoute } from '@angular/router';
Expand All @@ -38,9 +38,8 @@ export default class AddonBadgesBadgeClassPage implements OnInit {
protected badgeId = 0;
protected logView: (badge: AddonBadgesBadgeClass) => void;

badge?: AddonBadgesBadgeClass;
badgeLoaded = false;
currentTime = 0;
readonly badge = signal<AddonBadgesBadgeClass | undefined>(undefined);
readonly loaded = signal(false);

constructor() {
this.badgeId = CoreNavigator.getRequiredRouteNumberParam('badgeId');
Expand All @@ -59,22 +58,20 @@ export default class AddonBadgesBadgeClassPage implements OnInit {
/**
* @inheritdoc
*/
ngOnInit(): void {
this.fetchBadgeClass().finally(() => {
this.badgeLoaded = true;
});
async ngOnInit(): Promise<void> {
await this.fetchBadgeClass();

this.loaded.set(true);
}

/**
* Fetch the badge class required for the view.
*
* @returns Promise resolved when done.
*/
async fetchBadgeClass(): Promise<void> {
try {
this.badge = await AddonBadges.getBadgeClass(this.badgeId);

this.logView(this.badge);
const badge = await AddonBadges.getBadgeClass(this.badgeId);
this.badge.set(badge);
this.logView(badge);
} catch (message) {
CoreAlerts.showError(message, { default: 'Error getting badge data.' });
}
Expand Down
Loading
Loading