aboutsummaryrefslogtreecommitdiff
path: root/src/app/components/comment/comment.component.ts
diff options
context:
space:
mode:
Diffstat (limited to 'src/app/components/comment/comment.component.ts')
-rw-r--r--src/app/components/comment/comment.component.ts98
1 files changed, 85 insertions, 13 deletions
diff --git a/src/app/components/comment/comment.component.ts b/src/app/components/comment/comment.component.ts
index 5076769..2a54f92 100644
--- a/src/app/components/comment/comment.component.ts
+++ b/src/app/components/comment/comment.component.ts
@@ -1,54 +1,126 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { AfterViewInit, Component, ElementRef, Input, OnInit, Renderer2, ViewChild } from '@angular/core';
+import { FormBuilder, FormControl, FormGroup } from '@angular/forms';
import { Router } from '@angular/router';
import { Guid } from 'guid-typescript';
import { CommentService } from 'src/app/services/comment.service';
+import { TokenService } from 'src/app/services/token.service';
import { UserService } from 'src/app/services/user.service';
-import { Comment } from 'src/models/comment';
-import { User } from 'src/models/identity/user';
+import { Comment } from 'src/models/comment.model';
+import { User } from 'src/models/identity/user.model';
@Component({
selector: 'app-comment',
templateUrl: './comment.component.html',
styleUrls: ['./comment.component.css']
})
-export class CommentComponent implements OnInit {
+export class CommentComponent implements OnInit, AfterViewInit {
public loaded = false;
+ public loggedInAuthor = false;
+ public editingComment = false;
public user: User;
public comment: Comment;
public timeCreated: string;
@Input() paramId: string;
+ public editCommentFormGroup: FormGroup;
+ @ViewChild('share') shareBtn: ElementRef;
+ private _defaultShareBtnInnerHTML: string;
+ private _linkShared = false;
- constructor(private _router: Router, private _commentService: CommentService, private _userService: UserService)
+ constructor(private _router: Router, private _commentService: CommentService, private _userService: UserService, private _tokenService: TokenService, private _fb: FormBuilder, private _elem: ElementRef, private _renderer: Renderer2)
{ }
ngOnInit(): void {
this.comment = this._commentService.getDefaultComment();
this.user = this._userService.getDefaultUser();
- this._commentService.getCommentRequest(Guid.parse(this.paramId)).subscribe(
- (result: object) => {
+ this._commentService.getCommentRequest(Guid.parse(this.paramId)).subscribe({
+ next: (result: object) => {
Object.assign(this.comment, result);
this.timeCreated = new Date(this.comment.timeCreated).toLocaleString('en-GB');
this.loadUser();
}
- );
+ });
+
+ this.editCommentFormGroup = this._fb.group({
+ newCommentMessage: new FormControl('')
+ });
}
private loadUser(): void {
- this._userService.getUserByUsernameRequest(this.comment.issuerUsername).subscribe(
- (result: object) => {
+ this._userService.getUserByUsernameRequest(this.comment.issuerUsername).subscribe({
+ next: (result: object) => {
Object.assign(this.user, result);
+
+ if (this._tokenService.getTokenFromSessionStorage() !== '') {
+ this.loggedInAuthor = this._tokenService.getUsernameFromSessionStorageToken() === this.comment.issuerUsername;
+ this.editCommentFormGroup.get('newCommentMessage')?.setValue(this.comment.message);
+ }
+
this.loaded = true;
}
- );
+ });
+ }
+
+ ngAfterViewInit(): void {
+ this._defaultShareBtnInnerHTML = this.shareBtn.nativeElement.innerHTML;
}
goToAuthorProfile(): void {
this._router.navigate(['/profile/' + this.comment.issuerUsername]);
}
- goToCommentPage(): void {
- this._router.navigate(['/comment/' + this.comment.commentId]);
+ toggleEditing(): void {
+ this.editingComment = !this.editingComment;
+ }
+
+ editComment(): void {
+ if (this._tokenService.getTokenFromSessionStorage() === '') {
+ this._router.navigate(['/login']);
+ return;
+ }
+
+ if (this.editingComment) {
+ const newMessage = this.editCommentFormGroup.get('newCommentMessage')?.value;
+
+ if (newMessage !== '' && newMessage !== this.comment.message) {
+ this._commentService.putCommentWithSessionStorageRequest(Guid.parse(this.paramId), this.comment.postId, newMessage).subscribe({
+ next: () => {
+ this.reloadPage();
+ }
+ });
+ }
+ }
+ this.editingComment = !this.editingComment;
+ }
+
+ deleteComment(): void {
+ this._commentService.deleteCommentWithSessionStorage(Guid.parse(this.paramId)).subscribe({
+ next: () => {
+ this.reloadPage();
+ }
+ });
+ }
+
+ private reloadPage(): void {
+ this._router.routeReuseStrategy.shouldReuseRoute = () => false;
+ this._router.onSameUrlNavigation = 'reload';
+ this._router.navigate([this._router.url]);
+ }
+
+ resetShareBtn(): void {
+ if (this._linkShared) {
+ this._renderer.setProperty(this.shareBtn.nativeElement, 'innerHTML', this._defaultShareBtnInnerHTML);
+ this._linkShared = false;
+ }
+ }
+
+ showCopiedMessage(): void {
+ this._renderer.setProperty(this.shareBtn.nativeElement, 'innerHTML', 'Link copied to clipboard!');
+ this._linkShared = true;
+ }
+
+ getPostLink(): string {
+ return location.origin + '/comment/' + this.paramId;
}
}