Merge pull request #2823 from WISE-Community/issue-2822-upgrade-unit-rubric-authoring-to-angular

Upgraded unit rubric authoring to angular

Author: geoffreykwan

src/main/webapp/site/src/app/teacher-hybrid-angular.module.ts

@@ -28,6 +28,7 @@ import { NodeAdvancedJsonAuthoringComponent } from '../../../wise5/authoringTool
 import { WorkgroupInfoComponent } from '../../../wise5/classroomMonitor/classroomMonitorComponents/nodeGrading/workgroupInfo/workgroup-info.component';
 import { NodeAdvancedGeneralAuthoringComponent } from '../../../wise5/authoringTool/node/advanced/general/node-advanced-general-authoring.component';
 import { WiseAuthoringTinymceEditorComponent } from '../../../wise5/directives/wise-tinymce-editor/wise-authoring-tinymce-editor.component';
+import { RubricAuthoringComponent } from '../../../wise5/authoringTool/rubric/rubric-authoring.component';
 
 @NgModule({
   declarations: [
@@ -41,6 +42,7 @@ import { WiseAuthoringTinymceEditorComponent } from '../../../wise5/directives/w
     MilestoneReportDataComponent,
     NodeAdvancedGeneralAuthoringComponent,
     NodeAdvancedJsonAuthoringComponent,
+    RubricAuthoringComponent,
     StatusIconComponent,
     WorkgroupInfoComponent,
     WorkgroupNodeScoreComponent,

src/main/webapp/site/src/messages.xlf

@@ -5782,6 +5782,10 @@
           <context context-type="sourcefile">../../wise5/authoringTool/advanced/advanced-project-authoring.component.html</context>
           <context context-type="linenumber">4</context>
         </context-group>
+        <context-group purpose="location">
+          <context context-type="sourcefile">../../wise5/authoringTool/rubric/rubric-authoring.component.html</context>
+          <context context-type="linenumber">2</context>
+        </context-group>
       </trans-unit>
       <trans-unit datatype="html" id="077fb7924ecebe2ae768d860909315c29ee61fbe">
         <source>Show JSON</source>
@@ -5981,6 +5985,13 @@
           <context context-type="linenumber">2</context>
         </context-group>
       </trans-unit>
+      <trans-unit datatype="html" id="92328333ea9c72926ca7c631e9e1c0f081cbf565">
+        <source>Edit Unit Rubric</source>
+        <context-group purpose="location">
+          <context context-type="sourcefile">../../wise5/authoringTool/rubric/rubric-authoring.component.html</context>
+          <context context-type="linenumber">6</context>
+        </context-group>
+      </trans-unit>
       <trans-unit datatype="html" id="f9c52903219e583ddefb23cd102d2057504ac980">
         <source>(Team <x equiv-text="{{workgroupId}}" id="INTERPOLATION"/>)</source>
         <context-group purpose="location">

src/main/webapp/wise5/authoringTool/rubric/rubric-authoring.component.html

@@ -0,0 +1,8 @@
+<button mat-button class='topButton mat-raised-button mat-primary' (click)='goBack()'
+    matTooltip="Back to Unit Plan" i18n-matTooltip matToolTipPosition="above">
+  <mat-icon>arrow_back</mat-icon>
+</button>
+<br/>
+<h5 i18n>Edit Unit Rubric</h5>
+<wise-authoring-tinymce-editor [(model)]='rubric' (modelChange)='rubricChanged()'>
+</wise-authoring-tinymce-editor>

src/main/webapp/wise5/authoringTool/rubric/rubric-authoring.component.ts

@@ -0,0 +1,32 @@
+import { ConfigService } from '../../services/configService';
+import { UtilService } from '../../services/utilService';
+import { TeacherProjectService } from '../../services/teacherProjectService';
+import { UpgradeModule } from '@angular/upgrade/static';
+import { Component } from '@angular/core';
+
+@Component({
+  templateUrl: 'rubric-authoring.component.html',
+})
+export class RubricAuthoringComponent {
+
+  rubric: string = '';
+
+  constructor(private upgrade: UpgradeModule, private ConfigService: ConfigService,
+    private ProjectService: TeacherProjectService, private UtilService: UtilService) {
+  }
+
+  ngOnInit(): void {
+    this.rubric = this.ProjectService.replaceAssetPaths(this.ProjectService.getProjectRubric());
+  }
+
+  rubricChanged(): void {
+    const html = this.UtilService.insertWISELinks(
+      this.ConfigService.removeAbsoluteAssetPaths(this.rubric));
+    this.ProjectService.setProjectRubric(html);
+    this.ProjectService.saveProject();
+  }
+
+  goBack(): void {
+    this.upgrade.$injector.get('$state').go('root.at.project');
+  }
+}

src/main/webapp/wise5/authoringTool/rubric/rubricAuthoring.html

@@ -30,7 +30,7 @@ import NotebookGradingController from '../classroomMonitor/notebook/notebookGrad
 import ProjectAssetController from '../authoringTool/asset/projectAssetController';
 import ProjectController from '../authoringTool/project/projectController';
 import ProjectInfoController from '../authoringTool/info/projectInfoController';
-import RubricAuthoringController from '../authoringTool/rubric/rubricAuthoringController';
+import { RubricAuthoringComponent } from '../authoringTool/rubric/rubric-authoring.component';
 import StudentGradingController from '../classroomMonitor/studentGrading/studentGradingController';
 import StudentProgressController from '../classroomMonitor/studentProgress/studentProgressController';
 import WISELinkAuthoringController from '../authoringTool/wiseLink/wiseLinkAuthoringController';
@@ -121,7 +121,8 @@ import '../components/table/tableAuthoringComponentModule';
     .controller('ProjectAssetController', ProjectAssetController)
     .controller('ProjectController', ProjectController)
     .controller('ProjectInfoController', ProjectInfoController)
-    .controller('RubricAuthoringController', RubricAuthoringController)
+    .directive('rubricAuthoringComponent', downgradeComponent(
+        { component: RubricAuthoringComponent }) as angular.IDirectiveFactory)
     .controller('StudentGradingController', StudentGradingController)
     .controller('StudentProgressController', StudentProgressController)
     .controller('WISELinkAuthoringController', WISELinkAuthoringController)
@@ -264,9 +265,7 @@ import '../components/table/tableAuthoringComponentModule';
         })
         .state('root.at.project.rubric', {
           url: '/rubric',
-          templateUrl: '/wise5/authoringTool/rubric/rubricAuthoring.html',
-          controller: 'RubricAuthoringController',
-          controllerAs: 'rubricAuthoringController'
+          component: 'rubricAuthoringComponent'
         })
         .state('root.at.project.notebook', {
           url: '/notebook',