Skip to content

Commit 520cdfb

Browse files
geoffreykwangeoffreykwan
authored
Merge pull request #2831 from WISE-Community/issue-2830-extract-advanced-component-authoring-width-max-score-tags
Extracted and upgraded advanced component authoring: width, max-score, tags
2 parents e3bb525 + c4231a5 commit 520cdfb

26 files changed

Lines changed: 338 additions & 897 deletions

File tree

‎src/main/webapp/site/src/app/authoring-tool/edit-component-json/edit-component-json.component.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
<span i18n>Close the JSON view to save the changes</span>
1111
<mat-form-field fxFlex appearance="outline">
1212
<mat-label i18n>Edit Component JSON</mat-label>
13-
<textarea class="mat-body-1" matInput cdkTextareaAutosize [(ngModel)]="componentContentJSONString"
13+
<textarea class="mat-body-1" matInput cdkTextareaAutosize [(ngModel)]="componentContentJSONString"
1414
(ngModelChange)='jsonChanged.next($event)'></textarea>
1515
</mat-form-field>
1616
</div>

‎src/main/webapp/site/src/app/authoring-tool/edit-component-max-score/edit-component-max-score.component.html‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<mat-form-field>
2+
<mat-label i18n>Max Score</mat-label>
3+
<input matInput
4+
type='number'
5+
[(ngModel)]='authoringComponentContent.maxScore'
6+
(ngModelChange)='maxScoreChanged.next($event)'/>
7+
</mat-form-field>

‎src/main/webapp/site/src/app/authoring-tool/edit-component-max-score/edit-component-max-score.component.ts‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
import { Component, Input } from "@angular/core";
2+
import { Subject, Subscription } from "rxjs";
3+
import { debounceTime, distinctUntilChanged } from "rxjs/operators";
4+
import { TeacherProjectService } from "../../../../../wise5/services/teacherProjectService";
5+
6+
@Component({
7+
selector: 'edit-component-max-score',
8+
templateUrl: 'edit-component-max-score.component.html'
9+
})
10+
export class EditComponentMaxScoreComponent {
11+
12+
@Input()
13+
authoringComponentContent: any;
14+
maxScoreChanged: Subject<string> = new Subject<string>();
15+
maxScoreChangedSubscription: Subscription;
16+
17+
constructor(private ProjectService: TeacherProjectService) {
18+
}
19+
20+
ngOnInit() {
21+
this.maxScoreChangedSubscription = this.maxScoreChanged
22+
.pipe(
23+
debounceTime(1000),
24+
distinctUntilChanged()
25+
)
26+
.subscribe(() => {
27+
this.ProjectService.componentChanged();
28+
});
29+
}
30+
31+
ngOnDestroy() {
32+
this.maxScoreChangedSubscription.unsubscribe();
33+
}
34+
}

‎src/main/webapp/site/src/app/authoring-tool/edit-component-tags/edit-component-tags.component.html‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
<div fxLayout="row" fxLayoutGap="8px" fxLayoutAlign="start center">
2+
<mat-label class="node__label--vertical-alignment" i18n>Tags</mat-label>
3+
<button mat-button
4+
class="topButton mat-raised-button mat-primary"
5+
matTooltip="Add Tag"
6+
i18n-matTooltip
7+
matTooltipPosition="above"
8+
(click)="addTag()">
9+
<mat-icon>add</mat-icon>
10+
</button>
11+
</div>
12+
<div *ngFor="let tag of authoringComponentContent.tags; let i = index"
13+
fxLayout="row" fxLayoutGap="8px" fxLayoutAlign="start center" style="margin-top: 16px">
14+
<mat-form-field>
15+
<mat-label i18n>Tag Name</mat-label>
16+
<input matInput
17+
[ngModel]="tag"
18+
(ngModelChange)="tagChanged.next({tagIndex: i, tag: $event})"/>
19+
</mat-form-field>
20+
<button mat-button
21+
class="moveComponentButton mat-raised-button mat-primary"
22+
matTooltip="Move Up"
23+
i18n-matTooltip
24+
matTooltipPosition="above"
25+
(click)="moveTagUp(i)">
26+
<mat-icon>arrow_upward</mat-icon>
27+
</button>
28+
<button mat-button
29+
class="moveComponentButton mat-raised-button mat-primary"
30+
matTooltip="Move Down"
31+
i18n-matTooltip
32+
matTooltipPosition="above"
33+
(click)="moveTagDown(i)">
34+
<mat-icon>arrow_downward</mat-icon>
35+
</button>
36+
<button mat-button
37+
class="moveComponentButton mat-raised-button mat-primary"
38+
matTooltip="Delete"
39+
i18n-matTooltip
40+
matTooltipPosition="above"
41+
(click)="deleteTag(i)">
42+
<mat-icon>delete</mat-icon>
43+
</button>
44+
</div>

