diff --git a/src/app/teacher/component-authoring.module.ts b/src/app/teacher/component-authoring.module.ts
index 5fb5a3f9147..75a84f5d74a 100644
--- a/src/app/teacher/component-authoring.module.ts
+++ b/src/app/teacher/component-authoring.module.ts
@@ -159,7 +159,6 @@ import { RequiredErrorLabelComponent } from '../../assets/wise5/authoringTool/no
HtmlAuthoring,
LabelAuthoring,
MatchAuthoring,
- MultipleChoiceAuthoring,
OutsideUrlAuthoring,
PeerChatAuthoringComponent,
ShowGroupWorkAuthoringComponent,
@@ -174,6 +173,7 @@ import { RequiredErrorLabelComponent } from '../../assets/wise5/authoringTool/no
EditComponentConstraintsComponent,
EditComponentPrompt,
EditComponentWidthComponent,
+ MultipleChoiceAuthoring,
OpenResponseAuthoringComponent,
PeerGroupingAuthoringModule,
RequiredErrorLabelComponent,
diff --git a/src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html b/src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
index b71609d91db..dabef738295 100644
--- a/src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
+++ b/src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
@@ -1,7 +1,7 @@
+/>
add
-
- There are no choices. Click the "Add Choice" button to add a choice.
-
-
-
-
-
-
-
+ There are no choices. Click the "Add Choice" button to add a choice.
+
+}
+@for (choice of componentContent.choices; track choice.id; let last = $last; let first = $first) {
+
+
+
+
+
+
+ Is Correct
+
+
+
+
+
+
+
+
-
-
-
-
-
-
-
+}
diff --git a/src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.ts b/src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.ts
index c4fe3f7ab05..7c42677139e 100644
--- a/src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.ts
+++ b/src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.ts
@@ -1,30 +1,54 @@
import { Component } from '@angular/core';
+import { FormsModule } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import { MatIconModule } from '@angular/material/icon';
+import { MatRadioModule } from '@angular/material/radio';
+import { MatTooltipModule } from '@angular/material/tooltip';
import { Subject } from 'rxjs';
-import { debounceTime, distinctUntilChanged, filter } from 'rxjs/operators';
+import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
import { ProjectAssetService } from '../../../../../app/services/projectAssetService';
import { AbstractComponentAuthoring } from '../../../authoringTool/components/AbstractComponentAuthoring';
import { generateRandomKey } from '../../../common/string/string';
import { ConfigService } from '../../../services/configService';
import { TeacherProjectService } from '../../../services/teacherProjectService';
import { TeacherNodeService } from '../../../services/teacherNodeService';
+import { moveObjectDown, moveObjectUp } from '../../../common/array/array';
+import { FlexLayoutModule } from '@angular/flex-layout';
+import { EditComponentPrompt } from '../../../../../app/authoring-tool/edit-component-prompt/edit-component-prompt.component';
+import { TranslatableAssetChooserComponent } from '../../../authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component';
+import { TranslatableInputComponent } from '../../../authoringTool/components/translatable-input/translatable-input.component';
@Component({
+ imports: [
+ FormsModule,
+ FlexLayoutModule,
+ MatButtonModule,
+ MatCheckboxModule,
+ MatIconModule,
+ MatRadioModule,
+ MatTooltipModule,
+ EditComponentPrompt,
+ TranslatableAssetChooserComponent,
+ TranslatableInputComponent
+ ],
selector: 'multiple-choice-authoring',
- templateUrl: 'multiple-choice-authoring.component.html',
- styleUrls: ['multiple-choice-authoring.component.scss']
+ standalone: true,
+ styleUrls: ['multiple-choice-authoring.component.scss'],
+ templateUrl: 'multiple-choice-authoring.component.html'
})
export class MultipleChoiceAuthoring extends AbstractComponentAuthoring {
allowedConnectedComponentTypes = ['MultipleChoice'];
- choiceTextChange: Subject
= new Subject();
- feedbackTextChange: Subject = new Subject();
+ protected choiceTextChange: Subject = new Subject();
+ protected feedbackTextChange: Subject = new Subject();
constructor(
- protected ConfigService: ConfigService,
- protected NodeService: TeacherNodeService,
- protected ProjectAssetService: ProjectAssetService,
- protected ProjectService: TeacherProjectService
+ protected configService: ConfigService,
+ protected nodeService: TeacherNodeService,
+ protected projectAssetService: ProjectAssetService,
+ protected projectService: TeacherProjectService
) {
- super(ConfigService, NodeService, ProjectAssetService, ProjectService);
+ super(configService, nodeService, projectAssetService, projectService);
this.subscriptions.add(
this.choiceTextChange.pipe(debounceTime(1000), distinctUntilChanged()).subscribe(() => {
this.componentChanged();
@@ -37,7 +61,7 @@ export class MultipleChoiceAuthoring extends AbstractComponentAuthoring {
);
}
- feedbackChanged(): void {
+ protected feedbackChanged(): void {
let show = true;
if (!this.componentHasFeedback()) {
show = false;
@@ -46,7 +70,7 @@ export class MultipleChoiceAuthoring extends AbstractComponentAuthoring {
this.componentChanged();
}
- componentHasFeedback(): boolean {
+ private componentHasFeedback(): boolean {
for (const choice of this.componentContent.choices) {
if (choice.isCorrect || (choice.feedback != null && choice.feedback !== '')) {
return true;
@@ -55,7 +79,7 @@ export class MultipleChoiceAuthoring extends AbstractComponentAuthoring {
return false;
}
- addChoice(): void {
+ protected addChoice(): void {
const newChoice = {
id: generateRandomKey(),
text: '',
@@ -66,50 +90,28 @@ export class MultipleChoiceAuthoring extends AbstractComponentAuthoring {
this.componentChanged();
}
- deleteChoice(choiceId: string): void {
+ protected deleteChoice(choice: any): void {
if (confirm($localize`Are you sure you want to delete this choice?`)) {
- const choices = this.componentContent.choices;
- for (let c = 0; c < choices.length; c++) {
- if (choices[c].id === choiceId) {
- choices.splice(c, 1);
- break;
- }
- }
+ this.componentContent.choices.splice(this.findChoiceIndex(choice), 1);
this.componentChanged();
}
}
- moveChoiceUp(choiceId: string): void {
- const choices = this.componentContent.choices;
- for (let c = 0; c < choices.length; c++) {
- const choice = choices[c];
- if (choice.id === choiceId) {
- if (c !== 0) {
- choices.splice(c, 1);
- choices.splice(c - 1, 0, choice);
- }
- break;
- }
- }
+ protected moveChoiceUp(choice: any): void {
+ moveObjectUp(this.componentContent.choices, this.findChoiceIndex(choice));
this.componentChanged();
}
- moveChoiceDown(choiceId: string): void {
- const choices = this.componentContent.choices;
- for (let c = 0; c < choices.length; c++) {
- const choice = choices[c];
- if (choice.id === choiceId) {
- if (c !== choices.length - 1) {
- choices.splice(c, 1);
- choices.splice(c + 1, 0, choice);
- }
- break;
- }
- }
+ protected moveChoiceDown(choice: any): void {
+ moveObjectDown(this.componentContent.choices, this.findChoiceIndex(choice));
this.componentChanged();
}
- processSelectedAsset(value: string): string {
+ private findChoiceIndex(searchChoice: any): number {
+ return this.componentContent.choices.findIndex((choice) => choice === searchChoice);
+ }
+
+ protected processSelectedAsset(value: string): string {
return ``;
}
}
diff --git a/src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.spec.ts b/src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.spec.ts
index 1072e34d46d..87585289fc6 100644
--- a/src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.spec.ts
+++ b/src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.spec.ts
@@ -1,20 +1,11 @@
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
import { MultipleChoiceAuthoring } from './multiple-choice-authoring.component';
-import { provideHttpClientTesting } from '@angular/common/http/testing';
-import { MatDialogModule } from '@angular/material/dialog';
import { StudentTeacherCommonServicesModule } from '../../../../../app/student-teacher-common-services.module';
import { ProjectAssetService } from '../../../../../app/services/projectAssetService';
import { TeacherProjectService } from '../../../services/teacherProjectService';
-import { EditComponentPrompt } from '../../../../../app/authoring-tool/edit-component-prompt/edit-component-prompt.component';
-import { MatRadioModule } from '@angular/material/radio';
-import { MatIconModule } from '@angular/material/icon';
-import { MatFormFieldModule } from '@angular/material/form-field';
-import { FormsModule } from '@angular/forms';
-import { MatInputModule } from '@angular/material/input';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
import { MultipleChoiceAuthoringHarness } from './multiple-choice-authoring.harness';
-import { MatCheckboxModule } from '@angular/material/checkbox';
import { TeacherNodeService } from '../../../services/teacherNodeService';
import { ComponentAuthoringModule } from '../../component-authoring.module';
import { ProjectLocale } from '../../../../../app/domain/projectLocale';
@@ -30,26 +21,18 @@ let teacherProjectService: TeacherProjectService;
describe('MultipleChoiceAuthoringComponent', () => {
beforeEach(waitForAsync(() => {
TestBed.configureTestingModule({
- declarations: [MultipleChoiceAuthoring],
+ declarations: [],
imports: [
BrowserAnimationsModule,
ComponentAuthoringModule,
- EditComponentPrompt,
- FormsModule,
- MatDialogModule,
- MatCheckboxModule,
- MatFormFieldModule,
- MatIconModule,
- MatInputModule,
- MatRadioModule,
+ MultipleChoiceAuthoring,
StudentTeacherCommonServicesModule
],
providers: [
ProjectAssetService,
TeacherNodeService,
TeacherProjectService,
- provideHttpClient(withInterceptorsFromDi()),
- provideHttpClientTesting()
+ provideHttpClient(withInterceptorsFromDi())
]
});
}));
diff --git a/src/messages.xlf b/src/messages.xlf
index 305166c1005..72d901c561c 100644
--- a/src/messages.xlf
+++ b/src/messages.xlf
@@ -629,7 +629,7 @@
src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
- 89
+ 85
src/assets/wise5/components/summary/summary-authoring/summary-authoring.component.html
@@ -688,7 +688,7 @@
src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
- 103
+ 99
src/assets/wise5/components/summary/summary-authoring/summary-authoring.component.html
@@ -799,11 +799,11 @@
src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
- 116
+ 112
src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
- 119
+ 115
src/assets/wise5/components/summary/summary-authoring/summary-authoring.component.html
@@ -9854,7 +9854,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.
src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
- 75
+ 71
@@ -16087,7 +16087,7 @@ Are you sure you want to proceed?
src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
- 92
+ 88
src/assets/wise5/components/summary/summary-authoring/summary-authoring.component.html
@@ -16125,7 +16125,7 @@ Are you sure you want to proceed?
src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
- 106
+ 102
src/assets/wise5/components/summary/summary-authoring/summary-authoring.component.html
@@ -19479,6 +19479,10 @@ Warning: This will delete all existing choices and buckets in this component.src/assets/wise5/components/match/match-authoring/match-authoring.component.html
53,55
+
+ src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
+ 31,33
+
@@ -19499,7 +19503,7 @@ Warning: This will delete all existing choices and buckets in this component.
src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
- 47
+ 43
@@ -19578,6 +19582,10 @@ Warning: This will delete all existing choices and buckets in this component.src/assets/wise5/components/match/match-authoring/match-authoring.component.html
254,256
+
+ src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
+ 62,64
+
@@ -19601,7 +19609,7 @@ Warning: This will delete all existing choices and buckets in this component.
src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.ts
- 70
+ 94
@@ -19802,40 +19810,25 @@ Warning: This will delete all existing choices in this component.
13
-
-
-
- src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
- 34,36
-
-
src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
- 45
+ 41
src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
- 64
-
-
-
-
-
- src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
- 66,68
+ 60
src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
- 77
+ 73