diff --git a/src/app/authoring-tool/edit-component-advanced/edit-component-advanced.component.html b/src/app/authoring-tool/edit-component-advanced/edit-component-advanced.component.html deleted file mode 100644 index 79e1be3824d..00000000000 --- a/src/app/authoring-tool/edit-component-advanced/edit-component-advanced.component.html +++ /dev/null @@ -1,13 +0,0 @@ -
-

Advanced Activity Settings

- -
-
-
- - - - -
diff --git a/src/app/authoring-tool/edit-component-advanced/edit-component-advanced.component.spec.ts b/src/app/authoring-tool/edit-component-advanced/edit-component-advanced.component.spec.ts index 2166cae3fe7..ee81e49755c 100644 --- a/src/app/authoring-tool/edit-component-advanced/edit-component-advanced.component.spec.ts +++ b/src/app/authoring-tool/edit-component-advanced/edit-component-advanced.component.spec.ts @@ -1,5 +1,4 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; -import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { MockComponent, MockProviders } from 'ng-mocks'; import { ComponentContent } from '../../../assets/wise5/common/ComponentContent'; import { EditShowMyWorkAdvancedComponent } from '../../../assets/wise5/components/showMyWork/edit-show-my-work-advanced/edit-show-my-work-advanced.component'; @@ -9,6 +8,7 @@ import { TeacherNodeService } from '../../../assets/wise5/services/teacherNodeSe import { TeacherProjectService } from '../../../assets/wise5/services/teacherProjectService'; import { EditComponentAdvancedComponent } from './edit-component-advanced.component'; import { ComponentServiceLookupService } from '../../../assets/wise5/services/componentServiceLookupService'; +import { Component } from '../../../assets/wise5/common/Component'; let component: EditComponentAdvancedComponent; let fixture: ComponentFixture; @@ -17,23 +17,6 @@ describe('EditComponentAdvancedComponent', () => { await TestBed.configureTestingModule({ imports: [MockComponent(EditShowMyWorkAdvancedComponent), EditComponentAdvancedComponent], providers: [ - { - provide: MAT_DIALOG_DATA, - useValue: { - component: { - content: { type: 'ShowMyWork' }, - id: 'component1', - nodeId: 'node1' - }, - tab: 'general' - } - }, - { - provide: MatDialogRef, - useValue: { - close: () => {} - } - }, MockProviders( ComponentServiceLookupService, TeacherNodeService, @@ -46,6 +29,11 @@ describe('EditComponentAdvancedComponent', () => { fixture = TestBed.createComponent(EditComponentAdvancedComponent); component = fixture.componentInstance; + component.component = { + id: 'component1', + nodeId: 'node1', + content: { type: 'ShowMyWork' } + } as Component; spyOn(TestBed.inject(TeacherProjectService), 'getComponent').and.returnValue({ type: 'ShowMyWork' } as ComponentContent); diff --git a/src/app/authoring-tool/edit-component-advanced/edit-component-advanced.component.ts b/src/app/authoring-tool/edit-component-advanced/edit-component-advanced.component.ts index febba44f6fe..6ec7460149a 100644 --- a/src/app/authoring-tool/edit-component-advanced/edit-component-advanced.component.ts +++ b/src/app/authoring-tool/edit-component-advanced/edit-component-advanced.component.ts @@ -5,12 +5,12 @@ import { createComponent, ElementRef, EnvironmentInjector, - Inject, + Input, ViewChild, ViewEncapsulation } from '@angular/core'; import { MatButtonModule } from '@angular/material/button'; -import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog'; +import { MatDialogModule } from '@angular/material/dialog'; import { MatDivider } from '@angular/material/divider'; import { Component as WISEComponent } from '../../../assets/wise5/common/Component'; import { components } from '../../../assets/wise5/components/Components'; @@ -18,6 +18,7 @@ import { components } from '../../../assets/wise5/components/Components'; @Component({ encapsulation: ViewEncapsulation.None, imports: [MatDivider, MatDialogModule, MatButtonModule], + selector: 'edit-component-advanced', styles: [ ` .edit-component-advanced { @@ -39,29 +40,25 @@ import { components } from '../../../assets/wise5/components/Components'; } ` ], - templateUrl: './edit-component-advanced.component.html' + template: '
' }) export class EditComponentAdvancedComponent { + @Input() component: WISEComponent; @ViewChild('component') private componentElementRef: ElementRef; private componentRef: ComponentRef; constructor( private applicationRef: ApplicationRef, - @Inject(MAT_DIALOG_DATA) protected data: { component: WISEComponent; tab?: string }, private injector: EnvironmentInjector ) {} ngAfterViewInit(): void { - this.componentRef = createComponent( - components[this.data.component.content.type].authoringAdvanced, - { - hostElement: this.componentElementRef.nativeElement, - environmentInjector: this.injector - } - ); + this.componentRef = createComponent(components[this.component.content.type].authoringAdvanced, { + hostElement: this.componentElementRef.nativeElement, + environmentInjector: this.injector + }); Object.assign(this.componentRef.instance, { - nodeId: this.data.component.nodeId, - componentId: this.data.component.id, - tab: this.data.tab + nodeId: this.component.nodeId, + componentId: this.component.id }); this.applicationRef.attachView(this.componentRef.hostView); } diff --git a/src/app/authoring-tool/edit-component-field.component.ts b/src/app/authoring-tool/edit-component-field.component.ts index a8fe4df789d..db1ec2ee855 100644 --- a/src/app/authoring-tool/edit-component-field.component.ts +++ b/src/app/authoring-tool/edit-component-field.component.ts @@ -15,7 +15,7 @@ export abstract class EditComponentFieldComponent { this.inputChangedSubscription = this.inputChanged .pipe(debounceTime(1000), distinctUntilChanged()) .subscribe(() => { - this.projectService.componentChanged(); + this.projectService.saveProject(); }); } diff --git a/src/app/authoring-tool/edit-component-json/edit-component-json.component.ts b/src/app/authoring-tool/edit-component-json/edit-component-json.component.ts index cb629d507b5..d8e6247e87a 100644 --- a/src/app/authoring-tool/edit-component-json/edit-component-json.component.ts +++ b/src/app/authoring-tool/edit-component-json/edit-component-json.component.ts @@ -56,7 +56,7 @@ export class EditComponentJsonComponent { this.projectService .getNode(this.component.nodeId) .replaceComponent(this.component.id, JSON.parse(this.componentContentJSONString)); - this.projectService.componentChanged(); + this.projectService.saveProject(); this.notificationService.showJSONValidMessage(); } catch (e) { this.notificationService.showJSONInvalidMessage(); diff --git a/src/app/authoring-tool/edit-component-rubric/edit-component-rubric.component.ts b/src/app/authoring-tool/edit-component-rubric/edit-component-rubric.component.ts index 12c0bafd13e..8ca9c7b9f46 100644 --- a/src/app/authoring-tool/edit-component-rubric/edit-component-rubric.component.ts +++ b/src/app/authoring-tool/edit-component-rubric/edit-component-rubric.component.ts @@ -17,6 +17,6 @@ export class EditComponentRubricComponent { constructor(private projectService: TeacherProjectService) {} protected save(): void { - this.projectService.componentChanged(); + this.projectService.saveProject(); } } diff --git a/src/app/authoring-tool/edit-component-tags/edit-component-tags.component.ts b/src/app/authoring-tool/edit-component-tags/edit-component-tags.component.ts index ae7998727e0..ce820e29564 100644 --- a/src/app/authoring-tool/edit-component-tags/edit-component-tags.component.ts +++ b/src/app/authoring-tool/edit-component-tags/edit-component-tags.component.ts @@ -47,7 +47,7 @@ export class EditComponentTagsComponent { .pipe(debounceTime(1000), distinctUntilChanged()) .subscribe(({ tagIndex, tag }) => { this.componentContent.tags[tagIndex] = tag; - this.projectService.componentChanged(); + this.projectService.saveProject(); }); } @@ -60,7 +60,7 @@ export class EditComponentTagsComponent { this.componentContent.tags = []; } this.componentContent.tags.push(''); - this.projectService.componentChanged(); + this.projectService.saveProject(); } moveTagUp(index: number): void { @@ -68,7 +68,7 @@ export class EditComponentTagsComponent { const tag = this.componentContent.tags[index]; this.componentContent.tags.splice(index, 1); this.componentContent.tags.splice(index - 1, 0, tag); - this.projectService.componentChanged(); + this.projectService.saveProject(); } } @@ -77,14 +77,14 @@ export class EditComponentTagsComponent { const tag = this.componentContent.tags[index]; this.componentContent.tags.splice(index, 1); this.componentContent.tags.splice(index + 1, 0, tag); - this.projectService.componentChanged(); + this.projectService.saveProject(); } } deleteTag(indexOfTagToDelete: number): void { if (confirm($localize`Are you sure you want to delete this tag?`)) { this.componentContent.tags.splice(indexOfTagToDelete, 1); - this.projectService.componentChanged(); + this.projectService.saveProject(); } } } diff --git a/src/assets/wise5/authoringTool/components/edit-component-dialog/edit-component-dialog.component.ts b/src/assets/wise5/authoringTool/components/edit-component-dialog/edit-component-dialog.component.ts index 37cb7ae422a..c9a59a971b5 100644 --- a/src/assets/wise5/authoringTool/components/edit-component-dialog/edit-component-dialog.component.ts +++ b/src/assets/wise5/authoringTool/components/edit-component-dialog/edit-component-dialog.component.ts @@ -1,36 +1,41 @@ -import { Component, inject, Inject } from '@angular/core'; +import { Component, Inject } from '@angular/core'; import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog'; import { EditComponentComponent } from '../edit-component/edit-component.component'; -import { EditComponentAdvancedButtonComponent } from '../edit-component-advanced-button/edit-component-advanced-button.component'; import { MatButtonModule } from '@angular/material/button'; import { MatDividerModule } from '@angular/material/divider'; import { ComponentTypeService } from '../../../services/componentTypeService'; +import { MatSlideToggle } from '@angular/material/slide-toggle'; +import { FormsModule } from '@angular/forms'; +import { Component as WISEComponent } from '../../../common/Component'; +import { EditComponentAdvancedComponent } from '../../../../../app/authoring-tool/edit-component-advanced/edit-component-advanced.component'; import { TeacherProjectService } from '../../../services/teacherProjectService'; @Component({ imports: [ - EditComponentAdvancedButtonComponent, EditComponentComponent, + EditComponentAdvancedComponent, + FormsModule, MatButtonModule, MatDialogModule, - MatDividerModule + MatDividerModule, + MatSlideToggle ], template: `

Edit: {{ componentIndex }}. {{ componentTypeLabel }}

- - + Advanced mode
- + @if (advancedMode) { + + } @else { + + } @@ -46,18 +51,22 @@ import { TeacherProjectService } from '../../../services/teacherProjectService'; ` }) export class EditComponentDialogComponent { + protected advancedMode = false; + protected component: WISEComponent; protected componentIndex: number; protected componentTypeLabel: string; constructor( + private componentTypeService: ComponentTypeService, @Inject(MAT_DIALOG_DATA) public data: any, private projectService: TeacherProjectService ) { + this.component = new WISEComponent(this.data.componentContent, this.data.nodeId); this.componentIndex = this.projectService .getNode(this.data.nodeId) .getComponentIndex(this.data.componentContent.id) + 1; - this.componentTypeLabel = inject(ComponentTypeService).getComponentTypeLabel( + this.componentTypeLabel = this.componentTypeService.getComponentTypeLabel( this.data.componentContent.type ); } diff --git a/src/messages.xlf b/src/messages.xlf index 562cb9ec9f4..0008c0d5f4a 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -824,32 +824,6 @@ 16,19 - - Advanced Activity Settings - - src/app/authoring-tool/edit-component-advanced/edit-component-advanced.component.html - 2,5 - - - - Close - - src/app/authoring-tool/edit-component-advanced/edit-component-advanced.component.html - 10,14 - - - src/assets/wise5/authoringTool/components/edit-component-dialog/edit-component-dialog.component.ts - 38,43 - - - src/assets/wise5/authoringTool/node/advanced/node-advanced-authoring/node-advanced-authoring.component.html - 46,50 - - - src/assets/wise5/themes/default/notebook/edit-notebook-item-dialog/edit-notebook-item-dialog.component.html - 114,119 - - Add Visibility Constraint @@ -11176,22 +11150,40 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.22,26 - - Advanced + + Edit: . - src/assets/wise5/authoringTool/components/edit-component-advanced-button/edit-component-advanced-button.component.html - 6,10 + src/assets/wise5/authoringTool/components/edit-component-dialog/edit-component-dialog.component.ts + 25,26 + + + Advanced mode - src/assets/wise5/authoringTool/components/edit-node-advanced-button/edit-node-advanced-button.component.ts - 17,21 + src/assets/wise5/authoringTool/components/edit-component-dialog/edit-component-dialog.component.ts + 26,29 - - Edit: . + + Close src/assets/wise5/authoringTool/components/edit-component-dialog/edit-component-dialog.component.ts - 20,21 + 43,48 + + + src/assets/wise5/authoringTool/node/advanced/node-advanced-authoring/node-advanced-authoring.component.html + 46,50 + + + src/assets/wise5/themes/default/notebook/edit-notebook-item-dialog/edit-notebook-item-dialog.component.html + 114,119 + + + + Advanced + + src/assets/wise5/authoringTool/components/edit-node-advanced-button/edit-node-advanced-button.component.ts + 17,21