‎src/main/webapp/site/src/app/authoring-tool/edit-component-tags/edit-component-tags.component.ts‎

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
import { Component, Input } from "@angular/core";
2+
import { UpgradeModule } from "@angular/upgrade/static";
3+
import { Subject, Subscription } from "rxjs";
4+
import { debounceTime, distinctUntilChanged } from "rxjs/operators";
5+
import { TeacherProjectService } from "../../../../../wise5/services/teacherProjectService";
6+
7+
@Component({
8+
selector: 'edit-component-tags',
9+
templateUrl: 'edit-component-tags.component.html'
10+
})
11+
export class EditComponentTagsComponent {
12+
13+
@Input()
14+
authoringComponentContent: any;
15+
tagChanged: Subject<any> = new Subject<any>();
16+
tagChangedSubscription: Subscription;
17+
18+
constructor(private ProjectService: TeacherProjectService, private upgrade: UpgradeModule) {
19+
}
20+
21+
ngOnInit() {
22+
this.tagChangedSubscription = this.tagChanged
23+
.pipe(
24+
debounceTime(1000),
25+
distinctUntilChanged()
26+
)
27+
.subscribe(({tagIndex, tag}) => {
28+
this.authoringComponentContent.tags[tagIndex] = tag;
29+
this.ProjectService.componentChanged();
30+
});
31+
}
32+
33+
ngOnDestroy() {
34+
this.tagChangedSubscription.unsubscribe();
35+
}
36+
37+
addTag() {
38+
if (this.authoringComponentContent.tags == null) {
39+
this.authoringComponentContent.tags = [];
40+
}
41+
this.authoringComponentContent.tags.push('');
42+
this.ProjectService.componentChanged();
43+
}
44+
45+
moveTagUp(index: number) {
46+
if (index > 0) {
47+
const tag = this.authoringComponentContent.tags[index];
48+
this.authoringComponentContent.tags.splice(index, 1);
49+
this.authoringComponentContent.tags.splice(index - 1, 0, tag);
50+
this.ProjectService.componentChanged();
51+
}
52+
}
53+
54+
moveTagDown(index: number) {
55+
if (index < this.authoringComponentContent.tags.length - 1) {
56+
const tag = this.authoringComponentContent.tags[index];
57+
this.authoringComponentContent.tags.splice(index, 1);
58+
this.authoringComponentContent.tags.splice(index + 1, 0, tag);
59+
this.ProjectService.componentChanged();
60+
}
61+
}
62+
63+
deleteTag(indexOfTagToDelete: number) {
64+
if (confirm(
65+
this.upgrade.$injector.get('$filter')('translate')('areYouSureYouWantToDeleteThisTag'))) {
66+
this.authoringComponentContent.tags.splice(indexOfTagToDelete, 1);
67+
this.ProjectService.componentChanged();
68+
}
69+
}
70+
}

‎src/main/webapp/site/src/app/authoring-tool/edit-component-width/edit-component-width.component.html‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<mat-form-field>
2+
<mat-label i18n>Component Width</mat-label>
3+
<input matInput
4+
type='number'
5+
[(ngModel)]='authoringComponentContent.componentWidth'
6+
(ngModelChange)='widthChanged.next($event)'/>
7+
</mat-form-field>

