-
- @for (componentType of componentTypes; track componentType.type) {
-
-
-
+
+
+ @for (componentGroup of componentGroups; track componentGroup.name) {
+
}
-
- *Note: You can always add or remove content later by editing the step.
-
diff --git a/src/assets/wise5/authoringTool/addNode/add-your-own-node/add-your-own-node.component.scss b/src/assets/wise5/authoringTool/addNode/add-your-own-node/add-your-own-node.component.scss
index 48f82056eac..c9a63a1d244 100644
--- a/src/assets/wise5/authoringTool/addNode/add-your-own-node/add-your-own-node.component.scss
+++ b/src/assets/wise5/authoringTool/addNode/add-your-own-node/add-your-own-node.component.scss
@@ -1,4 +1,5 @@
@use '@angular/material' as mat;
+@import 'tailwindcss';
$border-color: #dddddd;
$transform: transform 250ms cubic-bezier(0, 0, 0.2, 1);
@@ -10,8 +11,7 @@ $transform: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}
.initial-components {
- padding: 8px;
- margin: 4px;
+ background-color: var(--color-gray-100);
}
.component-list {
diff --git a/src/assets/wise5/authoringTool/addNode/add-your-own-node/add-your-own-node.component.ts b/src/assets/wise5/authoringTool/addNode/add-your-own-node/add-your-own-node.component.ts
index 20c7769a2f9..c47b76ef299 100644
--- a/src/assets/wise5/authoringTool/addNode/add-your-own-node/add-your-own-node.component.ts
+++ b/src/assets/wise5/authoringTool/addNode/add-your-own-node/add-your-own-node.component.ts
@@ -14,7 +14,7 @@ import { ActivatedRoute, Router, RouterModule } from '@angular/router';
import { TeacherProjectService } from '../../../services/teacherProjectService';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
-import { ComponentTypeButtonComponent } from '../../components/component-type-button/component-type-button.component';
+import { ComponentTypeGroupComponent } from '../../../../../app/authoring-tool/component-type-group/component-type-group.component';
import { MatDividerModule } from '@angular/material/divider';
import { MatButtonModule } from '@angular/material/button';
import { MatProgressBarModule } from '@angular/material/progress-bar';
@@ -25,7 +25,7 @@ import { ensureDefaultIcon } from '../../../common/Node';
@Component({
imports: [
- ComponentTypeButtonComponent,
+ ComponentTypeGroupComponent,
DragDropModule,
FormsModule,
MatButtonModule,
@@ -44,7 +44,7 @@ export class AddYourOwnNodeComponent {
protected addNodeFormGroup: FormGroup = this.fb.group({
title: new FormControl($localize`New Step`, [Validators.required])
});
- protected componentTypes: any[];
+ protected componentGroups: any[];
protected initialComponents: string[] = [];
protected submitting: boolean;
protected target: AddStepTarget;
@@ -58,7 +58,7 @@ export class AddYourOwnNodeComponent {
private route: ActivatedRoute,
private router: Router
) {
- this.componentTypes = this.componentTypeService.getComponentTypes();
+ this.componentGroups = this.componentTypeService.getComponentGroups();
}
ngOnInit(): void {
diff --git a/src/assets/wise5/authoringTool/components/component-type-button/component-type-button.component.scss b/src/assets/wise5/authoringTool/components/component-type-button/component-type-button.component.scss
index c885fdfcb9c..67d9b4e622b 100644
--- a/src/assets/wise5/authoringTool/components/component-type-button/component-type-button.component.scss
+++ b/src/assets/wise5/authoringTool/components/component-type-button/component-type-button.component.scss
@@ -6,4 +6,6 @@ mat-card {
width: 100%;
justify-content: flex-start;
text-transform: capitalize;
+ text-align: start;
+ padding: 0 8px;
}
\ No newline at end of file
diff --git a/src/assets/wise5/components/dialogGuidance/DialogGuidanceInfo.ts b/src/assets/wise5/components/dialogGuidance/DialogGuidanceInfo.ts
index 1dd03d84632..a38e2b3b2b9 100644
--- a/src/assets/wise5/components/dialogGuidance/DialogGuidanceInfo.ts
+++ b/src/assets/wise5/components/dialogGuidance/DialogGuidanceInfo.ts
@@ -2,10 +2,10 @@ import { ComponentInfo } from '../ComponentInfo';
export class DialogGuidanceInfo extends ComponentInfo {
protected description: string = $localize`Students chat with a computer avatar about a specific topic.`;
- protected label: string = $localize`Dialog Guidance`;
+ protected label: string = $localize`Dialog`;
protected previewExamples: any[] = [
{
- label: $localize`Dialog Guidance`,
+ label: $localize`Dialog`,
content: {
id: 'abcde12345',
type: 'DialogGuidance',
diff --git a/src/assets/wise5/components/dialogGuidance/dialogGuidanceService.ts b/src/assets/wise5/components/dialogGuidance/dialogGuidanceService.ts
index 3d7b68a9669..253dec3846e 100644
--- a/src/assets/wise5/components/dialogGuidance/dialogGuidanceService.ts
+++ b/src/assets/wise5/components/dialogGuidance/dialogGuidanceService.ts
@@ -10,7 +10,7 @@ export class DialogGuidanceService extends ComponentService {
}
getComponentTypeLabel(): string {
- return $localize`Dialog Guidance`;
+ return $localize`Dialog`;
}
createComponent() {
diff --git a/src/assets/wise5/components/embedded/EmbeddedInfo.ts b/src/assets/wise5/components/embedded/EmbeddedInfo.ts
index 1611727c7fc..9dce9918095 100644
--- a/src/assets/wise5/components/embedded/EmbeddedInfo.ts
+++ b/src/assets/wise5/components/embedded/EmbeddedInfo.ts
@@ -2,10 +2,10 @@ import { ComponentInfo } from '../ComponentInfo';
export class EmbeddedInfo extends ComponentInfo {
protected description: string = $localize`Students interact with a custom applicatio, such as a model or simulation.`;
- protected label: string = $localize`Embedded (Custom)`;
+ protected label: string = $localize`Custom`;
protected previewExamples: any[] = [
{
- label: $localize`Embedded`,
+ label: $localize`Custom`,
content: {
id: 'abcde12345',
type: 'Embedded',
@@ -13,8 +13,7 @@ export class EmbeddedInfo extends ComponentInfo {
showSaveButton: false,
showSubmitButton: false,
showAddToNotebookButton: false,
- url:
- 'https://wise.berkeley.edu/curriculum/shared/plate-tectonics-convection-explorer/v1/index.html?maxWidth=900',
+ url: 'https://wise.berkeley.edu/curriculum/shared/plate-tectonics-convection-explorer/v1/index.html?maxWidth=900',
height: 600,
constraints: []
}
diff --git a/src/assets/wise5/components/embedded/embeddedService.ts b/src/assets/wise5/components/embedded/embeddedService.ts
index 8ecdc8c1c29..d82d5fa7a0e 100644
--- a/src/assets/wise5/components/embedded/embeddedService.ts
+++ b/src/assets/wise5/components/embedded/embeddedService.ts
@@ -27,7 +27,7 @@ export class EmbeddedService extends ComponentService {
}
getComponentTypeLabel(): string {
- return $localize`Embedded (Custom)`;
+ return $localize`Custom`;
}
createComponent() {
diff --git a/src/assets/wise5/components/html/HtmlInfo.ts b/src/assets/wise5/components/html/HtmlInfo.ts
index 11e00f882e6..f6f3595a90f 100644
--- a/src/assets/wise5/components/html/HtmlInfo.ts
+++ b/src/assets/wise5/components/html/HtmlInfo.ts
@@ -2,10 +2,10 @@ import { ComponentInfo } from '../ComponentInfo';
export class HtmlInfo extends ComponentInfo {
protected description: string = $localize`Students view rich text (HTML) content.`;
- protected label: string = $localize`Rich Text (HTML)`;
+ protected label: string = $localize`Display Content`;
protected previewExamples: any[] = [
{
- label: $localize`Rich Text (HTML)`,
+ label: $localize`Display Content`,
content: {
id: 'abcde12345',
type: 'HTML',
diff --git a/src/assets/wise5/components/html/htmlService.ts b/src/assets/wise5/components/html/htmlService.ts
index ea0649df0f4..644784511b7 100644
--- a/src/assets/wise5/components/html/htmlService.ts
+++ b/src/assets/wise5/components/html/htmlService.ts
@@ -4,7 +4,7 @@ import { Injectable } from '@angular/core';
@Injectable()
export class HTMLService extends ComponentService {
getComponentTypeLabel(): string {
- return $localize`Rich Text (HTML)`;
+ return $localize`Display Content`;
}
createComponent() {
diff --git a/src/assets/wise5/components/match/MatchInfo.ts b/src/assets/wise5/components/match/MatchInfo.ts
index 8d24dd0d259..067b6dc941c 100644
--- a/src/assets/wise5/components/match/MatchInfo.ts
+++ b/src/assets/wise5/components/match/MatchInfo.ts
@@ -2,10 +2,10 @@ import { ComponentInfo } from '../ComponentInfo';
export class MatchInfo extends ComponentInfo {
protected description: string = $localize`Students sort items into different buckets.`;
- protected label: string = $localize`Match`;
+ protected label: string = $localize`Sort`;
protected previewExamples: any[] = [
{
- label: $localize`Match`,
+ label: $localize`Sort`,
content: {
id: 'abcde12345',
type: 'Match',
diff --git a/src/assets/wise5/components/match/matchService.ts b/src/assets/wise5/components/match/matchService.ts
index 09a0f9f8fb5..9ca8dec00fc 100644
--- a/src/assets/wise5/components/match/matchService.ts
+++ b/src/assets/wise5/components/match/matchService.ts
@@ -5,7 +5,7 @@ import { MatchContent } from './MatchContent';
@Injectable()
export class MatchService extends ComponentService {
getComponentTypeLabel(): string {
- return $localize`Match`;
+ return $localize`Sort`;
}
createComponent() {
diff --git a/src/assets/wise5/components/showMyWork/ShowMyWorkInfo.ts b/src/assets/wise5/components/showMyWork/ShowMyWorkInfo.ts
index 4a91b73fd1c..07aabd82e98 100644
--- a/src/assets/wise5/components/showMyWork/ShowMyWorkInfo.ts
+++ b/src/assets/wise5/components/showMyWork/ShowMyWorkInfo.ts
@@ -2,10 +2,10 @@ import { ComponentInfo } from '../ComponentInfo';
export class ShowMyWorkInfo extends ComponentInfo {
protected description: string = $localize`Students are shown work that they submitted for a specific item.`;
- protected label: string = $localize`Show My Work`;
+ protected label: string = $localize`Show Student Work`;
protected previewExamples: any[] = [
{
- label: $localize`Show My Work`,
+ label: $localize`Show Student Work`,
content: {
id: 'abcde12345',
type: 'ShowMyWork',
diff --git a/src/assets/wise5/components/summary/SummaryInfo.ts b/src/assets/wise5/components/summary/SummaryInfo.ts
index 126e1608666..d95e8ee7e97 100644
--- a/src/assets/wise5/components/summary/SummaryInfo.ts
+++ b/src/assets/wise5/components/summary/SummaryInfo.ts
@@ -2,10 +2,10 @@ import { ComponentInfo } from '../ComponentInfo';
export class SummaryInfo extends ComponentInfo {
protected description: string = $localize`Students are shown an aggregate graph summarizing data from the class.`;
- protected label: string = $localize`Summary`;
+ protected label: string = $localize`Summary Graph`;
protected previewExamples: any[] = [
{
- lable: $localize`Summary`,
+ lable: $localize`Summary Graph`,
content: {
id: 'abcde12345',
type: 'Summary',
diff --git a/src/assets/wise5/components/summary/summaryService.ts b/src/assets/wise5/components/summary/summaryService.ts
index f28d143fc7c..b8b585fea2a 100644
--- a/src/assets/wise5/components/summary/summaryService.ts
+++ b/src/assets/wise5/components/summary/summaryService.ts
@@ -37,7 +37,7 @@ export class SummaryService extends ComponentService {
}
getComponentTypeLabel(): string {
- return $localize`Summary`;
+ return $localize`Summary Graph`;
}
createComponent() {
diff --git a/src/assets/wise5/services/componentTypeService.ts b/src/assets/wise5/services/componentTypeService.ts
index 38bb59c5cbb..b6e87e415a2 100644
--- a/src/assets/wise5/services/componentTypeService.ts
+++ b/src/assets/wise5/services/componentTypeService.ts
@@ -11,32 +11,58 @@ export class ComponentTypeService {
private userService: UserService
) {}
- getComponentTypes(): any[] {
- const componentTypes = [
- { type: 'Animation', name: this.getComponentTypeLabel('Animation') },
- { type: 'AudioOscillator', name: this.getComponentTypeLabel('AudioOscillator') },
- { type: 'ConceptMap', name: this.getComponentTypeLabel('ConceptMap') },
- { type: 'DialogGuidance', name: this.getComponentTypeLabel('DialogGuidance') },
- { type: 'Discussion', name: this.getComponentTypeLabel('Discussion') },
- { type: 'Draw', name: this.getComponentTypeLabel('Draw') },
- { type: 'Embedded', name: this.getComponentTypeLabel('Embedded') },
- { type: 'Graph', name: this.getComponentTypeLabel('Graph') },
- { type: 'Label', name: this.getComponentTypeLabel('Label') },
- { type: 'Match', name: this.getComponentTypeLabel('Match') },
- { type: 'MultipleChoice', name: this.getComponentTypeLabel('MultipleChoice') },
- { type: 'OpenResponse', name: this.getComponentTypeLabel('OpenResponse') },
- { type: 'OutsideURL', name: this.getComponentTypeLabel('OutsideURL') },
- { type: 'PeerChat', name: this.getComponentTypeLabel('PeerChat') },
- { type: 'HTML', name: this.getComponentTypeLabel('HTML') },
- { type: 'ShowGroupWork', name: this.getComponentTypeLabel('ShowGroupWork') },
- { type: 'ShowMyWork', name: this.getComponentTypeLabel('ShowMyWork') },
- { type: 'Summary', name: this.getComponentTypeLabel('Summary') },
- { type: 'Table', name: this.getComponentTypeLabel('Table') }
+ getComponentGroups(): any[] {
+ const groups = [
+ {
+ name: $localize`View Information`,
+ types: [
+ { type: 'HTML', name: this.getComponentTypeLabel('HTML') },
+ { type: 'ShowMyWork', name: this.getComponentTypeLabel('ShowMyWork') },
+ { type: 'Summary', name: this.getComponentTypeLabel('Summary') }
+ ]
+ },
+ {
+ name: $localize`Explain and Assess`,
+ types: [
+ { type: 'ConceptMap', name: this.getComponentTypeLabel('ConceptMap') },
+ { type: 'Draw', name: this.getComponentTypeLabel('Draw') },
+ { type: 'Label', name: this.getComponentTypeLabel('Label') },
+ { type: 'MultipleChoice', name: this.getComponentTypeLabel('MultipleChoice') },
+ { type: 'OpenResponse', name: this.getComponentTypeLabel('OpenResponse') },
+ { type: 'Match', name: this.getComponentTypeLabel('Match') }
+ ]
+ },
+ {
+ name: $localize`Experiment, Discover, Distinguish`,
+ types: [
+ { type: 'Animation', name: this.getComponentTypeLabel('Animation') },
+ { type: 'AudioOscillator', name: this.getComponentTypeLabel('AudioOscillator') },
+ { type: 'Embedded', name: this.getComponentTypeLabel('Embedded') },
+ { type: 'Graph', name: this.getComponentTypeLabel('Graph') },
+ { type: 'OutsideURL', name: this.getComponentTypeLabel('OutsideURL') },
+ { type: 'Table', name: this.getComponentTypeLabel('Table') }
+ ]
+ },
+ {
+ name: $localize`Collaborate`,
+ types: [
+ { type: 'DialogGuidance', name: this.getComponentTypeLabel('DialogGuidance') },
+ { type: 'Discussion', name: this.getComponentTypeLabel('Discussion') },
+ { type: 'PeerChat', name: this.getComponentTypeLabel('PeerChat') },
+ { type: 'ShowGroupWork', name: this.getComponentTypeLabel('ShowGroupWork') }
+ ]
+ }
];
+
if (this.isAiChatAllowed()) {
- componentTypes.unshift({ type: 'AiChat', name: this.getComponentTypeLabel('AiChat') });
+ groups[2].types.unshift({ type: 'AiChat', name: this.getComponentTypeLabel('AiChat') });
}
- return componentTypes;
+
+ return groups;
+ }
+
+ getComponentTypes(): any[] {
+ return this.getComponentGroups().flatMap((group) => group.types);
}
getComponentTypeLabel(componentType: string): string {
diff --git a/src/messages.xlf b/src/messages.xlf
index 4d3fe9d9a6c..ae2b498b9e7 100644
--- a/src/messages.xlf
+++ b/src/messages.xlf
@@ -405,7 +405,7 @@
Cancel
src/app/authoring-tool/add-component/choose-new-component/choose-new-component.component.html
- 19,21
+ 20,22
src/app/authoring-tool/import-step/choose-import-step/choose-import-step.component.html
@@ -469,7 +469,7 @@
src/assets/wise5/authoringTool/addNode/add-your-own-node/add-your-own-node.component.html
- 58,62
+ 57,61
src/assets/wise5/authoringTool/addNode/choose-new-node-template/choose-new-node-template.component.html
@@ -1594,7 +1594,7 @@
src/assets/wise5/authoringTool/addNode/add-your-own-node/add-your-own-node.component.html
- 55,58
+ 54,57
src/assets/wise5/authoringTool/addNode/choose-automated-assessment/choose-automated-assessment.component.html
@@ -1677,7 +1677,7 @@
src/assets/wise5/authoringTool/addNode/add-your-own-node/add-your-own-node.component.html
- 69,74
+ 68,73
src/assets/wise5/authoringTool/addNode/choose-simulation/choose-simulation.component.html
@@ -2403,18 +2403,6 @@
src/app/contact/contact-form/contact-form.component.html
77,78
-
- src/assets/wise5/components/summary/SummaryInfo.ts
- 5
-
-
- src/assets/wise5/components/summary/SummaryInfo.ts
- 8
-
-
- src/assets/wise5/components/summary/summaryService.ts
- 40
-
Summary required
@@ -10412,31 +10400,31 @@
9,11
+
+ *Note: You can always add or remove content later by editing the step.
+
+ src/assets/wise5/authoringTool/addNode/add-your-own-node/add-your-own-node.component.html
+ 11,14
+
+
No activities added
src/assets/wise5/authoringTool/addNode/add-your-own-node/add-your-own-node.component.html
- 13,16
+ 16,19
Delete activity
src/assets/wise5/authoringTool/addNode/add-your-own-node/add-your-own-node.component.html
- 26,28
+ 29,31
src/assets/wise5/authoringTool/node/node-authoring/node-authoring.component.html
69,71
-
- *Note: You can always add or remove content later by editing the step.
-
- src/assets/wise5/authoringTool/addNode/add-your-own-node/add-your-own-node.component.html
- 47,52
-
-
New Step
@@ -18545,8 +18533,8 @@ Category Name:
4
-
- Dialog Guidance
+
+ Dialog
src/assets/wise5/components/dialogGuidance/DialogGuidanceInfo.ts
5
@@ -19743,23 +19731,20 @@ Category Name:
4
-
- Embedded (Custom)
+
+ Custom
src/assets/wise5/components/embedded/EmbeddedInfo.ts
5
-
- src/assets/wise5/components/embedded/embeddedService.ts
- 30
-
-
-
- Embedded
src/assets/wise5/components/embedded/EmbeddedInfo.ts
8
+
+ src/assets/wise5/components/embedded/embeddedService.ts
+ 30
+
Model Parameters
@@ -20712,8 +20697,8 @@ Category Name:
4
-
- Rich Text (HTML)
+
+ Display Content
src/assets/wise5/components/html/HtmlInfo.ts
5
@@ -20977,8 +20962,8 @@ Category Name:
4
-
- Match
+
+ Sort
src/assets/wise5/components/match/MatchInfo.ts
5
@@ -22306,8 +22291,8 @@ If this problem continues, let your teacher know and move on to the next activit
4
-
- Show My Work
+
+ Show Student Work
src/assets/wise5/components/showMyWork/ShowMyWorkInfo.ts
5
@@ -22316,6 +22301,10 @@ If this problem continues, let your teacher know and move on to the next activit
src/assets/wise5/components/showMyWork/ShowMyWorkInfo.ts
8
+
+ src/assets/wise5/components/showMyWork/showMyWorkService.ts
+ 7
+
(No response)
@@ -22324,13 +22313,6 @@ If this problem continues, let your teacher know and move on to the next activit
5,8
-
- Show Student Work
-
- src/assets/wise5/components/showMyWork/showMyWorkService.ts
- 7
-
-
Students are shown an aggregate graph summarizing data from the class.
@@ -22338,6 +22320,21 @@ If this problem continues, let your teacher know and move on to the next activit
4
+
+ Summary Graph
+
+ src/assets/wise5/components/summary/SummaryInfo.ts
+ 5
+
+
+ src/assets/wise5/components/summary/SummaryInfo.ts
+ 8
+
+
+ src/assets/wise5/components/summary/summaryService.ts
+ 40
+
+
Choose the step and activity to show the summary data for:
@@ -23346,6 +23343,34 @@ If this problem continues, let your teacher know and move on to the next activit
23
+
+ View Information
+
+ src/assets/wise5/services/componentTypeService.ts
+ 17
+
+
+
+ Explain and Assess
+
+ src/assets/wise5/services/componentTypeService.ts
+ 25
+
+
+
+ Experiment, Discover, Distinguish
+
+ src/assets/wise5/services/componentTypeService.ts
+ 36
+
+
+
+ Collaborate
+
+ src/assets/wise5/services/componentTypeService.ts
+ 47
+
+
Ermina