CIT/Vmeda.Online
3
0
Fork 1
forked from EVOgeek/Vmeda.Online
Code Pull Requests Activity

MOBILE-4362 lesson: Display 'Correct response' as badge

Browse Source
This commit is contained in:
Dani Palou 2023-10-10 11:17:22 +02:00
parent b3af76705e
commit cc472e58f5
3 changed files with 17 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/addons/mod/lesson/pages/user-retake/user-retake.html
View File

@ -128,7 +128,7 @@
<ng-container *ngIf="page.isQuestion">
<!-- Question page, show the right input for the answer. -->
<!-- Truefalse or matching. -->
<!-- Truefalse or multichoice. -->
<ion-item class="ion-text-wrap" *ngIf="answer[0].isCheckbox"
[ngClass]="{'addon-mod_lesson-highlight': answer[0].highlight}">
<ion-label>
@ -138,12 +138,15 @@
[courseId]="courseId">
</core-format-text>
</p>
<ion-badge *ngIf="answer[1]" color="dark">
<ion-badge *ngIf="answer[1]" color="dark" class="addon-mod_lesson-answer-stats">
<core-format-text [component]="component" [componentId]="lesson?.coursemodule"
[text]="answer[1]" contextLevel="module" [contextInstanceId]="lesson?.coursemodule"
[courseId]="courseId">
</core-format-text>
</ion-badge>
<ion-badge *ngIf="answer[0].successBadge" color="success" class="addon-mod_lesson-answer-success">
{{ answer[0].successBadge }}
</ion-badge>
</ion-label>
<ion-checkbox [attr.name]="answer[0].name" [ngModel]="answer[0].checked" [disabled]="true" slot="end">
</ion-checkbox>

6
src/addons/mod/lesson/pages/user-retake/user-retake.scss
View File

@ -1,3 +1,5 @@
@import "~theme/globals";
:host {
.button-disabled {
opacity: 0.4;
@ -14,4 +16,8 @@
.item-interactive-disabled ion-label {
opacity: 0.5;
}
.addon-mod_lesson-answer-success {
@include margin-horizontal(4px, null);
}
}

8
src/addons/mod/lesson/services/lesson-helper.ts
View File

@ -461,25 +461,28 @@ export class AddonModLessonHelperProvider {
const element = CoreDomUtils.convertToElement(html);
// Check if it has a checkbox.
let input = <HTMLInputElement> element.querySelector('input[type="checkbox"][name*="answer"]');
let input = element.querySelector<HTMLInputElement>('input[type="checkbox"][name*="answer"]');
if (input) {
// Truefalse or multichoice.
const successBadge = element.querySelector<HTMLElement>('.badge.badge-success');
const data: AddonModLessonCheckboxAnswerData = {
isCheckbox: true,
checked: !!input.checked,
name: input.name,
highlight: !!element.querySelector('.highlight'),
content: '',
successBadge: successBadge?.innerText,
};
input.remove();
successBadge?.remove();
data.content = element.innerHTML.trim();
return data;
}
// Check if it has an input text or number.
input = <HTMLInputElement> element.querySelector('input[type="number"],input[type="text"]');
input = element.querySelector<HTMLInputElement>('input[type="number"],input[type="text"]');
if (input) {
// Short answer or numeric.
return {
@ -700,6 +703,7 @@ export type AddonModLessonCheckboxAnswerData = {
name: string;
highlight: boolean;
content: string;
successBadge?: string;
};
/**