diff --git a/src/app/components/creator/_dialogs/comment-settings/comment-settings.component.html b/src/app/components/creator/_dialogs/comment-settings/comment-settings.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..5c2a3417afd2160b7cb16198882431f425ecf024
--- /dev/null
+++ b/src/app/components/creator/_dialogs/comment-settings/comment-settings.component.html
@@ -0,0 +1,31 @@
+<div mat-dialog-content>
+ <h2>{{'room-page.comments' | translate }}</h2>
+ <mat-divider></mat-divider>
+ <div fxLayout="column">
+ <div fxLayout="row">
+ <h3>{{ 'room-page.threshold' | translate}}</h3>
+ <h3>{{commentThreshold | number}}</h3>
+ </div>
+ <mat-slider id="commentSlider" min="-50" max="50" step="1" value="0"
+ [(ngModel)]="commentThreshold" (input)="onSliderChange($event)"></mat-slider>
+ </div>
+ <div fxLayoutAlign="center center">
+ <button mat-raised-button class="export" (click)="openExportDialog()">
+ <mat-icon>cloud_download</mat-icon>
+ {{ 'room-page.export-comments' | translate }}</button>
+ </div>
+ <div fxLayoutAlign="center center">
+ <button mat-raised-button class="delete" (click)="openDeleteCommentDialog()">
+ <mat-icon>delete</mat-icon>
+ {{ 'room-page.delete-all-comments' | translate }}</button>
+ </div>
+ <mat-divider></mat-divider>
+ <div fxLayout="row" fxLayoutAlign="center" fxLayoutGap="10px" class="submit">
+ <button mat-raised-button class="abort" (click)="dialogRef.close('abort')">
+ {{ 'room-page.abort' | translate }}
+ </button>
+ <button mat-raised-button class="update" (click)="dialogRef.close(commentThreshold)">
+ {{ 'room-page.update' | translate }}
+ </button>
+ </div>
+</div>
diff --git a/src/app/components/creator/_dialogs/comment-settings/comment-settings.component.scss b/src/app/components/creator/_dialogs/comment-settings/comment-settings.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..56ae467a5561251e38778a1ad97acacacb0c3472
--- /dev/null
+++ b/src/app/components/creator/_dialogs/comment-settings/comment-settings.component.scss
@@ -0,0 +1,53 @@
+#commentSlider {
+ width: 100%;
+}
+
+.delete {
+ margin-bottom: 20px;
+ min-width: 220px;
+ background-color: var(--red);
+ color: var(--on-secondary);
+}
+
+.export {
+ margin-bottom: 20px;
+ min-width: 220px;
+ background-color: var(--secondary);
+ color: var(--on-secondary);
+}
+
+button {
+ min-width: 105px;
+}
+
+mat-icon {
+ margin-right: 10px;
+}
+
+h2 {
+ margin: 10px 0 10px 0;
+ color: var(--on-surface);
+}
+
+h3 {
+ color: var(--on-surface);
+}
+
+mat-divider {
+ margin-bottom: 10px;
+ color: var(--on-surface) !important;
+}
+
+.abort {
+ background-color: var(--secondary);
+ color: var(--on-secondary);
+}
+
+.update {
+ background-color: var(--primary);
+ color: var(--on-primary);
+}
+
+.submit {
+ margin-top: 20px;
+}
diff --git a/src/app/components/creator/_dialogs/comment-settings/comment-settings.component.spec.ts b/src/app/components/creator/_dialogs/comment-settings/comment-settings.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..d48093531f53d82948fc81cab5dec06dc91bfba4
--- /dev/null
+++ b/src/app/components/creator/_dialogs/comment-settings/comment-settings.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CommentSettingsComponent } from './comment-settings.component';
+
+describe('CommentSettingsComponent', () => {
+ let component: CommentSettingsComponent;
+ let fixture: ComponentFixture<CommentSettingsComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ CommentSettingsComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(CommentSettingsComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/components/creator/_dialogs/comment-settings/comment-settings.component.ts b/src/app/components/creator/_dialogs/comment-settings/comment-settings.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..28e87e332d36ece5a14abb051e0d6f27edf58384
--- /dev/null
+++ b/src/app/components/creator/_dialogs/comment-settings/comment-settings.component.ts
@@ -0,0 +1,110 @@
+import { Component, Inject, OnInit } from '@angular/core';
+import { Comment } from '../../../../models/comment';
+import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from '@angular/material';
+import { RoomCreatorPageComponent } from '../../room-creator-page/room-creator-page.component';
+import { NotificationService } from '../../../../services/util/notification.service';
+import { TranslateService } from '@ngx-translate/core';
+import { RoomService } from '../../../../services/http/room.service';
+import { Router } from '@angular/router';
+import { CommentService } from '../../../../services/http/comment.service';
+import { EventService } from '../../../../services/util/event.service';
+import { DeleteCommentComponent } from '../delete-comment/delete-comment.component';
+import { CommentExportComponent } from '../comment-export/comment-export.component';
+
+@Component({
+ selector: 'app-comment-settings',
+ templateUrl: './comment-settings.component.html',
+ styleUrls: ['./comment-settings.component.scss']
+})
+export class CommentSettingsComponent implements OnInit {
+
+ roomId: string;
+ comments: Comment[];
+ commentThreshold: number;
+
+ constructor(public dialogRef: MatDialogRef<RoomCreatorPageComponent>,
+ public dialog: MatDialog,
+ public notificationService: NotificationService,
+ public translationService: TranslateService,
+ protected roomService: RoomService,
+ public router: Router,
+ public commentService: CommentService,
+ public eventService: EventService,
+ @Inject(MAT_DIALOG_DATA) public data: any) {
+ }
+
+ ngOnInit() {
+ }
+
+ onSliderChange(event: any) {
+ if (event.value) {
+ this.commentThreshold = event.value;
+ } else {
+ this.commentThreshold = 0;
+ }
+ }
+
+
+ openDeleteCommentDialog(): void {
+ const dialogRef = this.dialog.open(DeleteCommentComponent, {
+ width: '400px'
+ });
+ dialogRef.afterClosed()
+ .subscribe(result => {
+ if (result === 'delete') {
+ this.deleteComments();
+ }
+ });
+ }
+
+ deleteComments(): void {
+ this.translationService.get('room-page.comments-deleted').subscribe(msg => {
+ this.notificationService.show(msg);
+ });
+ this.commentService.deleteCommentsByRoomId(this.roomId).subscribe();
+ }
+
+ exportCsv(delimiter: string, date: string): void {
+ this.commentService.getComments(this.roomId)
+ .subscribe(comments => {
+ this.comments = comments;
+ const exportComments = JSON.parse(JSON.stringify(this.comments));
+ let csv: string;
+ let keyFields = '';
+ let valueFields = '';
+ keyFields = Object.keys(exportComments[0]).slice(3).join(delimiter) + '\r\n';
+ exportComments.forEach(element => {
+ element.body = '"' + element.body.replace(/[\r\n]/g, ' ').replace(/ +/g, ' ').replace(/"/g, '""') + '"';
+ valueFields += Object.values(element).slice(3).join(delimiter) + '\r\n';
+ });
+ csv = keyFields + valueFields;
+ const myBlob = new Blob([csv], { type: 'text/csv' });
+ const link = document.createElement('a');
+ const fileName = 'comments_' + date + '.csv';
+ link.setAttribute('download', fileName);
+ link.href = window.URL.createObjectURL(myBlob);
+ link.click();
+ });
+ }
+
+ onExport(exportType: string): void {
+ const date = new Date();
+ const dateString = date.getFullYear() + '_' + ('0' + (date.getMonth() + 1)).slice(-2) + '_' + ('0' + date.getDate()).slice(-2);
+ const timeString = ('0' + date.getHours()).slice(-2) + ('0' + date.getMinutes()).slice(-2) + ('0' + date.getSeconds()).slice(-2);
+ const timestamp = dateString + '_' + timeString;
+ if (exportType === 'comma') {
+ this.exportCsv(',', timestamp);
+ } else if (exportType === 'semicolon') {
+ this.exportCsv(';', timestamp);
+ }
+ }
+
+ openExportDialog(): void {
+ const dialogRef = this.dialog.open(CommentExportComponent, {
+ width: '400px'
+ });
+ dialogRef.afterClosed().subscribe(result => {
+ this.onExport(result);
+ });
+ }
+}
diff --git a/src/app/components/creator/_dialogs/room-edit/room-edit.component.html b/src/app/components/creator/_dialogs/room-edit/room-edit.component.html
index ee3ab788b23f1a1fc80bfbf131b6f2c620763905..a6333a30f0d5deac4fb3836701e0c85e674cb86d 100644
--- a/src/app/components/creator/_dialogs/room-edit/room-edit.component.html
+++ b/src/app/components/creator/_dialogs/room-edit/room-edit.component.html
@@ -18,32 +18,12 @@
{{ 'room-page.delete-room' | translate }}</button>
</div>
</div>
- <h2>{{'room-page.comments' | translate }}</h2>
- <mat-divider></mat-divider>
- <div fxLayout="column">
- <div fxLayout="row">
- <h3>{{ 'room-page.threshold' | translate}}</h3>
- <h3>{{commentThreshold | number}}</h3>
- </div>
- <mat-slider id="commentSlider" min="-50" max="50" step="1" value="0"
- [(ngModel)]="commentThreshold" (input)="onSliderChange($event)"></mat-slider>
- </div>
- <div fxLayoutAlign="center center">
- <button mat-raised-button class="export" (click)="openExportDialog()">
- <mat-icon>cloud_download</mat-icon>
- {{ 'room-page.export-comments' | translate }}</button>
- </div>
- <div fxLayoutAlign="center center">
- <button mat-raised-button class="delete" (click)="openDeleteCommentDialog()">
- <mat-icon>delete</mat-icon>
- {{ 'room-page.delete-all-comments' | translate }}</button>
- </div>
<mat-divider></mat-divider>
<div fxLayout="row" fxLayoutAlign="center" fxLayoutGap="10px" class="submit">
<button mat-raised-button class="abort" (click)="dialogRef.close('abort')">
{{ 'room-page.abort' | translate }}
</button>
- <button mat-raised-button class="update" (click)="dialogRef.close(commentThreshold)">
+ <button mat-raised-button class="update" (click)="dialogRef.close('update')">
{{ 'room-page.update' | translate }}
</button>
</div>
diff --git a/src/app/components/creator/_dialogs/room-edit/room-edit.component.ts b/src/app/components/creator/_dialogs/room-edit/room-edit.component.ts
index 79effb7083aa1aa5b692d695d748f2be6d3030ef..acf1a86edfb391e813c3de0506cc5109982dc3e5 100644
--- a/src/app/components/creator/_dialogs/room-edit/room-edit.component.ts
+++ b/src/app/components/creator/_dialogs/room-edit/room-edit.component.ts
@@ -7,10 +7,8 @@ import { TranslateService } from '@ngx-translate/core';
import { RoomService } from '../../../../services/http/room.service';
import { Router } from '@angular/router';
import { RoomCreatorPageComponent } from '../../room-creator-page/room-creator-page.component';
-import { DeleteCommentComponent } from '../delete-comment/delete-comment.component';
import { CommentService } from '../../../../services/http/comment.service';
import { EventService } from '../../../../services/util/event.service';
-import { CommentExportComponent } from '../comment-export/comment-export.component';
import { Comment } from '../../../../models/comment';
import { RoomDeleted } from '../../../../models/messages/room-deleted';
@@ -21,8 +19,6 @@ import { RoomDeleted } from '../../../../models/messages/room-deleted';
})
export class RoomEditComponent implements OnInit {
editRoom: Room;
- comments: Comment[];
- commentThreshold: number;
constructor(public dialogRef: MatDialogRef<RoomCreatorPageComponent>,
public dialog: MatDialog,
@@ -30,29 +26,11 @@ export class RoomEditComponent implements OnInit {
public translationService: TranslateService,
protected roomService: RoomService,
public router: Router,
- public commentService: CommentService,
public eventService: EventService,
@Inject(MAT_DIALOG_DATA) public data: any) {
}
ngOnInit() {
- if (
- this.editRoom.extensions &&
- this.editRoom.extensions['comments'] &&
- this.editRoom.extensions['comments'].commentThreshold != null
- ) {
- this.commentThreshold = this.editRoom.extensions['comments'].commentThreshold;
- } else {
- this.commentThreshold = -10;
- }
- }
-
- onSliderChange(event: any) {
- if (event.value) {
- this.commentThreshold = event.value;
- } else {
- this.commentThreshold = 0;
- }
}
openDeleteRoomDialog(): void {
@@ -79,67 +57,4 @@ export class RoomEditComponent implements OnInit {
this.dialogRef.close('delete');
this.router.navigate([`/creator`]);
}
-
- openDeleteCommentDialog(): void {
- const dialogRef = this.dialog.open(DeleteCommentComponent, {
- width: '400px'
- });
- dialogRef.afterClosed()
- .subscribe(result => {
- if (result === 'delete') {
- this.deleteComments();
- }
- });
- }
-
- deleteComments(): void {
- this.translationService.get('room-page.comments-deleted').subscribe(msg => {
- this.notificationService.show(msg);
- });
- this.commentService.deleteCommentsByRoomId(this.editRoom.id).subscribe();
- }
-
- exportCsv(delimiter: string, date: string): void {
- this.commentService.getComments(this.editRoom.id)
- .subscribe(comments => {
- this.comments = comments;
- const exportComments = JSON.parse(JSON.stringify(this.comments));
- let csv: string;
- let keyFields = '';
- let valueFields = '';
- keyFields = Object.keys(exportComments[0]).slice(3).join(delimiter) + '\r\n';
- exportComments.forEach(element => {
- element.body = '"' + element.body.replace(/[\r\n]/g, ' ').replace(/ +/g, ' ').replace(/"/g, '""') + '"';
- valueFields += Object.values(element).slice(3).join(delimiter) + '\r\n';
- });
- csv = keyFields + valueFields;
- const myBlob = new Blob([csv], { type: 'text/csv' });
- const link = document.createElement('a');
- const fileName = 'comments_' + date + '.csv';
- link.setAttribute('download', fileName);
- link.href = window.URL.createObjectURL(myBlob);
- link.click();
- });
- }
-
- onExport(exportType: string): void {
- const date = new Date();
- const dateString = date.getFullYear() + '_' + ('0' + (date.getMonth() + 1)).slice(-2) + '_' + ('0' + date.getDate()).slice(-2);
- const timeString = ('0' + date.getHours()).slice(-2) + ('0' + date.getMinutes()).slice(-2) + ('0' + date.getSeconds()).slice(-2);
- const timestamp = dateString + '_' + timeString;
- if (exportType === 'comma') {
- this.exportCsv(',', timestamp);
- } else if (exportType === 'semicolon') {
- this.exportCsv(';', timestamp);
- }
- }
-
- openExportDialog(): void {
- const dialogRef = this.dialog.open(CommentExportComponent, {
- width: '400px'
- });
- dialogRef.afterClosed().subscribe(result => {
- this.onExport(result);
- });
- }
}
diff --git a/src/app/components/creator/creator.module.ts b/src/app/components/creator/creator.module.ts
index f7296a626e7a8cecb3b2daeb76ee233a6253ed37..d1e478d5108bd025036693481782ba01b605f5f4 100644
--- a/src/app/components/creator/creator.module.ts
+++ b/src/app/components/creator/creator.module.ts
@@ -23,6 +23,7 @@ import { ContentEditComponent } from './_dialogs/content-edit/content-edit.compo
import { ContentPresentationComponent } from './content-presentation/content-presentation.component';
import { CommentExportComponent } from './_dialogs/comment-export/comment-export.component';
import { ModeratorsComponent } from './_dialogs/moderators/moderators.component';
+import { CommentSettingsComponent } from './_dialogs/comment-settings/comment-settings.component';
@NgModule({
imports: [
@@ -54,7 +55,8 @@ import { ModeratorsComponent } from './_dialogs/moderators/moderators.component'
ContentEditComponent,
ContentPresentationComponent,
CommentExportComponent,
- ModeratorsComponent
+ ModeratorsComponent,
+ CommentSettingsComponent
],
entryComponents: [
RoomDeleteComponent,
@@ -67,7 +69,8 @@ import { ModeratorsComponent } from './_dialogs/moderators/moderators.component'
ContentYesNoCreatorComponent,
ContentEditComponent,
CommentExportComponent,
- ModeratorsComponent
+ ModeratorsComponent,
+ CommentSettingsComponent
]
})
export class CreatorModule {
diff --git a/src/app/components/creator/room-creator-page/room-creator-page.component.html b/src/app/components/creator/room-creator-page/room-creator-page.component.html
index e0deb0d29e64ebff65678e5070a45214a51c25b0..0fc73e526043bf617c82487c04e6e1af3443ed9a 100644
--- a/src/app/components/creator/room-creator-page/room-creator-page.component.html
+++ b/src/app/components/creator/room-creator-page/room-creator-page.component.html
@@ -20,7 +20,7 @@
<mat-icon>build</mat-icon>
{{ 'room-page.general' | translate}}
</button>
- <button mat-menu-item>
+ <button mat-menu-item (click)="showCommentsDialog()">
<mat-icon>insert_comment</mat-icon>
{{ 'room-page.comments' | translate}}
</button>
diff --git a/src/app/components/creator/room-creator-page/room-creator-page.component.ts b/src/app/components/creator/room-creator-page/room-creator-page.component.ts
index 71520a738f1baa319103052af959f5a80e7e1239..6ed24db46ebbb553e50bd01318fd1c73c6029012 100644
--- a/src/app/components/creator/room-creator-page/room-creator-page.component.ts
+++ b/src/app/components/creator/room-creator-page/room-creator-page.component.ts
@@ -13,6 +13,7 @@ import { TSMap } from 'typescript-map';
import { WsCommentServiceService } from '../../../services/websockets/ws-comment-service.service';
import { CommentService } from '../../../services/http/comment.service';
import { ModeratorsComponent } from '../_dialogs/moderators/moderators.component';
+import { CommentSettingsComponent } from '../_dialogs/comment-settings/comment-settings.component';
@Component({
selector: 'app-room-creator-page',
@@ -47,15 +48,23 @@ export class RoomCreatorPageComponent extends RoomPageComponent implements OnIni
});
}
- updateRoom(threshold: number): void {
+ updateGeneralSettings() {
this.room.name = this.updRoom.name;
this.room.description = this.updRoom.description;
+ this.saveChanges();
+ }
+
+ updateCommentSettings(threshold: number) {
if (threshold > -50) {
const commentExtension: TSMap<string, any> = new TSMap();
commentExtension.set('commentThreshold', threshold);
this.room.extensions = new TSMap();
this.room.extensions.set('comments', commentExtension);
}
+ this.saveChanges();
+ }
+
+ saveChanges() {
this.roomService.updateRoom(this.room)
.subscribe(() => {
this.translateService.get('room-page.changes-successful').subscribe(msg => {
@@ -70,13 +79,12 @@ export class RoomCreatorPageComponent extends RoomPageComponent implements OnIni
width: '400px'
});
dialogRef.componentInstance.editRoom = this.updRoom;
- dialogRef.componentInstance.commentThreshold = this.updCommentThreshold;
dialogRef.afterClosed()
.subscribe(result => {
if (result === 'abort') {
return;
} else if (result !== 'delete') {
- this.updateRoom(+result);
+ this.updateGeneralSettings();
}
});
dialogRef.backdropClick().subscribe( res => {
@@ -84,6 +92,25 @@ export class RoomCreatorPageComponent extends RoomPageComponent implements OnIni
});
}
+ showCommentsDialog(): void {
+ const dialogRef = this.dialog.open(CommentSettingsComponent, {
+ width: '400px'
+ });
+ dialogRef.componentInstance.roomId = this.room.id;
+ dialogRef.componentInstance.commentThreshold = this.updCommentThreshold;
+ dialogRef.afterClosed()
+ .subscribe(result => {
+ if (result === 'abort') {
+ return;
+ } else if (result !== 'delete') {
+ this.updateCommentSettings(+result);
+ }
+ });
+ dialogRef.backdropClick().subscribe( res => {
+ dialogRef.close('abort');
+ });
+ }
+
showModeratorsDialog(): void {
const dialogRef = this.dialog.open(ModeratorsComponent, {
width: '400px'