From bcd88af53b1a920d728ec98b45daa9ac2e2c0917 Mon Sep 17 00:00:00 2001 From: transtrike Date: Fri, 12 Feb 2021 19:04:53 +0200 Subject: Moved from DevHive --- .../components/post-page/post-page.component.ts | 162 +++++++++++++++++++++ 1 file changed, 162 insertions(+) create mode 100644 src/app/components/post-page/post-page.component.ts (limited to 'src/app/components/post-page/post-page.component.ts') diff --git a/src/app/components/post-page/post-page.component.ts b/src/app/components/post-page/post-page.component.ts new file mode 100644 index 0000000..413ff80 --- /dev/null +++ b/src/app/components/post-page/post-page.component.ts @@ -0,0 +1,162 @@ +import { HttpErrorResponse } from '@angular/common/http'; +import { Component, OnInit } from '@angular/core'; +import { FormBuilder, FormControl, FormGroup } from '@angular/forms'; +import { Title } from '@angular/platform-browser'; +import { Router } from '@angular/router'; +import { Guid } from 'guid-typescript'; +import { CommentService } from 'src/app/services/comment.service'; +import { PostService } from 'src/app/services/post.service'; +import { TokenService } from 'src/app/services/token.service'; +import { Post } from 'src/models/post'; +import { CloudinaryService } from 'src/app/services/cloudinary.service'; + +@Component({ + selector: 'app-post-page', + templateUrl: './post-page.component.html', + styleUrls: ['./post-page.component.css'] +}) +export class PostPageComponent implements OnInit { + private _title = 'Post'; + public dataArrived = false; + public loggedIn = false; + public editable = false; + public editingPost = false; + public postId: Guid; + public post: Post; + public files: File[]; + public editPostFormGroup: FormGroup; + public addCommentFormGroup: FormGroup; + + constructor(private _titleService: Title, private _router: Router, private _fb: FormBuilder, private _tokenService: TokenService, private _postService: PostService, private _commentService: CommentService, private _cloudinaryService: CloudinaryService){ + this._titleService.setTitle(this._title); + } + + ngOnInit(): void { + this.loggedIn = this._tokenService.getTokenFromSessionStorage() !== ''; + this.postId = Guid.parse(this._router.url.substring(6)); + this.files = []; + + // Gets the post and the logged in user and compares them, + // to determine if the current post is made by the user + this._postService.getPostRequest(this.postId).subscribe( + (result: object) => { + this.post = result as Post; + this.post.fileURLs = Object.values(result)[7]; + if (this.loggedIn) { + this.editable = this.post.creatorUsername === this._tokenService.getUsernameFromSessionStorageToken(); + } + if (this.post.fileURLs.length > 0) { + this.loadFiles(); + } + else { + this.dataArrived = true; + } + }, + (err: HttpErrorResponse) => { + this._router.navigate(['/not-found']); + } + ); + + this.editPostFormGroup = this._fb.group({ + newPostMessage: new FormControl(''), + fileUpload: new FormControl('') + }); + + this.addCommentFormGroup = this._fb.group({ + newComment: new FormControl('') + }); + } + + private loadFiles(): void { + for (const fileURL of this.post.fileURLs) { + this._cloudinaryService.getFileRequest(fileURL).subscribe( + (result: object) => { + const file = result as File; + const tmp = { + name: fileURL.match('(?<=\/)(?:.(?!\/))+$')?.pop() ?? 'Attachment' + }; + + Object.assign(file, tmp); + this.files.push(file); + + if (this.files.length === this.post.fileURLs.length) { + this.dataArrived = true; + } + } + ); + } + } + + backToFeed(): void { + this._router.navigate(['/']); + } + + backToProfile(): void { + this._router.navigate(['/profile/' + this._tokenService.getUsernameFromSessionStorageToken()]); + } + + toLogin(): void { + this._router.navigate(['/login']); + } + + onFileUpload(event: any): void { + this.files.push(...event.target.files); + this.editPostFormGroup.get('fileUpload')?.reset(); + } + + removeAttachment(fileName: string): void { + this.files = this.files.filter(x => x.name !== fileName); + } + + editPost(): void { + if (this._tokenService.getTokenFromSessionStorage() === '') { + this.toLogin(); + return; + } + + if (this.editingPost) { + let newMessage = this.editPostFormGroup.get('newPostMessage')?.value; + if (newMessage === '') { + newMessage = this.post.message; + } + this._postService.putPostWithSessionStorageRequest(this.postId, newMessage, this.files).subscribe( + (result: object) => { + this.reloadPage(); + } + ); + this.dataArrived = false; + } + this.editingPost = !this.editingPost; + } + + addComment(): void { + if (!this.loggedIn) { + this._router.navigate(['/login']); + return; + } + + const newComment = this.addCommentFormGroup.get('newComment')?.value; + if (newComment !== '' && newComment !== null) { + this._commentService.createCommentWithSessionStorageRequest(this.postId, newComment).subscribe( + (result: object) => { + this.editPostFormGroup.reset(); + this.reloadPage(); + } + ); + } + } + + deletePost(): void { + this._postService.deletePostWithSessionStorage(this.postId).subscribe( + (result: object) => { + this._router.navigate(['/profile/' + this._tokenService.getUsernameFromSessionStorageToken()]); + } + ); + } + + private reloadPage(): void { + this._router.routeReuseStrategy.shouldReuseRoute = () => false; + this._router.onSameUrlNavigation = 'reload'; + this._router.navigate([this._router.url]); + } +} -- cgit v1.2.3