From abc231452db16e80639f1a71c427940ac4d34c1c Mon Sep 17 00:00:00 2001
From: Sebastian Wittek <sebastian.wittek@mni.thm.de>
Date: Tue, 19 Mar 2019 13:46:19 +0100
Subject: [PATCH] outsorce comment
---
.../submit-comment.component.html | 30 +++++++-----
.../submit-comment.component.scss | 11 +++++
.../submit-comment.component.ts | 34 +++++++++++++-
.../comment-page/comment-page.component.html | 17 +------
.../comment-page/comment-page.component.scss | 16 -------
.../comment-page/comment-page.component.ts | 46 ++-----------------
6 files changed, 69 insertions(+), 85 deletions(-)
diff --git a/src/app/components/shared/_dialogs/submit-comment/submit-comment.component.html b/src/app/components/shared/_dialogs/submit-comment/submit-comment.component.html
index bbf1f4914..62e7a2629 100644
--- a/src/app/components/shared/_dialogs/submit-comment/submit-comment.component.html
+++ b/src/app/components/shared/_dialogs/submit-comment/submit-comment.component.html
@@ -1,11 +1,19 @@
-
-<h4>{{comment.subject}}</h4>
-<p>{{comment.body}}</p>
-
-<button mat-raised-button color="warn" (click)="closeDialog('abort')">
- {{ 'comment-page.back' | translate }}
-</button>
-
-<button mat-raised-button color="primary" (click)="closeDialog('send')">
- {{ 'comment-page.send' | translate}}
-</button>
+<div fxLayout="column" fxLayoutAlign="center" fxLayoutGap="20px">
+ <div fxLayout="row" fxLayoutAlign="center">
+ <form>
+ <mat-form-field class="input-block">
+ <input matInput #commentSubject type="text" maxlength="25"
+ placeholder="{{ 'comment-page.enter-title' | translate}}" onkeypress="return event.keyCode !=13;"
+ [formControl]="subjectForm">
+ <mat-hint align="end">{{commentSubject.value.length}} / 25</mat-hint>
+ </mat-form-field>
+ <mat-form-field class="input-block">
+ <textarea matInput #commentBody placeholder="{{ 'comment-page.enter-comment' | translate}}"
+ matAutosizeMinRows=2 matAutosizeMaxRows=5 maxlength="255" [formControl]="bodyForm"></textarea>
+ <mat-hint align="end">{{commentBody.value.length}} / 255</mat-hint>
+ </mat-form-field>
+ <button mat-raised-button color="accent"
+ (click)="closeDialog('send')">{{ 'comment-page.send' | translate}}</button>
+ </form>
+ </div>
+</div>
diff --git a/src/app/components/shared/_dialogs/submit-comment/submit-comment.component.scss b/src/app/components/shared/_dialogs/submit-comment/submit-comment.component.scss
index e9e5eca96..bbbf2f85c 100644
--- a/src/app/components/shared/_dialogs/submit-comment/submit-comment.component.scss
+++ b/src/app/components/shared/_dialogs/submit-comment/submit-comment.component.scss
@@ -2,3 +2,14 @@ button {
margin-right: 20px;
min-width: 80px;
}
+
+form {
+ display: block;
+ width: 100%;
+ max-width: 800px;
+ margin-bottom: 50px;
+}
+
+textarea {
+ line-height: 120%;
+}
diff --git a/src/app/components/shared/_dialogs/submit-comment/submit-comment.component.ts b/src/app/components/shared/_dialogs/submit-comment/submit-comment.component.ts
index 1c6179372..ac1ee967e 100644
--- a/src/app/components/shared/_dialogs/submit-comment/submit-comment.component.ts
+++ b/src/app/components/shared/_dialogs/submit-comment/submit-comment.component.ts
@@ -6,6 +6,7 @@ import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from '@angular/material';
import { TranslateService } from '@ngx-translate/core';
import { CommentPageComponent } from '../../comment-page/comment-page.component';
import { AuthenticationService } from '../../../../services/http/authentication.service';
+import { FormControl, Validators } from '@angular/forms';
@Component({
@@ -16,6 +17,8 @@ import { AuthenticationService } from '../../../../services/http/authentication.
export class SubmitCommentComponent implements OnInit {
comment: Comment;
+ subjectForm = new FormControl('', [Validators.required]);
+ bodyForm = new FormControl('', [Validators.required]);
constructor(private router: Router,
private notification: NotificationService,
@@ -23,6 +26,7 @@ export class SubmitCommentComponent implements OnInit {
private translateService: TranslateService,
protected authenticationService: AuthenticationService,
public dialog: MatDialog,
+ private translationService: TranslateService,
@Inject(MAT_DIALOG_DATA) public data: any) {
}
@@ -34,7 +38,33 @@ export class SubmitCommentComponent implements OnInit {
this.dialogRef.close('abort');
}
- closeDialog(action: string) {
- this.dialogRef.close(action);
+ checkInputData(subject: string, body: string): boolean {
+ subject = subject.trim();
+ body = body.trim();
+ if (!subject && !body) {
+ this.translationService.get('comment-page.error-both-fields').subscribe(message => {
+ this.notification.show(message);
+ });
+ return false;
+ }
+ if (!subject) {
+ this.translationService.get('comment-page.error-title').subscribe(message => {
+ this.notification.show(message);
+ });
+ return false;
+ }
+ if (!body) {
+ this.translationService.get('comment-page.error-comment').subscribe(message => {
+ this.notification.show(message);
+ });
+ return false;
+ }
+ return true;
+ }
+
+ closeDialog(subject: string, body: string) {
+ const comment = new Comment();
+ this.checkInputData(comment.b)
+ this.dialogRef.close(comment);
}
}
diff --git a/src/app/components/shared/comment-page/comment-page.component.html b/src/app/components/shared/comment-page/comment-page.component.html
index e2b40e834..695ecb493 100644
--- a/src/app/components/shared/comment-page/comment-page.component.html
+++ b/src/app/components/shared/comment-page/comment-page.component.html
@@ -1,20 +1,7 @@
<div fxLayout="column" fxLayoutAlign="center" fxLayoutGap="20px">
<div fxLayout="row" fxLayoutAlign="center">
- <form>
- <mat-form-field class="input-block">
- <input matInput #commentSubject type="text" maxlength="25"
- placeholder="{{ 'comment-page.enter-title' | translate}}" onkeypress="return event.keyCode !=13;"
- [formControl]="subjectForm">
- <mat-hint align="end">{{commentSubject.value.length}} / 25</mat-hint>
- </mat-form-field>
- <mat-form-field class="input-block">
- <textarea matInput #commentBody placeholder="{{ 'comment-page.enter-comment' | translate}}"
- matAutosizeMinRows=2 matAutosizeMaxRows=5 maxlength="255" [formControl]="bodyForm"></textarea>
- <mat-hint align="end">{{commentBody.value.length}} / 255</mat-hint>
- </mat-form-field>
- <button mat-raised-button color="accent"
- (click)="pressSend(commentSubject.value, commentBody.value)">{{ 'comment-page.send' | translate}}</button>
- </form>
+ <button mat-raised-button color="accent"
+ (click)="pressSend(commentSubject.value, commentBody.value)">{{ 'comment-page.send' | translate}}</button>
</div>
<div fxLayout="row" fxLayoutAlign="center">
<app-comment-list></app-comment-list>
diff --git a/src/app/components/shared/comment-page/comment-page.component.scss b/src/app/components/shared/comment-page/comment-page.component.scss
index f057f5e76..501394eb4 100644
--- a/src/app/components/shared/comment-page/comment-page.component.scss
+++ b/src/app/components/shared/comment-page/comment-page.component.scss
@@ -1,20 +1,4 @@
-form {
- display: block;
- width: 100%;
- max-width: 800px;
- margin-bottom: 50px;
-}
-
app-comment-list {
width: 100%;
max-width: 800px;
}
-
-button {
- margin-right: 20px;
- min-width: 80px;
-}
-
-textarea {
- line-height: 120%;
-}
diff --git a/src/app/components/shared/comment-page/comment-page.component.ts b/src/app/components/shared/comment-page/comment-page.component.ts
index a33219351..5aa350e27 100644
--- a/src/app/components/shared/comment-page/comment-page.component.ts
+++ b/src/app/components/shared/comment-page/comment-page.component.ts
@@ -22,8 +22,7 @@ export class CommentPageComponent implements OnInit {
roomShortId: string;
user: User;
private date = new Date(Date.now());
- subjectForm = new FormControl('', [Validators.required]);
- bodyForm = new FormControl('', [Validators.required]);
+
constructor(
@@ -31,8 +30,7 @@ export class CommentPageComponent implements OnInit {
private route: ActivatedRoute,
private commentService: CommentService,
private notification: NotificationService,
- public dialog: MatDialog,
- private translationService: TranslateService) { }
+ public dialog: MatDialog) { }
ngOnInit(): void {
this.user = this.authenticationService.getUser();
@@ -40,55 +38,21 @@ export class CommentPageComponent implements OnInit {
this.roomId = localStorage.getItem(`roomId`);
}
- pressSend(subject: string, body: string): void {
- if (this.checkInputData(subject, body)) {
- this.openSubmitDialog(subject, body);
- }
- }
-
-
- openSubmitDialog(subject: string, body: string): void {
+ openSubmitDialog(): void {
const dialogRef = this.dialog.open(SubmitCommentComponent, {
width: '400px'
});
- dialogRef.componentInstance.comment = new Comment();
- dialogRef.componentInstance.comment.subject = subject;
- dialogRef.componentInstance.comment.body = body;
dialogRef.afterClosed()
.subscribe(result => {
- if (result === 'send') {
- this.send(subject, body);
+ if (result !== null) {
+ this.send(result);
} else {
return;
}
});
}
- checkInputData(subject: string, body: string): boolean {
- subject = subject.trim();
- body = body.trim();
- if (!subject && !body) {
- this.translationService.get('comment-page.error-both-fields').subscribe(message => {
- this.notification.show(message);
- });
- return false;
- }
- if (!subject) {
- this.translationService.get('comment-page.error-title').subscribe(message => {
- this.notification.show(message);
- });
- return false;
- }
- if (!body) {
- this.translationService.get('comment-page.error-comment').subscribe(message => {
- this.notification.show(message);
- });
- return false;
- }
- return true;
- }
-
send(subject: string, body: string): void {
this.commentService.addComment({
id: '',
--
GitLab