diff --git a/src/app/student/vle/student-vle.module.ts b/src/app/student/vle/student-vle.module.ts
index 7410d27beae..a0e927cc6c7 100644
--- a/src/app/student/vle/student-vle.module.ts
+++ b/src/app/student/vle/student-vle.module.ts
@@ -1,19 +1,14 @@
import '../../../assets/wise5/lib/jquery/jquery-global';
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
-import { MatButtonModule } from '@angular/material/button';
import { MatDialogModule } from '@angular/material/dialog';
-import { MatListModule } from '@angular/material/list';
import { ComponentStudentModule } from '../../../assets/wise5/components/component/component-student.module';
import { GenerateImageDialogComponent } from '../../../assets/wise5/directives/generate-image-dialog/generate-image-dialog.component';
-import { SafeUrl } from '../../../assets/wise5/directives/safeUrl/safe-url.pipe';
import { SimpleDialogModule } from '../../../assets/wise5/directives/simple-dialog.module';
import { SummaryDisplayModule } from '../../../assets/wise5/directives/summary-display/summary-display.module';
import { InitializeVLEService } from '../../../assets/wise5/services/initializeVLEService';
import { ProjectService } from '../../../assets/wise5/services/projectService';
import { StudentDataService } from '../../../assets/wise5/services/studentDataService';
-import { NavigationComponent } from '../../../assets/wise5/themes/default/navigation/navigation.component';
-import { StepToolsComponent } from '../../../assets/wise5/themes/default/themeComponents/stepTools/step-tools.component';
import { StudentAssetsDialogModule } from '../../../assets/wise5/vle/studentAsset/student-assets-dialog/student-assets-dialog.module';
import { VLEComponent } from '../../../assets/wise5/vle/vle.component';
import { VLEProjectService } from '../../../assets/wise5/vle/vleProjectService';
@@ -26,41 +21,22 @@ import { PauseScreenService } from '../../../assets/wise5/services/pauseScreenSe
import { StudentNotificationService } from '../../../assets/wise5/services/studentNotificationService';
import { NotificationService } from '../../../assets/wise5/services/notificationService';
import { VLEParentComponent } from '../../../assets/wise5/vle/vle-parent/vle-parent.component';
-import { RunEndedAndLockedMessageComponent } from '../../../assets/wise5/vle/run-ended-and-locked-message/run-ended-and-locked-message.component';
-import { NodeNavigationComponent } from '../../../assets/wise5/directives/node-navigation/node-navigation.component';
-import { GroupTabsComponent } from '../../../assets/wise5/directives/group-tabs/group-tabs.component';
import { StudentPeerGroupService } from '../../../assets/wise5/services/studentPeerGroupService';
import { PeerGroupService } from '../../../assets/wise5/services/peerGroupService';
-import { TopBarComponent } from '../top-bar/top-bar.component';
-import { NodeStatusIconComponent } from '../../../assets/wise5/themes/default/themeComponents/nodeStatusIcon/node-status-icon.component';
-import { NodeComponent } from '../../../assets/wise5/vle/node/node.component';
@NgModule({
- declarations: [
- ChooseBranchPathDialogComponent,
- GenerateImageDialogComponent,
- SafeUrl,
- VLEComponent,
- VLEParentComponent
- ],
+ declarations: [ChooseBranchPathDialogComponent, GenerateImageDialogComponent, VLEParentComponent],
imports: [
CommonModule,
ComponentStudentModule,
- GroupTabsComponent,
MatDialogModule,
- NavigationComponent,
- NodeComponent,
- NodeNavigationComponent,
- NodeStatusIconComponent,
- RunEndedAndLockedMessageComponent,
SimpleDialogModule,
- StepToolsComponent,
StudentAssetsDialogModule,
StudentComponentModule,
StudentTeacherCommonModule,
StudentVLERoutingModule,
SummaryDisplayModule,
- TopBarComponent
+ VLEComponent
],
providers: [
InitializeVLEService,
@@ -71,7 +47,6 @@ import { NodeComponent } from '../../../assets/wise5/vle/node/node.component';
{ provide: ProjectService, useExisting: VLEProjectService },
StudentNotificationService,
VLEProjectService
- ],
- exports: [CommonModule, MatButtonModule, MatDialogModule, MatListModule]
+ ]
})
export class StudentVLEModule {}
diff --git a/src/assets/wise5/directives/safeUrl/safe-url.pipe.ts b/src/assets/wise5/directives/safeUrl/safe-url.pipe.ts
index 718b801857e..4e71acc09a4 100644
--- a/src/assets/wise5/directives/safeUrl/safe-url.pipe.ts
+++ b/src/assets/wise5/directives/safeUrl/safe-url.pipe.ts
@@ -2,7 +2,8 @@ import { Pipe, PipeTransform } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';
@Pipe({
- name: 'safeUrl'
+ name: 'safeUrl',
+ standalone: true
})
export class SafeUrl implements PipeTransform {
constructor(private sanitizer: DomSanitizer) {}
diff --git a/src/assets/wise5/vle/vle-parent/vle-parent.component.ts b/src/assets/wise5/vle/vle-parent/vle-parent.component.ts
index 13eb1f4a982..d851b22d4d2 100644
--- a/src/assets/wise5/vle/vle-parent/vle-parent.component.ts
+++ b/src/assets/wise5/vle/vle-parent/vle-parent.component.ts
@@ -5,7 +5,6 @@ import { StudentDataService } from '../../services/studentDataService';
import { VLEProjectService } from '../vleProjectService';
@Component({
- selector: 'vle-parent',
templateUrl: './vle-parent.component.html'
})
export class VLEParentComponent implements OnInit {
diff --git a/src/assets/wise5/vle/vle.component.html b/src/assets/wise5/vle/vle.component.html
index c4505e182e7..cba3fda1847 100644
--- a/src/assets/wise5/vle/vle.component.html
+++ b/src/assets/wise5/vle/vle.component.html
@@ -1,37 +1,47 @@
-
-
-
-
-
-
-
- @if (reportEnabled) {
-
- }
-
-
-
+@if (initialized) {
+
+
+
+
+
+
+
+ @if (reportEnabled) {
+
+ }
+ @if (notesEnabled && !notesVisible) {
+
+ }
+
+
+}
-
+ @if (runEndedAndLocked) {
+
+ }
@if (layoutState === 'node') {
}
diff --git a/src/assets/wise5/vle/vle.component.spec.ts b/src/assets/wise5/vle/vle.component.spec.ts
index 61feb49aa3b..fb6d7197d61 100644
--- a/src/assets/wise5/vle/vle.component.spec.ts
+++ b/src/assets/wise5/vle/vle.component.spec.ts
@@ -1,33 +1,14 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { MatDialogModule } from '@angular/material/dialog';
import { ConfigService } from '../services/configService';
import { NotebookService } from '../services/notebookService';
import { VLEProjectService } from './vleProjectService';
import { VLEComponent } from './vle.component';
import { StudentDataService } from '../services/studentDataService';
-import { provideHttpClientTesting } from '@angular/common/http/testing';
-import { MatSidenavModule } from '@angular/material/sidenav';
-import { TopBarComponent } from '../../../app/student/top-bar/top-bar.component';
-import { NodeComponent } from './node/node.component';
-import { NotebookNotesComponent } from '../../../app/notebook/notebook-notes/notebook-notes.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
-import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
-import { MatIconModule } from '@angular/material/icon';
-import { MatDividerModule } from '@angular/material/divider';
-import { MatToolbarModule } from '@angular/material/toolbar';
-import { MatMenuModule } from '@angular/material/menu';
-import { MatBadgeModule } from '@angular/material/badge';
-import { NavigationComponent } from '../themes/default/navigation/navigation.component';
-import { StepToolsComponent } from '../themes/default/themeComponents/stepTools/step-tools.component';
-import { MatSelectModule } from '@angular/material/select';
-import { NodeStatusIconComponent } from '../themes/default/themeComponents/nodeStatusIcon/node-status-icon.component';
-import { NodeIconComponent } from './node-icon/node-icon.component';
-import { FormsModule } from '@angular/forms';
import { InitializeVLEService } from '../services/initializeVLEService';
import { StudentTeacherCommonServicesModule } from '../../../app/student-teacher-common-services.module';
import { PauseScreenService } from '../services/pauseScreenService';
import { StudentNotificationService } from '../services/studentNotificationService';
-import { SafeUrl } from '../../../assets/wise5/directives/safeUrl/safe-url.pipe';
import { provideRouter } from '@angular/router';
import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
@@ -39,36 +20,14 @@ let saveVLEEventSpy: jasmine.Spy;
describe('VLEComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
- declarations: [SafeUrl, VLEComponent],
- imports: [
- BrowserAnimationsModule,
- FormsModule,
- MatBadgeModule,
- MatDialogModule,
- MatDividerModule,
- MatIconModule,
- MatMenuModule,
- MatProgressSpinnerModule,
- MatToolbarModule,
- MatSelectModule,
- MatSidenavModule,
- NavigationComponent,
- NodeComponent,
- NodeIconComponent,
- NodeStatusIconComponent,
- NotebookNotesComponent,
- StepToolsComponent,
- StudentTeacherCommonServicesModule,
- TopBarComponent
- ],
+ imports: [BrowserAnimationsModule, VLEComponent, StudentTeacherCommonServicesModule],
providers: [
InitializeVLEService,
PauseScreenService,
provideRouter([]),
StudentNotificationService,
VLEProjectService,
- provideHttpClient(withInterceptorsFromDi()),
- provideHttpClientTesting()
+ provideHttpClient(withInterceptorsFromDi())
]
}).compileComponents();
});
diff --git a/src/assets/wise5/vle/vle.component.ts b/src/assets/wise5/vle/vle.component.ts
index 6ab4638d3e9..b5c13227819 100644
--- a/src/assets/wise5/vle/vle.component.ts
+++ b/src/assets/wise5/vle/vle.component.ts
@@ -16,31 +16,58 @@ import { convertToPNGFile } from '../common/canvas/canvas';
import { NodeStatusService } from '../services/nodeStatusService';
import { Node } from '../common/Node';
import { SafeResourceUrl } from '@angular/platform-browser';
+import { CommonModule } from '@angular/common';
+import { NotebookNotesComponent } from '../../../app/notebook/notebook-notes/notebook-notes.component';
+import { MatSidenavModule } from '@angular/material/sidenav';
+import { SafeUrl } from '../directives/safeUrl/safe-url.pipe';
+import { NodeNavigationComponent } from '../directives/node-navigation/node-navigation.component';
+import { GroupTabsComponent } from '../directives/group-tabs/group-tabs.component';
+import { TopBarComponent } from '../../../app/student/top-bar/top-bar.component';
+import { NotebookReportComponent } from '../../../app/notebook/notebook-report/notebook-report.component';
+import { NotebookLauncherComponent } from '../../../app/notebook/notebook-launcher/notebook-launcher.component';
+import { StepToolsComponent } from '../themes/default/themeComponents/stepTools/step-tools.component';
+import { RunEndedAndLockedMessageComponent } from './run-ended-and-locked-message/run-ended-and-locked-message.component';
+import { NodeComponent } from './node/node.component';
+import { NavigationComponent } from '../themes/default/navigation/navigation.component';
@Component({
+ imports: [
+ CommonModule,
+ GroupTabsComponent,
+ MatSidenavModule,
+ NavigationComponent,
+ NodeComponent,
+ NodeNavigationComponent,
+ NotebookLauncherComponent,
+ NotebookNotesComponent,
+ NotebookReportComponent,
+ RunEndedAndLockedMessageComponent,
+ SafeUrl,
+ StepToolsComponent,
+ TopBarComponent
+ ],
selector: 'vle',
- templateUrl: './vle.component.html',
- styleUrls: ['./vle.component.scss']
+ standalone: true,
+ styleUrl: './vle.component.scss',
+ templateUrl: './vle.component.html'
})
export class VLEComponent implements AfterViewInit {
+ protected currentNode: Node;
@ViewChild('defaultVLETemplate') private defaultVLETemplate: TemplateRef
;
@ViewChild('drawer') public drawer: any;
+ protected initialized: boolean;
+ protected layoutState: string;
+ protected notebookConfig: any;
+ protected notesEnabled: boolean = false;
+ protected notesVisible: boolean = false;
+ protected project: any;
+ protected projectStylePath: SafeResourceUrl;
+ protected reportEnabled: boolean = false;
+ protected reportFullscreen: boolean = false;
+ protected runEndedAndLocked: boolean;
+ private subscriptions: Subscription = new Subscription();
@ViewChild('tabbedVLETemplate') private tabbedVLETemplate: TemplateRef;
-
- currentNode: Node;
- initialized: boolean;
- layoutState: string;
- notebookConfig: any;
- notesEnabled: boolean = false;
- notesVisible: boolean = false;
- project: any;
- projectStylePath: SafeResourceUrl;
- reportEnabled: boolean = false;
- reportFullscreen: boolean = false;
- rootNode: any;
- runEndedAndLocked: boolean;
- subscriptions: Subscription = new Subscription();
- vleTemplate: TemplateRef;
+ protected vleTemplate: TemplateRef;
constructor(
private annotationService: AnnotationService,
@@ -73,7 +100,7 @@ export class VLEComponent implements AfterViewInit {
this.wiseLinkService.addWiseLinkClickedListener();
}
- initRestOfVLE() {
+ private initRestOfVLE(): void {
this.setProject();
this.vleTemplate =
this.projectService.project.theme === 'tab'
@@ -122,7 +149,6 @@ export class VLEComponent implements AfterViewInit {
private setProject(): void {
this.project = this.projectService.getProject();
- this.rootNode = this.projectService.rootNode;
this.setCurrentNode();
}
diff --git a/src/messages.xlf b/src/messages.xlf
index b957a6476f6..b32b84afb6f 100644
--- a/src/messages.xlf
+++ b/src/messages.xlf
@@ -10026,7 +10026,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.
src/assets/wise5/vle/vle.component.ts
- 168
+ 194
@@ -10041,7 +10041,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.
src/assets/wise5/vle/vle.component.ts
- 169
+ 195