From 0133f3b5e9086fba5006314c183451974d50502c Mon Sep 17 00:00:00 2001 From: Syndamia Date: Sun, 21 Mar 2021 15:48:03 +0200 Subject: Major redesign of post page component and removed post edit and delete functionality, as well as old navbar from it --- .../components/post-page/post-page.component.ts | 50 ---------------------- 1 file changed, 50 deletions(-) (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 index a60f4da..e159c69 100644 --- a/src/app/components/post-page/post-page.component.ts +++ b/src/app/components/post-page/post-page.component.ts @@ -87,48 +87,6 @@ export class PostPageComponent implements OnInit { } } - 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) { - const newMessage = this.editPostFormGroup.get('newPostMessage')?.value; - - if (newMessage === '' && newMessage !== this.post.message) { - this._postService.putPostWithSessionStorageRequest(this.postId, newMessage, this.files).subscribe({ - next: () => { - this.reloadPage(); - } - }); - this.dataArrived = false; - } - } - this.editingPost = !this.editingPost; - } - addComment(): void { if (!this.loggedIn) { this._router.navigate(['/login']); @@ -146,14 +104,6 @@ export class PostPageComponent implements OnInit { } } - deletePost(): void { - this._postService.deletePostWithSessionStorage(this.postId).subscribe({ - next: () => { - this._router.navigate(['/profile/' + this._tokenService.getUsernameFromSessionStorageToken()]); - } - }); - } - private reloadPage(): void { this._router.routeReuseStrategy.shouldReuseRoute = () => false; this._router.onSameUrlNavigation = 'reload'; -- cgit v1.2.3 From 0a16705c40735e81afa1f3d58c7cba224f46dbcd Mon Sep 17 00:00:00 2001 From: Syndamia Date: Sun, 21 Mar 2021 16:32:44 +0200 Subject: Implemented (moved from post page) functionality for editing and deleting your posts into post component --- .vim/coc-settings.json | 3 + .../components/post-page/post-page.component.ts | 46 +---------- src/app/components/post/post.component.css | 21 +++++ src/app/components/post/post.component.html | 38 +++++++-- src/app/components/post/post.component.ts | 82 +++++++++++++++++++- src/assets/icons/tabler-icon-edit.svg | 76 ++++++++++++++++++ src/assets/icons/tabler-icon-trash.svg | 90 ++++++++++++++++++++++ 7 files changed, 307 insertions(+), 49 deletions(-) create mode 100644 .vim/coc-settings.json create mode 100644 src/assets/icons/tabler-icon-edit.svg create mode 100644 src/assets/icons/tabler-icon-trash.svg (limited to 'src/app/components/post-page/post-page.component.ts') diff --git a/.vim/coc-settings.json b/.vim/coc-settings.json new file mode 100644 index 0000000..d69e97e --- /dev/null +++ b/.vim/coc-settings.json @@ -0,0 +1,3 @@ +{ + "angular.enable-experimental-ivy-prompt": false +} \ No newline at end of file diff --git a/src/app/components/post-page/post-page.component.ts b/src/app/components/post-page/post-page.component.ts index e159c69..0babfdf 100644 --- a/src/app/components/post-page/post-page.component.ts +++ b/src/app/components/post-page/post-page.component.ts @@ -7,7 +7,6 @@ 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.model'; -import { CloudinaryService } from 'src/app/services/cloudinary.service'; @Component({ selector: 'app-post-page', @@ -18,22 +17,17 @@ 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){ + constructor(private _titleService: Title, private _router: Router, private _fb: FormBuilder, private _tokenService: TokenService, private _postService: PostService, private _commentService: CommentService) { 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 @@ -41,52 +35,19 @@ export class PostPageComponent implements OnInit { next: (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(); - this.editPostFormGroup.get('newPostMessage')?.setValue(this.post.message); - } - if (this.post.fileURLs.length > 0) { - this.loadFiles(); - } - else { - this.dataArrived = true; - } + + this.dataArrived = true; }, error: () => { 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({ - next: (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; - } - } - }); - } - } - addComment(): void { if (!this.loggedIn) { this._router.navigate(['/login']); @@ -97,7 +58,6 @@ export class PostPageComponent implements OnInit { if (newComment !== '' && newComment !== null) { this._commentService.createCommentWithSessionStorageRequest(this.postId, newComment).subscribe({ next: () => { - this.editPostFormGroup.reset(); this.reloadPage(); } }); diff --git a/src/app/components/post/post.component.css b/src/app/components/post/post.component.css index c5919fd..1015564 100644 --- a/src/app/components/post/post.component.css +++ b/src/app/components/post/post.component.css @@ -32,3 +32,24 @@ height: 1.2em; width: 1.2em; } + +/* Edit */ + +#attachments-btns img, .file-button > input { + height: 1.4em; + width: 1.4em; +} + +.file-button { + position: relative; +} + +.file-button > img { + position: absolute; + pointer-events: none; +} + +.file-button > input { + font-size: inherit; + color: transparent; +} diff --git a/src/app/components/post/post.component.html b/src/app/components/post/post.component.html index 133b747..1831c5e 100644 --- a/src/app/components/post/post.component.html +++ b/src/app/components/post/post.component.html @@ -13,14 +13,36 @@ @{{ user.userName }} -
+
{{ post.message }}
-
+
+
+ +
+
+ + +
+
+
+
+
+
+ {{ file.name ? file.name : 'Attachment' }} +
+
+ +
+
+
+
-
- + - +