From 18780c3c09d1a43908917b9c73048f96184e867b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Berna=20T=C3=BClek?= <berna.tuelek@mni.thm.de>
Date: Fri, 15 Mar 2019 14:59:59 +0100
Subject: [PATCH] Improve comment creation dialog
---
.../comment-create-page.component.html | 16 +++++++------
.../comment-create-page.component.ts | 24 +++++++++++++++++--
src/assets/i18n/participant/de.json | 11 +++++----
src/assets/i18n/participant/en.json | 9 ++++---
4 files changed, 44 insertions(+), 16 deletions(-)
diff --git a/src/app/components/participant/comment-create-page/comment-create-page.component.html b/src/app/components/participant/comment-create-page/comment-create-page.component.html
index 4bdc50978..ee4cc4d16 100644
--- a/src/app/components/participant/comment-create-page/comment-create-page.component.html
+++ b/src/app/components/participant/comment-create-page/comment-create-page.component.html
@@ -2,18 +2,20 @@
<div fxLayout="row" fxLayoutAlign="center">
<form>
<mat-form-field class="input-block">
- <input matInput #commentSubject type="text" maxlength="24" placeholder="{{ 'comment-page.enter-title' | translate}}">
+ <input matInput #commentSubject type="text" maxlength="25"
+ placeholder="{{ 'comment-page.enter-title' | translate}}" onkeypress="return event.keyCode !=13;"
+ [formControl]="emptySubject">
+ <mat-hint align="end" *ngIf="!emptyInputs">{{commentSubject.value.length}} / 25</mat-hint>
</mat-form-field>
<mat-form-field class="input-block">
- <input matInput #commentBody>
- <textarea matInput></textarea>
+ <textarea matInput #commentBody placeholder="{{ 'comment-page.enter-comment' | translate}}" matTextareaAutosize
+ matAutosizeMinRows=1 matAutosizeMaxRows=5 [formControl]="emptyBody"></textarea>
</mat-form-field>
- <button mat-raised-button color="primary" (click)="goBack()">{{ 'comment-page.back' | translate}}</button>
- <button mat-raised-button color="accent" (click)="send(commentSubject.value, commentBody.value)">{{ 'comment-page.send' | translate}}</button>
+ <button mat-raised-button color="accent"
+ (click)="send(commentSubject.value, commentBody.value)">{{ 'comment-page.send' | translate}}</button>
</form>
</div>
<div fxLayout="row" fxLayoutAlign="center">
<app-comment-list></app-comment-list>
</div>
-</div>
-
+</div>
\ No newline at end of file
diff --git a/src/app/components/participant/comment-create-page/comment-create-page.component.ts b/src/app/components/participant/comment-create-page/comment-create-page.component.ts
index 9dafaa1af..048bc1801 100644
--- a/src/app/components/participant/comment-create-page/comment-create-page.component.ts
+++ b/src/app/components/participant/comment-create-page/comment-create-page.component.ts
@@ -1,6 +1,8 @@
import { Component, OnInit, ViewChild } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Location } from '@angular/common';
+import { FormControl, Validators } from '@angular/forms';
+import { TranslateService } from '@ngx-translate/core';
import { Comment } from '../../../models/comment';
import { RoomService } from '../../../services/http/room.service';
import { CommentService } from '../../../services/http/comment.service';
@@ -20,6 +22,8 @@ export class CommentCreatePageComponent implements OnInit {
roomShortId: string;
user: User;
private date = new Date(Date.now());
+ private emptySubject = new FormControl('', [Validators.required]);
+ private emptyBody = new FormControl('', [Validators.required]);
constructor(
protected authenticationService: AuthenticationService,
@@ -27,7 +31,8 @@ export class CommentCreatePageComponent implements OnInit {
private roomService: RoomService,
private commentService: CommentService,
private location: Location,
- private notification: NotificationService) { }
+ private notification: NotificationService,
+ private translationService: TranslateService) { }
ngOnInit(): void {
this.user = this.authenticationService.getUser();
@@ -40,7 +45,22 @@ export class CommentCreatePageComponent implements OnInit {
send(subject: string, body: string): void {
subject = subject.trim();
body = body.trim();
- if (!subject || !body) {
+ if (!subject && !body) {
+ this.translationService.get('comment-page.error-both-fields').subscribe(message => {
+ this.notification.show(message);
+ });
+ return;
+ }
+ if (!subject) {
+ this.translationService.get('comment-page.error-title').subscribe(message => {
+ this.notification.show(message);
+ });
+ return;
+ }
+ if (!body) {
+ this.translationService.get('comment-page.error-comment').subscribe(message => {
+ this.notification.show(message);
+ });
return;
}
this.commentService.addComment({
diff --git a/src/assets/i18n/participant/de.json b/src/assets/i18n/participant/de.json
index da12eb490..8b0a48001 100644
--- a/src/assets/i18n/participant/de.json
+++ b/src/assets/i18n/participant/de.json
@@ -15,9 +15,12 @@
"description": "Beschreibung"
},
"comment-page": {
- "enter-title": "Geben Sie einen Titel ein",
- "back": "Zurück",
- "send": "Senden"
+ "enter-title": "Titel",
+ "enter-comment": "Kommentar",
+ "send": "Senden",
+ "error-comment": "Bitte geben Sie ein Kommentar ein!",
+ "error-title": "Bitte geben Sie einen Titel ein!",
+ "error-both-fields": "Bitte füllen Sie alle Felder aus!"
},
"answer": {
"submit": "Absenden",
@@ -40,4 +43,4 @@
"improvable": "Luft nach oben",
"no-answers": "Keine Antworten"
}
-}
+}
\ No newline at end of file
diff --git a/src/assets/i18n/participant/en.json b/src/assets/i18n/participant/en.json
index fd8c912e9..aa20d09d2 100644
--- a/src/assets/i18n/participant/en.json
+++ b/src/assets/i18n/participant/en.json
@@ -15,9 +15,12 @@
"description": "Description"
},
"comment-page": {
- "enter-title": "Enter a title",
- "back": "Back",
- "send": "Send"
+ "enter-title": "Title",
+ "enter-comment": "Comment",
+ "send": "Send",
+ "error-title": "Please enter a title!",
+ "error-comment": "Please enter a comment!",
+ "error-both-fields": "Please fill in all fields!"
},
"answer": {
"submit": "Submit",
--
GitLab