‎src/main/webapp/site/src/app/authoring-tool/edit-component-width/edit-component-width.component.ts‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
import { Component, Input } from "@angular/core";
2+
import { Subject, Subscription } from "rxjs";
3+
import { debounceTime, distinctUntilChanged } from "rxjs/operators";
4+
import { TeacherProjectService } from "../../../../../wise5/services/teacherProjectService";
5+
6+
@Component({
7+
selector: 'edit-component-width',
8+
templateUrl: 'edit-component-width.component.html'
9+
})
10+
export class EditComponentWidthComponent {
11+
12+
@Input()
13+
authoringComponentContent: any;
14+
widthChanged: Subject<string> = new Subject<string>();
15+
widthChangedSubscription: Subscription;
16+
17+
constructor(private ProjectService: TeacherProjectService) {
18+
}
19+
20+
ngOnInit() {
21+
this.widthChangedSubscription = this.widthChanged
22+
.pipe(
23+
debounceTime(1000),
24+
distinctUntilChanged()
25+
)
26+
.subscribe(() => {
27+
this.ProjectService.componentChanged();
28+
});
29+
}
30+
31+
ngOnDestroy() {
32+
this.widthChangedSubscription.unsubscribe();
33+
}
34+
}

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

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,8 +28,11 @@ import { NodeAdvancedJsonAuthoringComponent } from '../../../wise5/authoringTool
2828
import { WorkgroupInfoComponent } from '../../../wise5/classroomMonitor/classroomMonitorComponents/nodeGrading/workgroupInfo/workgroup-info.component';
2929
import { NodeAdvancedGeneralAuthoringComponent } from '../../../wise5/authoringTool/node/advanced/general/node-advanced-general-authoring.component';
3030
import { WiseAuthoringTinymceEditorComponent } from '../../../wise5/directives/wise-tinymce-editor/wise-authoring-tinymce-editor.component';
31-
import { EditComponentRubricComponent } from './authoring-tool/edit-component-rubric/edit-component-rubric.component';
3231
import { EditComponentJsonComponent } from './authoring-tool/edit-component-json/edit-component-json.component';
32+
import { EditComponentMaxScoreComponent } from './authoring-tool/edit-component-max-score/edit-component-max-score.component';
33+
import { EditComponentRubricComponent } from './authoring-tool/edit-component-rubric/edit-component-rubric.component';
34+
import { EditComponentTagsComponent } from './authoring-tool/edit-component-tags/edit-component-tags.component';
35+
import { EditComponentWidthComponent } from './authoring-tool/edit-component-width/edit-component-width.component';
3336
import { RubricAuthoringComponent } from '../../../wise5/authoringTool/rubric/rubric-authoring.component';
3437

