diff --git a/src/app/components/creator/comment-creator-page/comment-creator-page.component.scss b/src/app/components/creator/comment-creator-page/comment-creator-page.component.scss
index 501394eb496b8c96db882589073de268cfcb434a..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391 100644
--- a/src/app/components/creator/comment-creator-page/comment-creator-page.component.scss
+++ b/src/app/components/creator/comment-creator-page/comment-creator-page.component.scss
@@ -1,4 +0,0 @@
-app-comment-list {
- width: 100%;
- max-width: 800px;
-}
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
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
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
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/src/app/components/shared/comment-list/comment-list.component.scss b/src/app/components/shared/comment-list/comment-list.component.scss
index c7889db8d7c223204daadb94ece9c5314ff681f6..05f9132c8fd215795eda5b6137d6a841a4d526da 100644
--- a/src/app/components/shared/comment-list/comment-list.component.scss
+++ b/src/app/components/shared/comment-list/comment-list.component.scss
@@ -1,6 +1,9 @@
mat-card {
margin-bottom: 10px;
background-color: #4db6ac;
+ border-radius: 8px;
+ width: 100%;
+ max-width: 800px;
}
app-comment {
@@ -10,7 +13,7 @@ app-comment {
input {
box-sizing: border-box;
- padding: 0 10px 0 20px;
+ padding: 0 10px 0 20px;
width: 100%;
background-color: #4db6ac;
border: none;
diff --git a/src/app/components/shared/comments-creator-shared/comments-creator-shared.component.html b/src/app/components/shared/comments-creator-shared/comments-creator-shared.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..806e67f6a4047cabb02489b71b47319e311ac63e
--- /dev/null
+++ b/src/app/components/shared/comments-creator-shared/comments-creator-shared.component.html
@@ -0,0 +1,21 @@
+<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)="send(commentSubject.value, commentBody.value)">{{ 'comment-page.send' | translate}}</button>
+ </form>
+ </div>
+ <div fxLayout="row" fxLayoutAlign="center">
+ </div>
+</div>
diff --git a/src/app/components/shared/comments-creator-shared/comments-creator-shared.component.scss b/src/app/components/shared/comments-creator-shared/comments-creator-shared.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..c1fc4a1b78d26cc8075f1f7df4ee378233edac2c
--- /dev/null
+++ b/src/app/components/shared/comments-creator-shared/comments-creator-shared.component.scss
@@ -0,0 +1,15 @@
+form {
+ display: block;
+ width: 100%;
+ max-width: 800px;
+ margin-bottom: 50px;
+}
+
+button {
+ margin-right: 20px;
+ min-width: 80px;
+}
+
+textarea {
+ line-height: 120%;
+}
diff --git a/src/app/components/shared/comments-creator-shared/comments-creator-shared.component.spec.ts b/src/app/components/shared/comments-creator-shared/comments-creator-shared.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..8230e89330f36bd9beedda17782b297a2c80cd8b
--- /dev/null
+++ b/src/app/components/shared/comments-creator-shared/comments-creator-shared.component.spec.ts
@@ -0,0 +1,25 @@
+/* import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CommentsCreatorSharedComponent } from './comments-creator-shared.component';
+
+describe('CommentsCreatorSharedComponent', () => {
+ let component: CommentsCreatorSharedComponent;
+ let fixture: ComponentFixture<CommentsCreatorSharedComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ CommentsCreatorSharedComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(CommentsCreatorSharedComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+}); */
diff --git a/src/app/components/shared/comments-creator-shared/comments-creator-shared.component.ts b/src/app/components/shared/comments-creator-shared/comments-creator-shared.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..af11d7a3a4b131b3929643a303b7167e44de302f
--- /dev/null
+++ b/src/app/components/shared/comments-creator-shared/comments-creator-shared.component.ts
@@ -0,0 +1,76 @@
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { FormControl, Validators } from '@angular/forms';
+import { TranslateService } from '@ngx-translate/core';
+import { Comment } from '../../../models/comment';
+import { CommentService } from '../../../services/http/comment.service';
+import { NotificationService } from '../../../services/util/notification.service';
+import { AuthenticationService } from '../../../services/http/authentication.service';
+import { User } from '../../../models/user';
+import { CommentListComponent } from '../comment-list/comment-list.component';
+
+@Component({
+ selector: 'app-comments-creator-shared',
+ templateUrl: './comments-creator-shared.component.html',
+ styleUrls: ['./comments-creator-shared.component.scss']
+})
+export class CommentsCreatorSharedComponent implements OnInit {
+
+ @ViewChild(CommentListComponent) child: CommentListComponent;
+ roomId: string;
+ roomShortId: string;
+ user: User;
+ private date = new Date(Date.now());
+ subjectForm = new FormControl('', [Validators.required]);
+ bodyForm = new FormControl('', [Validators.required]);
+
+
+ constructor(
+ protected authenticationService: AuthenticationService,
+ private route: ActivatedRoute,
+ private commentService: CommentService,
+ private notification: NotificationService,
+ private translationService: TranslateService) { }
+
+ ngOnInit(): void {
+ this.user = this.authenticationService.getUser();
+ this.roomShortId = this.route.snapshot.paramMap.get('roomId');
+ this.roomId = localStorage.getItem(`roomId`);
+ }
+
+ send(subject: string, body: string): void {
+ subject = subject.trim();
+ body = body.trim();
+ 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({
+ id: '',
+ roomId: this.roomId,
+ userId: this.user.id,
+ subject: subject,
+ body: body,
+ creationTimestamp: this.date.getTime(),
+ read: false,
+ revision: ''
+ } as Comment).subscribe(() => {
+ this.child.getComments();
+ this.notification.show(`Comment '${subject}' successfully created.`);
+ });
+ }
+}