From 6b38c4597c6410c2b4a02708ee64d1935505f70c Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 26 Feb 2026 10:32:17 -0800 Subject: [PATCH 1/6] style(Advanced Unit Authoring): Use tabs to organize --- .../advanced-project-authoring.component.html | 155 ++++++++---------- .../advanced-project-authoring.component.ts | 104 +++--------- src/messages.xlf | 65 +++----- 3 files changed, 114 insertions(+), 210 deletions(-) diff --git a/src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html b/src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html index 7870b6c03c8..60d421008e0 100644 --- a/src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html +++ b/src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html @@ -1,99 +1,72 @@ -
- - - -
-
-@if (rubricDisplayed) { -
- -
-} -@if (jsonDisplayed) { -
- + + + + settings + General settings + +
+ + + Default (lessons appear in drop-down list and unit plan) + Tabbed (lessons appear as tabs) + + +
+
+ + Unit URL + + + + +
+ + + + + message + Rubric + + + + + + + + + code + JSON + + Edit Unit JSON -
-} -
- - - Default (lessons appear in drop-down list and unit plan) - Tabbed (lessons appear as tabs) - - -
-
- - Unit URL - - - - -
+ + diff --git a/src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.ts b/src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.ts index 38c80191052..ff7fd1fba9f 100644 --- a/src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.ts +++ b/src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.ts @@ -2,19 +2,17 @@ import { CdkTextareaAutosize } from '@angular/cdk/text-field'; import { Component } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { MatButtonModule } from '@angular/material/button'; -import { MatDialog } from '@angular/material/dialog'; import { MatFormFieldModule } from '@angular/material/form-field'; import { MatIconModule } from '@angular/material/icon'; import { MatInputModule } from '@angular/material/input'; import { MatRadioModule } from '@angular/material/radio'; import { MatTooltipModule } from '@angular/material/tooltip'; -import { filter } from 'rxjs/operators'; import { isValidJSONString } from '../../common/string/string'; import { ConfigService } from '../../services/configService'; import { NotificationService } from '../../services/notificationService'; import { TeacherProjectService } from '../../services/teacherProjectService'; -import { AssetChooser } from '../project-asset-authoring/asset-chooser'; import { RubricAuthoringComponent } from '../rubric/rubric-authoring.component'; +import { MatTabChangeEvent, MatTabsModule } from '@angular/material/tabs'; @Component({ imports: [ @@ -25,78 +23,56 @@ import { RubricAuthoringComponent } from '../rubric/rubric-authoring.component'; MatIconModule, MatInputModule, MatRadioModule, + MatTabsModule, MatTooltipModule, RubricAuthoringComponent ], - styles: [ - ` - .rubric-div { - margin-bottom: 20px; - } - - .mat-icon { - margin: 0px; - } - ` - ], templateUrl: 'advanced-project-authoring.component.html' }) export class AdvancedProjectAuthoringComponent { - protected jsonDisplayed: boolean; - protected navigationType: string = 'default'; - private projectId: number; + protected navigationType: 'default' | 'tab'; protected projectJSONString: string; - protected projectScriptFilename: string; - protected rubricDisplayed: boolean; + protected projectURL: string; + protected selectedTab: number; constructor( - private dialog: MatDialog, private configService: ConfigService, private notificationService: NotificationService, private projectService: TeacherProjectService - ) { - this.projectId = this.configService.getProjectId(); - } + ) {} ngOnInit(): void { - this.setProjectScriptFilename(); - } - - protected toggleRubric(): void { - this.jsonDisplayed = false; - this.rubricDisplayed = !this.rubricDisplayed; + this.navigationType = this.projectService.project.theme ?? 'default'; + this.projectJSONString = JSON.stringify(this.projectService.project, null, 4); + this.projectURL = window.location.origin + this.configService.getConfigParam('projectURL'); } - protected toggleJSON(): void { - this.rubricDisplayed = false; - if (this.jsonDisplayed) { - this.hideJSON(); - } else { + protected tabChanged(event: MatTabChangeEvent): void { + if (event.index === 2) { this.showJSON(); + } else { + this.hideJSON(); } } + private showJSON(): void { + this.notificationService.showJSONValidMessage(); + } + private hideJSON(): void { if (isValidJSONString(this.projectJSONString)) { - this.jsonDisplayed = false; this.notificationService.hideJSONValidMessage(); } else if ( confirm( $localize`The JSON is invalid. Invalid JSON will not be saved.\nClick "OK" to revert back to the last valid JSON.\nClick "Cancel" to keep the invalid JSON open so you can fix it.` ) ) { - this.jsonDisplayed = false; this.notificationService.hideJSONValidMessage(); + this.selectedTab = 2; // re-open JSON tab so user can review JSON } } - private showJSON(): void { - this.jsonDisplayed = true; - this.projectJSONString = JSON.stringify(this.projectService.project, null, 4); - this.notificationService.showJSONValidMessage(); - } - - protected autoSaveProjectJSONString(): void { + protected saveProjectJSONString(): void { try { this.saveProjectJSON(this.projectJSONString); this.notificationService.showJSONValidMessage(); @@ -108,61 +84,27 @@ export class AdvancedProjectAuthoringComponent { private saveProjectJSON(projectJSONString: string): void { const project = JSON.parse(projectJSONString); this.projectService.setProject(project); - this.setProjectScriptFilename(); this.projectService.checkPotentialStartNodeIdChangeThenSaveProject(); } - private setProjectScriptFilename(): void { - this.projectScriptFilename = this.projectService.getProjectScriptFilename(); - } - - protected chooseProjectScriptFile(): void { - new AssetChooser(this.dialog, null, null, this.projectId) - .open('scriptFilename') - .afterClosed() - .pipe(filter((data) => data != null)) - .subscribe((data: any) => { - this.assetSelected(data); - }); - } - - private assetSelected({ assetItem }): void { - this.projectScriptFilename = assetItem.fileName; - this.projectScriptFilenameChanged(); - } - protected downloadProject(): void { - window.location.href = `${this.configService.getWISEBaseURL()}/api/project/export/${ - this.projectId - }`; + window.location.href = `${this.configService.getWISEBaseURL()}/api/project/export/${this.configService.getProjectId()}`; } protected openProjectURLInNewTab(): void { - window.open(this.getProjectURL(), '_blank'); + window.open(this.projectURL, '_blank'); } protected copyProjectURL(): void { const textArea = document.createElement('textarea'); - textArea.value = this.getProjectURL(); + textArea.value = this.projectURL; document.body.appendChild(textArea); textArea.select(); document.execCommand('copy'); document.body.removeChild(textArea); } - protected getProjectURL(): string { - return window.location.origin + this.configService.getConfigParam('projectURL'); - } - - protected projectScriptFilenameChanged(): void { - this.projectService.setProjectScriptFilename(this.projectScriptFilename); - if (this.showJSON) { - this.projectJSONString = JSON.stringify(this.projectService.project, null, 4); - } - this.projectService.saveProject(); - } - - protected updateNavigationType(): void { + protected setNavigationType(): void { this.projectService.project.theme = this.navigationType; this.projectService.saveProject(); } diff --git a/src/messages.xlf b/src/messages.xlf index 062626f2e90..0bde538637e 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -914,10 +914,6 @@ src/app/authoring-tool/edit-component-json/edit-component-json.component.html 8,12 - - src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html - 18,21 - src/assets/wise5/authoringTool/node/advanced/node-advanced-authoring/node-advanced-authoring.component.html 66,70 @@ -947,7 +943,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.ts - 85 + 67 @@ -10571,71 +10567,64 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.30,34 - - Show Rubric + + Navigation mode: src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html - 6,9 + 8,10 - - Download Unit + + Default (lessons appear in drop-down list and unit plan) src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html - 29,32 + 15,17 - - Edit Unit JSON + + Tabbed (lessons appear as tabs) src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html - 46,50 - - - src/assets/wise5/authoringTool/recovery-authoring/recovery-authoring.component.html - 65,69 + 18,22 - - Navigation mode: + + Unit URL src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html - 58,61 + 24,25 - - Default (lessons appear in drop-down list and unit plan) + + Copy unit URL to clipboard src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html - 65,67 + 29,33 - - Tabbed (lessons appear as tabs) + + Open unit URL in new tab src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html - 68,72 + 38,41 - - Unit URL + + Download unit src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html - 74,75 + 43,47 - - Copy Unit URL to Clipboard + + Edit Unit JSON src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html - 81,84 + 62,66 - - - Open Unit URL in New Tab - src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html - 92,95 + src/assets/wise5/authoringTool/recovery-authoring/recovery-authoring.component.html + 65,69 From 2c77a5094fe52df4305570a7284c6df5141caa73 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 26 Feb 2026 11:00:50 -0800 Subject: [PATCH 2/6] Clean up template logic --- .../node-advanced-authoring.component.html | 14 +++----- src/messages.xlf | 35 ++++++++++--------- 2 files changed, 23 insertions(+), 26 deletions(-) diff --git a/src/assets/wise5/authoringTool/node/advanced/node-advanced-authoring/node-advanced-authoring.component.html b/src/assets/wise5/authoringTool/node/advanced/node-advanced-authoring/node-advanced-authoring.component.html index e579d7c0f8d..2c6ca15e815 100644 --- a/src/assets/wise5/authoringTool/node/advanced/node-advanced-authoring/node-advanced-authoring.component.html +++ b/src/assets/wise5/authoringTool/node/advanced/node-advanced-authoring/node-advanced-authoring.component.html @@ -15,44 +15,38 @@ mat-raised-button color="primary" routerLink="general" - matTooltip="General Advanced" + matTooltip="General settings" matTooltipPosition="above" i18n-matTooltip > settings - } - @if (!isGroupNode) { - } - @if (!isGroupNode) { - } - @if (!isGroupNode) { } diff --git a/src/assets/wise5/authoringTool/add-step-button/add-step-button.component.ts b/src/assets/wise5/authoringTool/add-step-button/add-step-button.component.ts index 2c18262af24..ca1552a14b1 100644 --- a/src/assets/wise5/authoringTool/add-step-button/add-step-button.component.ts +++ b/src/assets/wise5/authoringTool/add-step-button/add-step-button.component.ts @@ -12,9 +12,6 @@ import { AddStepTarget } from '../../../../app/domain/addStepTarget'; selector: 'add-step-button', styles: [ ` - .rotate-180 { - transform: rotate(180deg); - } .flip-vertical { transform: scaleY(-1); } diff --git a/src/assets/wise5/authoringTool/node/add-component-button/add-component-button.component.ts b/src/assets/wise5/authoringTool/node/add-component-button/add-component-button.component.ts index bd6ac1c1744..fcd50d204a8 100644 --- a/src/assets/wise5/authoringTool/node/add-component-button/add-component-button.component.ts +++ b/src/assets/wise5/authoringTool/node/add-component-button/add-component-button.component.ts @@ -16,9 +16,6 @@ import { MatMenuModule } from '@angular/material/menu'; selector: 'add-component-button', styles: [ ` - .rotate-180 { - transform: rotate(180deg); - } .flip-vertical { transform: scaleY(-1); } diff --git a/src/assets/wise5/authoringTool/project-authoring-step/project-authoring-step.component.html b/src/assets/wise5/authoringTool/project-authoring-step/project-authoring-step.component.html index de98ccf25e9..e5074c0628e 100644 --- a/src/assets/wise5/authoringTool/project-authoring-step/project-authoring-step.component.html +++ b/src/assets/wise5/authoringTool/project-authoring-step/project-authoring-step.component.html @@ -32,7 +32,7 @@ matTooltipPosition="right" i18n-matTooltip > - call_split + call_split } @if (nodeHasConstraint(step.id)) { diff --git a/src/assets/wise5/authoringTool/project-authoring-step/project-authoring-step.component.scss b/src/assets/wise5/authoringTool/project-authoring-step/project-authoring-step.component.scss index eda4703f283..08bed91e40f 100644 --- a/src/assets/wise5/authoringTool/project-authoring-step/project-authoring-step.component.scss +++ b/src/assets/wise5/authoringTool/project-authoring-step/project-authoring-step.component.scss @@ -26,8 +26,8 @@ } } -.rotate-180 { - transform: rotate(180deg); +.flip-vertical { + transform: scaleY(-1); } .tooltip-helper { diff --git a/src/messages.xlf b/src/messages.xlf index e44149055aa..5f51b812cbb 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -12354,14 +12354,14 @@ The branches will be removed but the steps will remain in the unit. Add component src/assets/wise5/authoringTool/node/add-component-button/add-component-button.component.ts - 34 + 31 Add component after src/assets/wise5/authoringTool/node/add-component-button/add-component-button.component.ts - 51 + 48 From 2e1f7629d736cdc25386166a19f2b538fe10d5fe Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Fri, 27 Feb 2026 14:42:29 -0800 Subject: [PATCH 4/6] Remove copy project URL features. Not necessary for users --- .../advanced-project-authoring.component.html | 19 ------------------- .../advanced-project-authoring.component.ts | 17 +---------------- 2 files changed, 1 insertion(+), 35 deletions(-) diff --git a/src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html b/src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html index 60d421008e0..bff11962ce4 100644 --- a/src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html +++ b/src/assets/wise5/authoringTool/advanced/advanced-project-authoring.component.html @@ -19,25 +19,6 @@ -
- - Unit URL - - - - -