From 0cdba4349631161c28d6a68e589ed78ff3b93a76 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Tue, 20 Jan 2026 15:12:40 -0800 Subject: [PATCH 1/2] fix(Unit Plan): Zoom to and highlight previous step --- .../default/navigation/navigation.component.html | 2 +- .../wise5/vle/nav-item/nav-item.component.html | 7 +++---- .../wise5/vle/nav-item/nav-item.component.scss | 4 ++++ src/assets/wise5/vle/nav-item/nav-item.component.ts | 8 +++++++- src/messages.xlf | 12 ++++++------ 5 files changed, 21 insertions(+), 12 deletions(-) diff --git a/src/assets/wise5/themes/default/navigation/navigation.component.html b/src/assets/wise5/themes/default/navigation/navigation.component.html index 1608caa9889..5fa6ec40d6e 100644 --- a/src/assets/wise5/themes/default/navigation/navigation.component.html +++ b/src/assets/wise5/themes/default/navigation/navigation.component.html @@ -8,7 +8,7 @@ [nodeId]="id" type="card" class="w-full sm:w-{{ navItemIsExpanded[id] ? 'full' : '1/2' }}" - > + /> } diff --git a/src/assets/wise5/vle/nav-item/nav-item.component.html b/src/assets/wise5/vle/nav-item/nav-item.component.html index b97654eabb1..4893d750851 100644 --- a/src/assets/wise5/vle/nav-item/nav-item.component.html +++ b/src/assets/wise5/vle/nav-item/nav-item.component.html @@ -1,4 +1,5 @@ @if (nodeStatus.isVisible) { + @switch (type) { @case ('card') { @@ -52,9 +53,7 @@ i18n-matTooltip matTooltip="{{ nodeStatus.progress.completionPct }}% completed" matTooltipPosition="above" - > - } - @if (isGroup) { + /> {{ nodeStatus.progress.completedItems }}/{{ nodeStatus.progress.totalItems }} items @@ -85,7 +84,7 @@ tabindex="0" i18n-title title="Go to {{ nodeTitle }}" - [ngClass]="{ group: isGroup }" + [ngClass]="{ group: isGroup, 'is-previous-node': isPrevStep }" > diff --git a/src/assets/wise5/vle/nav-item/nav-item.component.scss b/src/assets/wise5/vle/nav-item/nav-item.component.scss index 8de218be9bf..c5caaabc7dd 100644 --- a/src/assets/wise5/vle/nav-item/nav-item.component.scss +++ b/src/assets/wise5/vle/nav-item/nav-item.component.scss @@ -71,4 +71,8 @@ &.expanded, .expanded { @include mat.elevation(3); } + + .is-previous-node { + background-color: lightyellow; + } } diff --git a/src/assets/wise5/vle/nav-item/nav-item.component.ts b/src/assets/wise5/vle/nav-item/nav-item.component.ts index d217e21fcf3..4164e8a45d7 100644 --- a/src/assets/wise5/vle/nav-item/nav-item.component.ts +++ b/src/assets/wise5/vle/nav-item/nav-item.component.ts @@ -57,6 +57,10 @@ export class NavItemComponent { this.isCurrentNode = this.currentNode.id === this.nodeId; if (this.isGroup && this.isCurrentNode) { this.setExpanded(); + this.zoomToElement(); + } + if (this.dataService.previousStep) { + this.isPrevStep = this.nodeId === this.dataService.previousStep.id; } this.subscriptions.add(this.projectService.projectParsed$.subscribe(() => this.setNodeTitle())); this.subscriptions.add( @@ -127,7 +131,9 @@ export class NavItemComponent { } private zoomToElement(): void { - // TODO: implement me + setTimeout(() => { + document.getElementById(`nav-item-${this.nodeId}`).scrollIntoView({ behavior: 'smooth' }); + }, 500); } protected itemClicked(): void { diff --git a/src/messages.xlf b/src/messages.xlf index a7efba237f9..7ec3d98f169 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -13800,7 +13800,7 @@ The branches will be removed but the steps will remain in the unit. src/assets/wise5/vle/nav-item/nav-item.component.html - 53,54 + 54,55 @@ -14981,7 +14981,7 @@ The branches will be removed but the steps will remain in the unit. src/assets/wise5/vle/nav-item/nav-item.component.html - 87,88 + 86,87 @@ -22517,14 +22517,14 @@ If this problem continues, let your teacher know and move on to the next activit Expand or collapse lesson content src/assets/wise5/vle/nav-item/nav-item.component.html - 13,17 + 14,18 / items src/assets/wise5/vle/nav-item/nav-item.component.html - 59,60 + 58,59 src/assets/wise5/vle/student-account-menu/student-account-menu.component.html @@ -22535,14 +22535,14 @@ If this problem continues, let your teacher know and move on to the next activit Lesson is locked src/assets/wise5/vle/nav-item/nav-item.component.html - 70,73 + 69,72 Item is locked src/assets/wise5/vle/nav-item/nav-item.component.html - 100,103 + 99,102 From 53f28c1381490f26d3bea1bd4c12b544f5e98887 Mon Sep 17 00:00:00 2001 From: Jonathan Lim-Breitbart Date: Wed, 21 Jan 2026 09:39:48 -0800 Subject: [PATCH 2/2] Update previous item background style --- src/assets/wise5/vle/nav-item/nav-item.component.html | 2 +- src/assets/wise5/vle/nav-item/nav-item.component.scss | 4 ---- 2 files changed, 1 insertion(+), 5 deletions(-) diff --git a/src/assets/wise5/vle/nav-item/nav-item.component.html b/src/assets/wise5/vle/nav-item/nav-item.component.html index 4893d750851..cc1a1cc7b47 100644 --- a/src/assets/wise5/vle/nav-item/nav-item.component.html +++ b/src/assets/wise5/vle/nav-item/nav-item.component.html @@ -84,7 +84,7 @@ tabindex="0" i18n-title title="Go to {{ nodeTitle }}" - [ngClass]="{ group: isGroup, 'is-previous-node': isPrevStep }" + [ngClass]="{ group: isGroup, 'selected-bg-bg': isPrevStep }" > diff --git a/src/assets/wise5/vle/nav-item/nav-item.component.scss b/src/assets/wise5/vle/nav-item/nav-item.component.scss index c5caaabc7dd..8de218be9bf 100644 --- a/src/assets/wise5/vle/nav-item/nav-item.component.scss +++ b/src/assets/wise5/vle/nav-item/nav-item.component.scss @@ -71,8 +71,4 @@ &.expanded, .expanded { @include mat.elevation(3); } - - .is-previous-node { - background-color: lightyellow; - } }