3538
@NgModule({
@@ -42,6 +45,9 @@ import { RubricAuthoringComponent } from '../../../wise5/authoringTool/rubric/ru
4245
ComponentNewWorkBadgeComponent,
4346
EditComponentRubricComponent,
4447
EditComponentJsonComponent,
48+
EditComponentMaxScoreComponent,
49+
EditComponentTagsComponent,
50+
EditComponentWidthComponent,
4551
ManageStudentsComponent,
4652
MilestoneReportDataComponent,
4753
NodeAdvancedGeneralAuthoringComponent,

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

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6003,6 +6003,62 @@
60036003
<context context-type="linenumber">12</context>
60046004
</context-group>
60056005
</trans-unit>
6006+
<trans-unit datatype="html" id="2af3e40232b763ae8a6cba9f4bb455ed49d4f86c">
6007+
<source>Max Score</source>
6008+
<context-group purpose="location">
6009+
<context context-type="sourcefile">app/authoring-tool/edit-component-max-score/edit-component-max-score.component.html</context>
6010+
<context context-type="linenumber">2</context>
6011+
</context-group>
6012+
</trans-unit>
6013+
<trans-unit datatype="html" id="cafc87479686947e2590b9f588a88040aeaf660b">
6014+
<source>Tags</source>
6015+
<context-group purpose="location">
6016+
<context context-type="sourcefile">app/authoring-tool/edit-component-tags/edit-component-tags.component.html</context>
6017+
<context context-type="linenumber">2</context>
6018+
</context-group>
6019+
</trans-unit>
6020+
<trans-unit datatype="html" id="d9a6d2f30e57a02a6b36a7773c39a3791c42ae9c">
6021+
<source>Add Tag</source>
6022+
<context-group purpose="location">
6023+
<context context-type="sourcefile">app/authoring-tool/edit-component-tags/edit-component-tags.component.html</context>
6024+
<context context-type="linenumber">5</context>
6025+
</context-group>
6026+
</trans-unit>
6027+
<trans-unit datatype="html" id="f339508e35745934e4cfe06c1f4eb888b0fda212">
6028+
<source>Tag Name</source>
6029+
<context-group purpose="location">
6030+
<context context-type="sourcefile">app/authoring-tool/edit-component-tags/edit-component-tags.component.html</context>
6031+
<context context-type="linenumber">15</context>
6032+
</context-group>
6033+
</trans-unit>
6034+
<trans-unit datatype="html" id="ab36fe6b1ac84106333447d7c1c4e20fb79c7de3">
6035+
<source>Move Up</source>
6036+
<context-group purpose="location">
6037+
<context context-type="sourcefile">app/authoring-tool/edit-component-tags/edit-component-tags.component.html</context>
6038+
<context context-type="linenumber">22</context>
6039+
</context-group>
6040+
</trans-unit>
6041+
<trans-unit datatype="html" id="3a12bd96093f8972cbd9d52a68fb9178aaee4388">
6042+
<source>Move Down</source>
6043+
<context-group purpose="location">
6044+
<context context-type="sourcefile">app/authoring-tool/edit-component-tags/edit-component-tags.component.html</context>
6045+
<context context-type="linenumber">30</context>
6046+
</context-group>
6047+
</trans-unit>
6048+
<trans-unit datatype="html" id="826b25211922a1b46436589233cb6f1a163d89b7">
6049+
<source>Delete</source>
6050+
<context-group purpose="location">
6051+
<context context-type="sourcefile">app/authoring-tool/edit-component-tags/edit-component-tags.component.html</context>
6052+
<context context-type="linenumber">38</context>
6053+
</context-group>
6054+
</trans-unit>
6055+
<trans-unit datatype="html" id="2485299eb70909a6cfa961bfac54f062a220806c">
6056+
<source>Component Width</source>
6057+
<context-group purpose="location">
6058+
<context context-type="sourcefile">app/authoring-tool/edit-component-width/edit-component-width.component.html</context>
6059+
<context context-type="linenumber">2</context>
6060+
</context-group>
6061+
</trans-unit>
60066062
<trans-unit datatype="html" id="bfab7f41cfc32a926c55987d6a9c3349ae417131">
60076063
<source> Show Save Button </source>
60086064
<context-group purpose="location">

‎src/main/webapp/wise5/authoringTool/components/editComponentController.ts‎

Lines changed: 0 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -105,39 +105,6 @@ export abstract class EditComponentController {
105105
});
106106
}
107107

108-
addTag() {
109-
if (this.authoringComponentContent.tags == null) {
110-
this.authoringComponentContent.tags = [];
111-
}
112-
this.authoringComponentContent.tags.push('');
113-
this.authoringViewComponentChanged();
114-
}
115-
116-
moveTagUp(index) {
117-
if (index > 0) {
118-
const tag = this.authoringComponentContent.tags[index];
119-
this.authoringComponentContent.tags.splice(index, 1);
120-
this.authoringComponentContent.tags.splice(index - 1, 0, tag);
121-
this.authoringViewComponentChanged();
122-
}
123-
}
124-
125-
moveTagDown(index) {
126-
if (index < this.authoringComponentContent.tags.length - 1) {
127-
const tag = this.authoringComponentContent.tags[index];
128-
this.authoringComponentContent.tags.splice(index, 1);
129-
this.authoringComponentContent.tags.splice(index + 1, 0, tag);
130-
this.authoringViewComponentChanged();
131-
}
132-
}
133-
134-
deleteTag(indexOfTagToDelete) {
135-
if (confirm(this.$translate('areYouSureYouWantToDeleteThisTag'))) {
136-
this.authoringComponentContent.tags.splice(indexOfTagToDelete, 1);
137-
this.authoringViewComponentChanged();
138-
}
139-
}
140-
141108
connectedComponentTypeChanged(connectedComponent) {
142109
this.authoringViewComponentChanged();
143110
}

0 commit comments

Comments
 (0)