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..b5c53abe14ab36a8683713085a2bc1e0faeb9583 --- /dev/null +++ b/src/app/components/participant/comment-create-page/comment-create-page.component.ts @@ -0,0 +1,88 @@ +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 '../../shared/comment-list/comment-list.component'; +import { RxStompService } from '@stomp/ng2-stompjs'; +import { CreateComment } from '../../../models/messages/create-comment'; + +@Component({ + selector: 'app-comment-create-page', + templateUrl: './comment-create-page.component.html', + styleUrls: ['./comment-create-page.component.scss'] +}) +export class CommentCreatePageComponent 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 notification: NotificationService, + private translationService: TranslateService, + private rxStompService: RxStompService) { } + + 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(translatedMessage => { + this.notification.show(translatedMessage); + }); + return; + } + if (!subject) { + this.translationService.get('comment-page.error-title').subscribe(translatedMessage => { + this.notification.show(translatedMessage); + }); + return; + } + if (!body) { + this.translationService.get('comment-page.error-comment').subscribe(translatedMessage => { + this.notification.show(translatedMessage); + }); + return; + } + const message = new CreateComment(this.roomId, this.user.id, subject, body); + this.rxStompService.publish({ + destination: `/queue/comment.command`, + body: JSON.stringify(message), + headers: { + 'content-type': 'application/json' + } + }); + + /*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.`); + this.goBack(); + });*/ + } +} + diff --git a/src/app/components/shared/comment-list/comment-list.component.ts b/src/app/components/shared/comment-list/comment-list.component.ts index 8b104e1f26a40c48a8d5c2ccd2cef73e1e31df99..fc3ab2d3bebd8b3adf3bf7cb62d46a6e39aba2bc 100644 --- a/src/app/components/shared/comment-list/comment-list.component.ts +++ b/src/app/components/shared/comment-list/comment-list.component.ts @@ -3,6 +3,8 @@ import { Comment } from '../../../models/comment'; import { CommentService } from '../../../services/http/comment.service'; import { TranslateService } from '@ngx-translate/core'; import { LanguageService } from '../../../services/util/language.service'; +import { RxStompService } from '@stomp/ng2-stompjs'; +import { Message } from '@stomp/stompjs'; @Component({ selector: 'app-comment-list', @@ -19,12 +21,17 @@ export class CommentListComponent implements OnInit { constructor(private commentService: CommentService, private translateService: TranslateService, protected langService: LanguageService) { + private rxStompService: RxStompService) { langService.langEmitter.subscribe(lang => translateService.use(lang)); } ngOnInit() { this.roomId = localStorage.getItem(`roomId`); + this.comments = []; this.hideCommentsList = false; + this.rxStompService.watch(`/queue/${this.roomId}.comment.stream`).subscribe((message: Message) => { + this.parseIncomingMessage(message); + }); this.getComments(); this.translateService.use(localStorage.getItem('currentLang')); } @@ -40,4 +47,16 @@ export class CommentListComponent implements OnInit { searchComments(term: string): void { this.filteredComments = this.comments.filter(c => c.body.toLowerCase().includes(term)); } + + parseIncomingMessage(message: Message) { + console.log(message); + const payload = JSON.parse(message.body).payload; + const c = new Comment(); + c.roomId = this.roomId; + c.subject = payload.subject; + c.body = payload.body; + + this.comments.concat(c); + } } + diff --git a/src/app/models/messages/create-comment.ts b/src/app/models/messages/create-comment.ts new file mode 100644 index 0000000000000000000000000000000000000000..43331c038f5e27a81b53fd56121787bc96e65da3 --- /dev/null +++ b/src/app/models/messages/create-comment.ts @@ -0,0 +1,19 @@ +export class CreateComment { + type: string; + payload: { + roomId: string; + creatorId: string; + subject: string; + body: string; + }; + + constructor(roomId: string, creatorId: string, subject: string, body: string) { + this.type = 'CreateComment'; + this.payload = { + roomId: roomId, + creatorId: creatorId, + subject: subject, + body: body + }; + } +} diff --git a/src/app/rx-stomp.config.ts b/src/app/rx-stomp.config.ts index 70326222a0d4eb3bb8de6041633a864871acfda1..aaded217c0dcab07296eaec586af6ac4383fba9a 100644 --- a/src/app/rx-stomp.config.ts +++ b/src/app/rx-stomp.config.ts @@ -18,6 +18,6 @@ export const myRxStompConfig: InjectableRxStompConfig = { // It can be quite verbose, not recommended in production // Skip this key to stop logging to console debug: (msg: string): void => { - // console.log(new Date(), 'STOMP debug: ' + msg); + console.log(new Date(), 'STOMP debug: ' + msg); } };