From 2b5b2f2449317b8aebd2d8962a930bf454d100fb Mon Sep 17 00:00:00 2001 From: Syndamia Date: Wed, 24 Feb 2021 18:32:16 +0200 Subject: Improved semantics and simplifed some code in feed component --- src/app/components/feed/feed.component.css | 6 +-- src/app/components/feed/feed.component.html | 64 ++++++++++++++--------------- 2 files changed, 31 insertions(+), 39 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/feed/feed.component.css b/src/app/components/feed/feed.component.css index cb155c6..23a70d5 100644 --- a/src/app/components/feed/feed.component.css +++ b/src/app/components/feed/feed.component.css @@ -77,7 +77,7 @@ #top-bar { display: flex; - flex-direction: column; + flex-direction: row; width: 98%; margin: 0 auto; margin-bottom: .5em; @@ -100,10 +100,6 @@ display: none; } -#main-content { - display: flex; -} - /* Create post */ #create-post-form { diff --git a/src/app/components/feed/feed.component.html b/src/app/components/feed/feed.component.html index 1a03dcc..2fece23 100644 --- a/src/app/components/feed/feed.component.html +++ b/src/app/components/feed/feed.component.html @@ -1,8 +1,8 @@ -
- -
+ +
+ + -
-
+
+ None of your friends have posted anything yet!
Try refreshing your page! -
-
+ +
-
-
-
-
+ + + + -- cgit v1.2.3 From 301e3932b64172b3f9cf055287fdfdb4a89620af Mon Sep 17 00:00:00 2001 From: Syndamia Date: Wed, 24 Feb 2021 18:56:32 +0200 Subject: Improved semantics and simplified some HTML of comments and posts --- .../comment-page/comment-page.component.html | 12 ++++--- src/app/components/comment/comment.component.css | 5 +-- src/app/components/comment/comment.component.html | 36 +++++++++---------- src/app/components/feed/feed.component.html | 4 +-- .../post-attachment/post-attachment.component.css | 11 +++--- .../post-attachment/post-attachment.component.html | 18 +++++----- .../components/post-page/post-page.component.html | 28 +++++++-------- src/app/components/post/post.component.html | 41 +++++++++++----------- 8 files changed, 73 insertions(+), 82 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/comment-page/comment-page.component.html b/src/app/components/comment-page/comment-page.component.html index 2d110d6..ae114da 100644 --- a/src/app/components/comment-page/comment-page.component.html +++ b/src/app/components/comment-page/comment-page.component.html @@ -1,14 +1,16 @@ -
- +
+ -
+
+
-
+
diff --git a/src/app/components/comment/comment.component.css b/src/app/components/comment/comment.component.css index d82f10e..419cbf8 100644 --- a/src/app/components/comment/comment.component.css +++ b/src/app/components/comment/comment.component.css @@ -1,5 +1,6 @@ .comment { display: flex; + flex-direction: column; width: 100%; margin: .5em auto; @@ -40,10 +41,6 @@ /* Content */ -.content { - flex: 1; -} - .message { margin: .3em 0; word-break: break-all; diff --git a/src/app/components/comment/comment.component.html b/src/app/components/comment/comment.component.html index 718e25c..e46bdb7 100644 --- a/src/app/components/comment/comment.component.html +++ b/src/app/components/comment/comment.component.html @@ -1,23 +1,21 @@ -
-
-
- -
-
- {{ user.firstName }} {{ user.lastName }} -
-
- @{{ user.userName }} -
+
+ + +
+
+ {{ user.firstName }} {{ user.lastName }} +
+
+ @{{ user.userName }}
-
- {{ comment.message }} -
-
- {{ timeCreated }} -
-
-
+ +
+ {{ comment.message }} +
+ + diff --git a/src/app/components/feed/feed.component.html b/src/app/components/feed/feed.component.html index 2fece23..74657dc 100644 --- a/src/app/components/feed/feed.component.html +++ b/src/app/components/feed/feed.component.html @@ -40,9 +40,9 @@ None of your friends have posted anything yet!
Try refreshing your page! -
+
-
+
diff --git a/src/app/components/post-attachment/post-attachment.component.css b/src/app/components/post-attachment/post-attachment.component.css index 572cc99..58e8a82 100644 --- a/src/app/components/post-attachment/post-attachment.component.css +++ b/src/app/components/post-attachment/post-attachment.component.css @@ -1,6 +1,9 @@ /* Attachment */ .attachment { + width: 100%; + height: 100%; + display: flex; border: 2px solid black; border-top: 0; border-radius: 0 0 .6em .6em; @@ -9,13 +12,7 @@ margin-top: calc(-0.8em - 2px); } -.clickable { - width: 100%; - height: 100%; - display: flex; -} - -.clickable:hover { +.attachment:hover { cursor: pointer; } diff --git a/src/app/components/post-attachment/post-attachment.component.html b/src/app/components/post-attachment/post-attachment.component.html index 4d381d1..401068c 100644 --- a/src/app/components/post-attachment/post-attachment.component.html +++ b/src/app/components/post-attachment/post-attachment.component.html @@ -1,13 +1,11 @@ -
-
-
- {{ fileName }} -
-
- {{ fileType }} -
-
-
+
+ + {{ fileName }} + + + {{ fileType }} + +
diff --git a/src/app/components/post-page/post-page.component.html b/src/app/components/post-page/post-page.component.html index 8665865..b8e7e22 100644 --- a/src/app/components/post-page/post-page.component.html +++ b/src/app/components/post-page/post-page.component.html @@ -1,11 +1,13 @@ -
-
- - -
- +
+
@@ -17,21 +19,19 @@ -
+
{{ file.name ? file.name : 'Attachment' }}
☒
-
+
-
-
- -
-
-
+
+ +
+
diff --git a/src/app/components/post/post.component.html b/src/app/components/post/post.component.html index bc0d84a..4ba4d43 100644 --- a/src/app/components/post/post.component.html +++ b/src/app/components/post/post.component.html @@ -1,8 +1,8 @@ -
-
-
+
+
+
@@ -12,38 +12,37 @@ @{{ user.userName }}
-
-
+ +
{{ post.message }} -
+
-
+
+
║
-
+ {{ post.comments.length }} -
+
- -
-
+ +
-
+ {{ votesNumber }} -
+ -
-
-
-
+ + +
-
+ + -- cgit v1.2.3 From 819e7a2aab526bf8906374f0417a3cd7c0a9f098 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Wed, 24 Feb 2021 18:57:07 +0200 Subject: Removed useless component --- .../kaleidoscope/kaleidoscope.component.css | 0 .../kaleidoscope/kaleidoscope.component.html | 8 -------- .../kaleidoscope/kaleidoscope.component.ts | 24 ---------------------- 3 files changed, 32 deletions(-) delete mode 100644 src/app/components/kaleidoscope/kaleidoscope.component.css delete mode 100644 src/app/components/kaleidoscope/kaleidoscope.component.html delete mode 100644 src/app/components/kaleidoscope/kaleidoscope.component.ts (limited to 'src/app/components') diff --git a/src/app/components/kaleidoscope/kaleidoscope.component.css b/src/app/components/kaleidoscope/kaleidoscope.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/src/app/components/kaleidoscope/kaleidoscope.component.html b/src/app/components/kaleidoscope/kaleidoscope.component.html deleted file mode 100644 index 7392a21..0000000 --- a/src/app/components/kaleidoscope/kaleidoscope.component.html +++ /dev/null @@ -1,8 +0,0 @@ -
- - - - - - -
\ No newline at end of file diff --git a/src/app/components/kaleidoscope/kaleidoscope.component.ts b/src/app/components/kaleidoscope/kaleidoscope.component.ts deleted file mode 100644 index 1c5cda1..0000000 --- a/src/app/components/kaleidoscope/kaleidoscope.component.ts +++ /dev/null @@ -1,24 +0,0 @@ -import { Component, OnInit } from '@angular/core'; -import { LoginComponent } from '../login/login.component'; - -@Component({ - selector: 'app-kaleidoscope', - templateUrl: './kaleidoscope.component.html', - styleUrls: ['./kaleidoscope.component.css'] -}) -export class KaleidoscopeComponent implements OnInit { - - public _component: Component; - - constructor(loginComponent: LoginComponent) { - this._component = loginComponent as Component; - } - - ngOnInit(): void { - - } - - assignComponent(component: Component) { - this._component = component; - } -} -- cgit v1.2.3 From b557d17cf87a79b0117bcf82a998092bd72b4df5 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Wed, 24 Feb 2021 19:00:03 +0200 Subject: Improved semantics of admin panel, loading page and not-found page --- .../admin-panel-page/admin-panel-page.component.html | 8 ++++---- src/app/components/loading/loading.component.html | 4 ++-- src/app/components/not-found/not-found.component.html | 12 ++++++------ 3 files changed, 12 insertions(+), 12 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/admin-panel-page/admin-panel-page.component.html b/src/app/components/admin-panel-page/admin-panel-page.component.html index 980f12c..31f0849 100644 --- a/src/app/components/admin-panel-page/admin-panel-page.component.html +++ b/src/app/components/admin-panel-page/admin-panel-page.component.html @@ -1,13 +1,13 @@ -
+
-
+
@@ -81,5 +81,5 @@
-
-
+ + diff --git a/src/app/components/loading/loading.component.html b/src/app/components/loading/loading.component.html index 8440f4e..bdc795b 100644 --- a/src/app/components/loading/loading.component.html +++ b/src/app/components/loading/loading.component.html @@ -1,3 +1,3 @@ -
+
Loading... -
+ diff --git a/src/app/components/not-found/not-found.component.html b/src/app/components/not-found/not-found.component.html index 8394810..83d73ce 100644 --- a/src/app/components/not-found/not-found.component.html +++ b/src/app/components/not-found/not-found.component.html @@ -1,10 +1,10 @@ -
-
+
+ Page not found! -
+
-
+
-
+ + -- cgit v1.2.3 From e43399dc97bbacf1d44a875fe1d52e9030994fa1 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Wed, 24 Feb 2021 19:02:50 +0200 Subject: Improved semantics of logn and register pages --- src/app/components/login/login.component.html | 18 ++++----- .../components/register/register.component.html | 46 +++++++++++----------- 2 files changed, 32 insertions(+), 32 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/login/login.component.html b/src/app/components/login/login.component.html index 13f9bbf..1fda5b5 100644 --- a/src/app/components/login/login.component.html +++ b/src/app/components/login/login.component.html @@ -1,30 +1,30 @@ -
-
Login
+
+ Login
-
+
-
+ -
-
+ + -
+
-
+
-
+ diff --git a/src/app/components/register/register.component.html b/src/app/components/register/register.component.html index 4e67e0e..df6f6c9 100644 --- a/src/app/components/register/register.component.html +++ b/src/app/components/register/register.component.html @@ -1,65 +1,65 @@ -
-
Register
+
+ Register
-
+
-
+ -
-
+ + -
+
-
+ -
-
+ + -
+
-
+ -
-
+ + -
+
-
+ -
-
+ + -
+
-
+ -
-
+ +
-
+ -- cgit v1.2.3 From c4c85daf3eedbbfb6d9cf615b1a7d96fe26d8112 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Wed, 24 Feb 2021 19:13:44 +0200 Subject: Fixed login page HTML --- src/app/components/login/login.component.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src/app/components') diff --git a/src/app/components/login/login.component.html b/src/app/components/login/login.component.html index 1fda5b5..b641fcb 100644 --- a/src/app/components/login/login.component.html +++ b/src/app/components/login/login.component.html @@ -1,5 +1,5 @@
- Login
+ Login
-- cgit v1.2.3 From d9d76c97bd76ddd503739d94f88eb15905bb4f3b Mon Sep 17 00:00:00 2001 From: Syndamia Date: Thu, 25 Feb 2021 14:11:27 +0200 Subject: Reverted mark elements to divs, because mark has a style already --- src/app/components/feed/feed.component.html | 4 ++-- src/app/components/login/login.component.html | 4 ++-- src/app/components/register/register.component.html | 20 ++++++++++---------- 3 files changed, 14 insertions(+), 14 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/feed/feed.component.html b/src/app/components/feed/feed.component.html index 74657dc..230c27b 100644 --- a/src/app/components/feed/feed.component.html +++ b/src/app/components/feed/feed.component.html @@ -36,10 +36,10 @@
- +
None of your friends have posted anything yet!
Try refreshing your page! - +
diff --git a/src/app/components/login/login.component.html b/src/app/components/login/login.component.html index b641fcb..9f74faa 100644 --- a/src/app/components/login/login.component.html +++ b/src/app/components/login/login.component.html @@ -8,9 +8,9 @@ - +
- +
diff --git a/src/app/components/register/register.component.html b/src/app/components/register/register.component.html index df6f6c9..0075b1d 100644 --- a/src/app/components/register/register.component.html +++ b/src/app/components/register/register.component.html @@ -10,51 +10,51 @@ - +
- +
- +
- +
- +
- +
- +
- +
- +
- +
-- cgit v1.2.3 From b7a574bfaeacda2ed26033572b52f0c0c93ec9cb Mon Sep 17 00:00:00 2001 From: Syndamia Date: Thu, 25 Feb 2021 14:19:59 +0200 Subject: Editing post message has the current message by default and doesn't update if the message isn't changed --- src/app/components/post-page/post-page.component.ts | 20 ++++++++++++-------- 1 file changed, 12 insertions(+), 8 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/post-page/post-page.component.ts b/src/app/components/post-page/post-page.component.ts index 413ff80..648048b 100644 --- a/src/app/components/post-page/post-page.component.ts +++ b/src/app/components/post-page/post-page.component.ts @@ -44,6 +44,7 @@ export class PostPageComponent implements OnInit { 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(); @@ -116,15 +117,18 @@ export class PostPageComponent implements OnInit { 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(); + + if (newMessage !== this.post.message) { + if (newMessage === '') { + newMessage = this.post.message; } - ); - this.dataArrived = false; + this._postService.putPostWithSessionStorageRequest(this.postId, newMessage, this.files).subscribe( + (result: object) => { + this.reloadPage(); + } + ); + this.dataArrived = false; + } } this.editingPost = !this.editingPost; } -- cgit v1.2.3 From 7213d280eac242e8df5403120f59742fb1855a24 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Thu, 25 Feb 2021 14:26:14 +0200 Subject: Editing comment message has the current message by default, if the message isn't changed, the comment doesn't get updated --- src/app/components/comment-page/comment-page.component.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) (limited to 'src/app/components') diff --git a/src/app/components/comment-page/comment-page.component.ts b/src/app/components/comment-page/comment-page.component.ts index bd4cfe5..045e8ea 100644 --- a/src/app/components/comment-page/comment-page.component.ts +++ b/src/app/components/comment-page/comment-page.component.ts @@ -38,6 +38,7 @@ export class CommentPageComponent implements OnInit { this.comment = result as Comment; if (this.loggedIn) { this.editable = this.comment.issuerUsername === this._tokenService.getUsernameFromSessionStorageToken(); + this.editCommentFormGroup.get('newCommentMessage')?.setValue(this.comment.message); } this.loaded = true; }, @@ -63,7 +64,8 @@ export class CommentPageComponent implements OnInit { if (this.editingComment) { const newMessage = this.editCommentFormGroup.get('newCommentMessage')?.value; - if (newMessage !== '') { + + if (newMessage !== '' && newMessage !== this.comment.message) { console.log(this.commentId); this._commentService.putCommentWithSessionStorageRequest(this.commentId, this.comment.postId, newMessage).subscribe( (result: object) => { -- cgit v1.2.3 From 79229fc41cb55c68e195ccee6d0488acabeff3c4 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Thu, 25 Feb 2021 14:27:15 +0200 Subject: Made posts not update at all of the new message is blank (to be consistent with comment page) --- src/app/components/post-page/post-page.component.ts | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/post-page/post-page.component.ts b/src/app/components/post-page/post-page.component.ts index 648048b..3218a19 100644 --- a/src/app/components/post-page/post-page.component.ts +++ b/src/app/components/post-page/post-page.component.ts @@ -116,12 +116,9 @@ export class PostPageComponent implements OnInit { } if (this.editingPost) { - let newMessage = this.editPostFormGroup.get('newPostMessage')?.value; + const newMessage = this.editPostFormGroup.get('newPostMessage')?.value; - if (newMessage !== this.post.message) { - if (newMessage === '') { - newMessage = this.post.message; - } + if (newMessage === '' && newMessage !== this.post.message) { this._postService.putPostWithSessionStorageRequest(this.postId, newMessage, this.files).subscribe( (result: object) => { this.reloadPage(); -- cgit v1.2.3 From a7bf5cad6bf66f2cd7e12fc436410fafb7826b10 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Thu, 25 Feb 2021 14:31:25 +0200 Subject: Fixed unecessary max-width of 98% on submit buttons in post and comment pages --- src/app/components/comment-page/comment-page.component.css | 1 - src/app/components/post-page/post-page.component.css | 2 -- 2 files changed, 3 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/comment-page/comment-page.component.css b/src/app/components/comment-page/comment-page.component.css index b886bc1..f9dc390 100644 --- a/src/app/components/comment-page/comment-page.component.css +++ b/src/app/components/comment-page/comment-page.component.css @@ -21,7 +21,6 @@ } .submit-btn { - max-width: 98%; margin: 0 auto; margin-bottom: .5em; } diff --git a/src/app/components/post-page/post-page.component.css b/src/app/components/post-page/post-page.component.css index 3eec851..4f2ae60 100644 --- a/src/app/components/post-page/post-page.component.css +++ b/src/app/components/post-page/post-page.component.css @@ -54,9 +54,7 @@ pointer-events: none; } - .submit-btn { - max-width: 98%; margin: 0 auto; margin-bottom: .5em; } -- cgit v1.2.3 From eab7b2108d91af1c905f795febf811d5cc404863 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Thu, 25 Feb 2021 14:38:12 +0200 Subject: Removed unnecessary variables from request subscriptions --- .../admin-panel-page/admin-panel-page.component.ts | 20 ++++++++++---------- .../comment-page/comment-page.component.ts | 7 +++---- src/app/components/feed/feed.component.ts | 9 ++++----- src/app/components/post-page/post-page.component.ts | 9 ++++----- .../profile-settings/profile-settings.component.ts | 10 +++++----- src/app/components/profile/profile.component.ts | 15 +++++---------- 6 files changed, 31 insertions(+), 39 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/admin-panel-page/admin-panel-page.component.ts b/src/app/components/admin-panel-page/admin-panel-page.component.ts index 99c0721..95d69d3 100644 --- a/src/app/components/admin-panel-page/admin-panel-page.component.ts +++ b/src/app/components/admin-panel-page/admin-panel-page.component.ts @@ -53,7 +53,7 @@ export class AdminPanelPageComponent implements OnInit { this._router.navigate(['/login']); } }, - (err: HttpErrorResponse) => { + () => { this._router.navigate(['/login']); } ); @@ -129,7 +129,7 @@ export class AdminPanelPageComponent implements OnInit { if (languageCreate !== '' && languageCreate !== null) { this._languageService.createLanguageWithSessionStorageRequest(languageCreate.trim()).subscribe( - (result: object) => { + () => { this.languageModifiedSuccess('Successfully updated languages!'); }, (err: HttpErrorResponse) => { @@ -147,7 +147,7 @@ export class AdminPanelPageComponent implements OnInit { const langId = this.availableLanguages.filter(x => x.name === updateLanguageOldName.trim())[0].id; this._languageService.putLanguageWithSessionStorageRequest(langId, updateLanguageNewName.trim()).subscribe( - (result: object) => { + () => { this.languageModifiedSuccess('Successfully updated languages!'); }, (err: HttpErrorResponse) => { @@ -164,7 +164,7 @@ export class AdminPanelPageComponent implements OnInit { const langId = this.availableLanguages.filter(x => x.name === deleteLanguageName.trim())[0].id; this._languageService.deleteLanguageWithSessionStorageRequest(langId).subscribe( - (result: object) => { + () => { this.languageModifiedSuccess('Successfully deleted language!'); }, (err: HttpErrorResponse) => { @@ -205,7 +205,7 @@ export class AdminPanelPageComponent implements OnInit { if (technologyCreate !== '' && technologyCreate !== null) { this._technologyService.createTechnologyWithSessionStorageRequest(technologyCreate.trim()).subscribe( - (result: object) => { + () => { this.technologyModifiedSuccess('Successfully updated technologies!'); }, (err: HttpErrorResponse) => { @@ -223,7 +223,7 @@ export class AdminPanelPageComponent implements OnInit { const techId = this.availableTechnologies.filter(x => x.name === updateTechnologyOldName.trim())[0].id; this._technologyService.putTechnologyWithSessionStorageRequest(techId, updateTechnologyNewName.trim()).subscribe( - (result: object) => { + () => { this.technologyModifiedSuccess('Successfully updated technologies!'); }, (err: HttpErrorResponse) => { @@ -240,7 +240,7 @@ export class AdminPanelPageComponent implements OnInit { const techId = this.availableTechnologies.filter(x => x.name === deleteTechnologyName.trim())[0].id; this._technologyService.deleteTechnologyWithSessionStorageRequest(techId).subscribe( - (result: object) => { + () => { this.technologyModifiedSuccess('Successfully deleted technology!'); }, (err: HttpErrorResponse) => { @@ -283,7 +283,7 @@ export class AdminPanelPageComponent implements OnInit { const userId: Guid = Guid.parse(deleteUser); this._userService.deleteUserRequest(userId, this._tokenService.getTokenFromSessionStorage()).subscribe( - (result: object) => { + () => { this.deletionSuccess('Successfully deleted user!'); }, (err: HttpErrorResponse) => { @@ -300,7 +300,7 @@ export class AdminPanelPageComponent implements OnInit { const postId: Guid = Guid.parse(deletePost); this._postService.deletePostRequest(postId, this._tokenService.getTokenFromSessionStorage()).subscribe( - (result: object) => { + () => { this.deletionSuccess('Successfully deleted user!'); }, (err: HttpErrorResponse) => { @@ -317,7 +317,7 @@ export class AdminPanelPageComponent implements OnInit { const commentId: Guid = Guid.parse(deleteComment); this._commentService.deleteCommentWithSessionStorage(commentId).subscribe( - (result: object) => { + () => { this.deletionSuccess('Successfully deleted comment!'); }, (err: HttpErrorResponse) => { diff --git a/src/app/components/comment-page/comment-page.component.ts b/src/app/components/comment-page/comment-page.component.ts index 045e8ea..413436e 100644 --- a/src/app/components/comment-page/comment-page.component.ts +++ b/src/app/components/comment-page/comment-page.component.ts @@ -1,4 +1,3 @@ -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'; @@ -42,7 +41,7 @@ export class CommentPageComponent implements OnInit { } this.loaded = true; }, - (err: HttpErrorResponse) => { + () => { this._router.navigate(['/not-found']); } ); @@ -68,7 +67,7 @@ export class CommentPageComponent implements OnInit { if (newMessage !== '' && newMessage !== this.comment.message) { console.log(this.commentId); this._commentService.putCommentWithSessionStorageRequest(this.commentId, this.comment.postId, newMessage).subscribe( - (result: object) => { + () => { this.reloadPage(); } ); @@ -79,7 +78,7 @@ export class CommentPageComponent implements OnInit { deleteComment(): void { this._commentService.deleteCommentWithSessionStorage(this.commentId).subscribe( - (result: object) => { + () => { this.toPost(); } ); diff --git a/src/app/components/feed/feed.component.ts b/src/app/components/feed/feed.component.ts index b412b3c..eaa0ef1 100644 --- a/src/app/components/feed/feed.component.ts +++ b/src/app/components/feed/feed.component.ts @@ -4,7 +4,6 @@ import { Router } from '@angular/router'; import { User } from 'src/models/identity/user'; import { UserService } from '../../services/user.service'; import { AppConstants } from 'src/app/app-constants.module'; -import { HttpErrorResponse } from '@angular/common/http'; import { FeedService } from 'src/app/services/feed.service'; import { Post } from 'src/models/post'; import { FormBuilder, FormControl, FormGroup } from '@angular/forms'; @@ -55,7 +54,7 @@ export class FeedComponent implements OnInit { Object.assign(this.user, res); this.loadFeed(); }, - (err: HttpErrorResponse) => { + () => { this.logout(); } ); @@ -67,7 +66,7 @@ export class FeedComponent implements OnInit { this.posts.push(...Object.values(result)[0]); this.finishUserLoading(); }, - (err) => { + () => { this.finishUserLoading(); } ); @@ -104,10 +103,10 @@ export class FeedComponent implements OnInit { this.dataArrived = false; this._postService.createPostWithSessionStorageRequest(postMessage, this.files).subscribe( - (result: object) => { + () => { this.goToProfile(); }, - (err: HttpErrorResponse) => { + () => { this.dataArrived = true; } ); diff --git a/src/app/components/post-page/post-page.component.ts b/src/app/components/post-page/post-page.component.ts index 3218a19..1ac89f4 100644 --- a/src/app/components/post-page/post-page.component.ts +++ b/src/app/components/post-page/post-page.component.ts @@ -1,4 +1,3 @@ -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'; @@ -53,7 +52,7 @@ export class PostPageComponent implements OnInit { this.dataArrived = true; } }, - (err: HttpErrorResponse) => { + () => { this._router.navigate(['/not-found']); } ); @@ -120,7 +119,7 @@ export class PostPageComponent implements OnInit { if (newMessage === '' && newMessage !== this.post.message) { this._postService.putPostWithSessionStorageRequest(this.postId, newMessage, this.files).subscribe( - (result: object) => { + () => { this.reloadPage(); } ); @@ -139,7 +138,7 @@ export class PostPageComponent implements OnInit { 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(); } @@ -149,7 +148,7 @@ export class PostPageComponent implements OnInit { deletePost(): void { this._postService.deletePostWithSessionStorage(this.postId).subscribe( - (result: object) => { + () => { this._router.navigate(['/profile/' + this._tokenService.getUsernameFromSessionStorageToken()]); } ); diff --git a/src/app/components/profile-settings/profile-settings.component.ts b/src/app/components/profile-settings/profile-settings.component.ts index a484665..f3cd4c1 100644 --- a/src/app/components/profile-settings/profile-settings.component.ts +++ b/src/app/components/profile-settings/profile-settings.component.ts @@ -56,7 +56,7 @@ export class ProfileSettingsComponent implements OnInit { this.isAdminUser = this.user.roles.map(x => x.name).includes(AppConstants.ADMIN_ROLE_NAME); this.finishUserLoading(); }, - (err: HttpErrorResponse) => { + () => { this._router.navigate(['/not-found']); } ); @@ -89,7 +89,7 @@ export class ProfileSettingsComponent implements OnInit { this.goToProfile(); } }, - (err: HttpErrorResponse) => { + () => { this.logout(); } ); @@ -181,7 +181,7 @@ export class ProfileSettingsComponent implements OnInit { } this._userService.putProfilePictureFromSessionStorageRequest(this.newProfilePicture).subscribe( - (result: object) => { + () => { this.reloadPage(); } ); @@ -196,7 +196,7 @@ export class ProfileSettingsComponent implements OnInit { this.patchTechnologiesControl(); this._userService.putUserFromSessionStorageRequest(this.updateUserFormGroup, this.user.roles, this.user.friends).subscribe( - (result: object) => { + () => { this._successBar.showMsg('Profile updated successfully!'); }, (err: HttpErrorResponse) => { @@ -285,7 +285,7 @@ export class ProfileSettingsComponent implements OnInit { deleteAccount(): void { if (this.deleteAccountConfirm) { this._userService.deleteUserFromSessionStorageRequest().subscribe( - (res: object) => { + () => { this.logout(); }, (err: HttpErrorResponse) => { diff --git a/src/app/components/profile/profile.component.ts b/src/app/components/profile/profile.component.ts index bbf8585..eaa1bec 100644 --- a/src/app/components/profile/profile.component.ts +++ b/src/app/components/profile/profile.component.ts @@ -3,7 +3,6 @@ import { Router } from '@angular/router'; import { UserService } from 'src/app/services/user.service'; import { User } from 'src/models/identity/user'; import { AppConstants } from 'src/app/app-constants.module'; -import { HttpErrorResponse } from '@angular/common/http'; import { Location } from '@angular/common'; import { LanguageService } from 'src/app/services/language.service'; import { TechnologyService } from 'src/app/services/technology.service'; @@ -38,10 +37,6 @@ export class ProfileComponent implements OnInit { this._titleService.setTitle(this._title); } - private setDefaultUser(): void { - this.user = this._userService.getDefaultUser(); - } - ngOnInit(): void { this._urlUsername = this._router.url.substring(9); @@ -63,7 +58,7 @@ export class ProfileComponent implements OnInit { this.isAdminUser = this.user.roles.map(x => x.name).includes(AppConstants.ADMIN_ROLE_NAME); this.loadLanguages(); }, - (err: HttpErrorResponse) => { + () => { this._router.navigate(['/not-found']); } ); @@ -102,7 +97,7 @@ export class ProfileComponent implements OnInit { this.userPosts.push(...resultArr); this.finishUserLoading(); }, - (err: HttpErrorResponse) => { + () => { this._currentPage = -1; this.finishUserLoading(); } @@ -126,7 +121,7 @@ export class ProfileComponent implements OnInit { } this.dataArrived = true; }, - (err: HttpErrorResponse) => { + () => { this.logout(); } ); @@ -175,10 +170,10 @@ export class ProfileComponent implements OnInit { } this._userService.putBareUserFromSessionStorageRequest(loggedInUser, this.updateFrienship.get('password')?.value).subscribe( - (resultUpdate: object) => { + () => { this.reloadPage(); }, - (err: HttpErrorResponse) => { + () => { this._router.navigate(['/']); } ); -- cgit v1.2.3 From ca7e618ca3350a5cf200ae39c851b016c9088d41 Mon Sep 17 00:00:00 2001 From: transtrike Date: Thu, 25 Feb 2021 20:51:24 +0200 Subject: Footer added; Pages fucked up --- src/app/app.module.ts | 4 +- .../admin-panel-page.component.html | 154 +++++++++++--- .../comment-page/comment-page.component.html | 19 +- src/app/components/feed/feed.component.html | 71 +++++-- src/app/components/footer/footer.component.css | 20 ++ src/app/components/footer/footer.component.html | 12 ++ src/app/components/footer/footer.component.ts | 18 ++ src/app/components/login/login.component.html | 40 +++- .../components/not-found/not-found.component.html | 15 +- .../components/post-page/post-page.component.html | 63 ++++-- .../profile-settings.component.html | 234 +++++++++++++++++---- src/app/components/profile/profile.component.html | 67 ++++-- .../components/register/register.component.html | 134 ++++++++++-- src/styles.css | 103 ++++----- src/theme.scss | 14 -- 15 files changed, 755 insertions(+), 213 deletions(-) create mode 100644 src/app/components/footer/footer.component.css create mode 100644 src/app/components/footer/footer.component.html create mode 100644 src/app/components/footer/footer.component.ts delete mode 100644 src/theme.scss (limited to 'src/app/components') diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 1bf44ad..e331a5d 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -25,6 +25,7 @@ import { CommentComponent } from './components/comment/comment.component'; import { CommentPageComponent } from './components/comment-page/comment-page.component'; import { PostAttachmentComponent } from './components/post-attachment/post-attachment.component'; import { RouterModule } from '@angular/router'; +import { FooterComponent } from './components/footer/footer.component'; @NgModule({ declarations: [ @@ -43,7 +44,8 @@ import { RouterModule } from '@angular/router'; AdminPanelPageComponent, CommentComponent, CommentPageComponent, - PostAttachmentComponent + PostAttachmentComponent, + FooterComponent ], imports: [ BrowserModule.withServerTransition({ appId: 'serverApp' }), diff --git a/src/app/components/admin-panel-page/admin-panel-page.component.html b/src/app/components/admin-panel-page/admin-panel-page.component.html index 31f0849..0c0954a 100644 --- a/src/app/components/admin-panel-page/admin-panel-page.component.html +++ b/src/app/components/admin-panel-page/admin-panel-page.component.html @@ -2,84 +2,182 @@
-
+
- - + +
- +
- - + +
- +
-
+
Available languages:
-
+
{{ lang.name }}
-
+
- -
+ +
- +
- - + +
- +
- -
+ +
Available technologies:
-
+
{{ tech.name }}
-
+
- -
+ +
- +
- +
- +
-
+
+
diff --git a/src/app/components/comment-page/comment-page.component.html b/src/app/components/comment-page/comment-page.component.html index ae114da..d59c956 100644 --- a/src/app/components/comment-page/comment-page.component.html +++ b/src/app/components/comment-page/comment-page.component.html @@ -2,15 +2,26 @@
-
- + +
+
diff --git a/src/app/components/feed/feed.component.html b/src/app/components/feed/feed.component.html index 230c27b..7f3cb68 100644 --- a/src/app/components/feed/feed.component.html +++ b/src/app/components/feed/feed.component.html @@ -3,41 +3,81 @@
-
+
- None of your friends have posted anything yet!
+ None of your friends have posted anything yet!
Try refreshing your page!
@@ -45,4 +85,5 @@
+
diff --git a/src/app/components/footer/footer.component.css b/src/app/components/footer/footer.component.css new file mode 100644 index 0000000..b93e1f3 --- /dev/null +++ b/src/app/components/footer/footer.component.css @@ -0,0 +1,20 @@ +footer { + display: flex; + width: 100%; +} + +footer > * { + flex: 1; +} + +#version { + text-align: left; +} + +#middle-footer-message { + text-align: center; +} + +#license { + text-align: right; +} diff --git a/src/app/components/footer/footer.component.html b/src/app/components/footer/footer.component.html new file mode 100644 index 0000000..d410597 --- /dev/null +++ b/src/app/components/footer/footer.component.html @@ -0,0 +1,12 @@ + diff --git a/src/app/components/footer/footer.component.ts b/src/app/components/footer/footer.component.ts new file mode 100644 index 0000000..e83f840 --- /dev/null +++ b/src/app/components/footer/footer.component.ts @@ -0,0 +1,18 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-footer', + templateUrl: './footer.component.html', + styleUrls: ['./footer.component.css'] +}) +export class FooterComponent implements OnInit { + public version: string = "v0.1"; + public licenseUrl: string = "https://github.com/Team-Kaleidoscope/DevHive-Angular/blob/main/LICENSE"; + public organizationUrl: string = "https://github.com/Team-Kaleidoscope"; + + constructor() { } + + ngOnInit(): void { + } + +} diff --git a/src/app/components/login/login.component.html b/src/app/components/login/login.component.html index 9f74faa..d4f956d 100644 --- a/src/app/components/login/login.component.html +++ b/src/app/components/login/login.component.html @@ -2,29 +2,55 @@ Login
-
+
- +
- +
- +
- +
-
+
- + + diff --git a/src/app/components/not-found/not-found.component.html b/src/app/components/not-found/not-found.component.html index 83d73ce..4588d2c 100644 --- a/src/app/components/not-found/not-found.component.html +++ b/src/app/components/not-found/not-found.component.html @@ -1,10 +1,13 @@
- - Page not found! - -
+ Page not found! +
+
diff --git a/src/app/components/post-page/post-page.component.html b/src/app/components/post-page/post-page.component.html index b8e7e22..9781c18 100644 --- a/src/app/components/post-page/post-page.component.html +++ b/src/app/components/post-page/post-page.component.html @@ -2,36 +2,75 @@
- +
-
- - - + + + +
- {{ file.name ? file.name : 'Attachment' }} -
+ {{ file.name ? file.name : "Attachment" }} +
☒
- +
+
diff --git a/src/app/components/profile-settings/profile-settings.component.html b/src/app/components/profile-settings/profile-settings.component.html index 502697d..f5f19bd 100644 --- a/src/app/components/profile-settings/profile-settings.component.html +++ b/src/app/components/profile-settings/profile-settings.component.html @@ -3,114 +3,276 @@
-
+
-
- + +
- +
- +
-
-
+
+
- +
- - + +
- +
- - + +
- +
- - + +
- +
- - + +
- +
- - - + + +
- +
- +
- +
Available languages:
-
+
{{ lang.name }}
- +
- +
- +
Available technologies:
-
+
{{ tech.name }}
- + -
+
- Are you sure you want to delete your account?
This is permanent! + Are you sure you want to delete your account?
This is + permanent!
- +
+
diff --git a/src/app/components/profile/profile.component.html b/src/app/components/profile/profile.component.html index 0e5f633..0d9dc6a 100644 --- a/src/app/components/profile/profile.component.html +++ b/src/app/components/profile/profile.component.html @@ -3,25 +3,48 @@
-
+
- +
-
- {{ user.firstName }} {{ user.lastName }} -
-
- @{{ user.userName }} -
-
- -
- +
{{ user.firstName }} {{ user.lastName }}
+
@{{ user.userName }}
+ + +
+
@@ -32,9 +55,7 @@ {{ lang.name }}
-
-  None -
+
 None
Technologies: @@ -43,18 +64,18 @@ {{ tech.name }}
-
-  None -
+
 None
-
+
- {{ user.firstName }} {{ user.lastName }} hasn't posted anything yet! + {{ user.firstName }} {{ user.lastName }} hasn't posted anything + yet!
+ diff --git a/src/app/components/register/register.component.html b/src/app/components/register/register.component.html index 0075b1d..c521d44 100644 --- a/src/app/components/register/register.component.html +++ b/src/app/components/register/register.component.html @@ -2,64 +2,160 @@ Register
-
+
- +
- - + +
- +
- - + +
- +
- - + +
- +
- - + +
- +
- - - + + +
-
+
- + + diff --git a/src/styles.css b/src/styles.css index eeb93fe..b215190 100644 --- a/src/styles.css +++ b/src/styles.css @@ -9,24 +9,27 @@ --failure: indianred; } -html, body { - height: 100%; - margin: 0; +html, +body { + height: 100%; + margin: 0; } body { font: 21px sans-serif !important; background-color: var(--bg-color); } -input:focus, button:focus { +input:focus, +button:focus { outline: 0; } -#content { /* Used for the login and register pages */ +#content { + /* Used for the login and register pages */ height: 100%; max-width: 20em; box-sizing: border-box; - border: .5em solid var(--bg-color); + border: 0.5em solid var(--bg-color); margin: 0 auto; @@ -36,10 +39,15 @@ input:focus, button:focus { flex-direction: column; } +#content > *:first-child, +#content > *:last-child { + flex: 1; +} + .rounded-border { border: 2px solid black; - border-radius: .6em; - padding: .4em; + border-radius: 0.6em; + padding: 0.4em; } .round-image { @@ -62,22 +70,23 @@ input:focus, button:focus { overflow-y: auto; } - /* Hide scrollbar for Chrome, Safari and Opera */ +/* Hide scrollbar for Chrome, Safari and Opera */ .scroll-standalone::-webkit-scrollbar { display: none; } - /* Hide scrollbar for IE, Edge and Firefox */ +/* Hide scrollbar for IE, Edge and Firefox */ .scroll-standalone { - -ms-overflow-style: none; /* IE and Edge */ - scrollbar-width: none; /* Firefox */ + -ms-overflow-style: none; /* IE and Edge */ + scrollbar-width: none; /* Firefox */ } -.user-language, .user-technology { - border-radius: .4em; +.user-language, +.user-technology { + border-radius: 0.4em; background-color: lightgrey; - padding: .26em; - margin: .1em .2em; + padding: 0.26em; + margin: 0.1em 0.2em; width: fit-content; } @@ -85,10 +94,10 @@ input:focus, button:focus { .input-selection { position: relative; - margin-top: .7em; + margin-top: 0.7em; } - /* Don't show the placeholder when the label is on top +/* Don't show the placeholder when the label is on top */ .input-selection .input-field::-webkit-input-placeholder { opacity: 0; @@ -102,8 +111,8 @@ input:focus, button:focus { border-bottom: 1px solid grey; box-sizing: border-box; - margin-bottom: .5em; - padding: .4em; + margin-bottom: 0.5em; + padding: 0.4em; padding-left: 0; font-size: inherit; @@ -115,22 +124,22 @@ input:focus, button:focus { position: absolute; left: 0; - margin-top: .4em; + margin-top: 0.4em; color: grey; } - /* When hovering, typing or having typed something in an input, +/* When hovering, typing or having typed something in an input, * make the label smaller, color it and then move it up */ -.input-selection:hover > .input-field-label , -.input-selection > input:not(:placeholder-shown) + .input-field-label , +.input-selection:hover > .input-field-label, +.input-selection > input:not(:placeholder-shown) + .input-field-label, .input-selection > input:focus + .input-field-label { - font-size: .7em; + font-size: 0.7em; color: var(--focus-color); transform: translate(0, -1.2em); } - /* Show the placeholder, when you've hovered or +/* Show the placeholder, when you've hovered or * focused (typing in) on the input-field */ .input-selection:hover > .input-field::-webkit-input-placeholder, @@ -138,7 +147,7 @@ input:focus, button:focus { opacity: 1; } - /* Make the underline thicker and change it's and the cursors's +/* Make the underline thicker and change it's and the cursors's * color when hovered or focused (typing in) on the input-field */ .input-selection:hover > .input-field, @@ -149,19 +158,18 @@ input:focus, button:focus { margin-top: -1px !important; } - /* Input errors */ .input-errors { - margin-top: -.8em; - font-size: .7em; + margin-top: -0.8em; + font-size: 0.7em; position: absolute; right: 0; top: 0; } - /* Move the errors above the input when +/* Move the errors above the input when * using the site on a small screen and * add some space for them above the input */ @@ -175,7 +183,7 @@ input:focus, button:focus { } .input-errors > .error { - margin-left: .3em; + margin-left: 0.3em; } .input-field:focus ~ .input-errors > .error { @@ -194,14 +202,14 @@ input:focus, button:focus { background-color: black; border: 2px solid black; - border-radius: .4em; + border-radius: 0.4em; box-sizing: border-box; - font-size: .8em; + font-size: 0.8em; text-align: center; - margin-top: .5em; - padding: .3em; + margin-top: 0.5em; + padding: 0.3em; } .submit-btn:hover { @@ -213,7 +221,7 @@ input:focus, button:focus { .submit-btn:active { transition: 0s; - transform: scale(.9); + transform: scale(0.9); } .delete-btn:hover { @@ -227,16 +235,16 @@ input:focus, button:focus { display: flex; flex-wrap: wrap; color: gray; - font-size: .75em; - margin: 0 .3em; + font-size: 0.75em; + margin: 0 0.3em; } .form-attachment { border: 2px solid black; - border-radius: .6em; - margin-top: .2em; - margin-right: .2em; - padding: .2em; + border-radius: 0.6em; + margin-top: 0.2em; + margin-right: 0.2em; + padding: 0.2em; display: flex; align-items: center; } @@ -246,12 +254,12 @@ input:focus, button:focus { } .remove-form-attachment { - font-size: .9em; + font-size: 0.9em; color: var(--failure); background-color: white; - border-radius: .2em; - margin: 0 .2em; - padding: .2em; + border-radius: 0.2em; + margin: 0 0.2em; + padding: 0.2em; } .remove-form-attachment:hover { @@ -259,4 +267,3 @@ input:focus, button:focus { background-color: var(--failure); cursor: pointer; } - diff --git a/src/theme.scss b/src/theme.scss deleted file mode 100644 index a87ae45..0000000 --- a/src/theme.scss +++ /dev/null @@ -1,14 +0,0 @@ -// Import theming functions -@import '~@angular/material/theming'; -@import './styles.css'; -@include mat-core(); - -// Custom Angular theme - -// $my-custom-primary: mat-palette($mat-deep-purple); -// $my-custom-accent: mat-palette($mat-pink, 100, 500, A100); -// $my-custom-warn: mat-palette($mat-lime); - -// $my-custom-theme: mat-light-theme($my-custom-primary, $my-custom-accent, $my-custom-warn); - -// @include angular-material-theme($my-custom-theme); \ No newline at end of file -- cgit v1.2.3 From b3c37ed5528cbef77f3914c41b2bbf22bed9fb9b Mon Sep 17 00:00:00 2001 From: Syndamia Date: Thu, 4 Mar 2021 16:57:51 +0200 Subject: Fixed styling of input fields on non-chromium based browser (FireFox) --- .../profile-settings.component.css | 13 ----- src/styles.css | 62 +++++++++++----------- 2 files changed, 32 insertions(+), 43 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/profile-settings/profile-settings.component.css b/src/app/components/profile-settings/profile-settings.component.css index 1c07d9f..5da2bf2 100644 --- a/src/app/components/profile-settings/profile-settings.component.css +++ b/src/app/components/profile-settings/profile-settings.component.css @@ -73,19 +73,6 @@ hr { margin-top: 1.1em; } -.input-field { - border-color: var(--focus-color) !important; - caret-color: var(--focus-color); - border-width: 2px !important; - margin-top: -1px !important; -} - -.input-field-label { - font-size: .7em; - color: var(--focus-color); - transform: translate(0, -1.2em); -} - #all-languages, #all-technologies { display: flex; flex-wrap: wrap; diff --git a/src/styles.css b/src/styles.css index b215190..725eee4 100644 --- a/src/styles.css +++ b/src/styles.css @@ -92,17 +92,6 @@ button:focus { /* Inputs, the type found in login and register */ -.input-selection { - position: relative; - margin-top: 0.7em; -} - -/* Don't show the placeholder when the label is on top - */ -.input-selection .input-field::-webkit-input-placeholder { - opacity: 0; -} - .input-field { width: 100%; background-color: var(--bg-color); @@ -126,36 +115,49 @@ button:focus { margin-top: 0.4em; color: grey; + + transition: 0.2s; + scale: 1em; } -/* When hovering, typing or having typed something in an input, - * make the label smaller, color it and then move it up - */ -.input-selection:hover > .input-field-label, -.input-selection > input:not(:placeholder-shown) + .input-field-label, -.input-selection > input:focus + .input-field-label { - font-size: 0.7em; - color: var(--focus-color); - transform: translate(0, -1.2em); +.input-selection { + position: relative; + margin-top: 0.7em; +} + +.input-selection input::placeholder { + /* Don't show the placeholder when the label is on top */ + opacity: 0; + color: grey; } -/* Show the placeholder, when you've hovered or - * focused (typing in) on the input-field +.input-selection:hover > input::placeholder, +.input-selection > input:focus::placeholder { + /* When hovering on the input, or when having clicked on it, + * show the placeholder */ -.input-selection:hover > .input-field::-webkit-input-placeholder, -.input-selection > .input-field:focus::-webkit-input-placeholder { opacity: 1; } -/* Make the underline thicker and change it's and the cursors's - * color when hovered or focused (typing in) on the input-field +.input-selection:hover > label, +.input-selection > input:not(:placeholder-shown) + label, +.input-selection > input:focus + label { + /* When hovering, typing or having typed something in an input, + * make the label smaller, color it and then move it up */ -.input-selection:hover > .input-field, -.input-field:focus { + font-size: 0.7em; + color: var(--focus-color); + transform: translate(0, -1.2em); +} + +.input-selection:hover > input, +.input-selection > input:focus { + /* When hovering or clicked on it, make it the focus color */ border-color: var(--focus-color) !important; caret-color: var(--focus-color); - border-width: 2px !important; - margin-top: -1px !important; + /* When hovering or clicked on it, make the bottom border wider (taller) */ + border-width: 2px; + padding-bottom: calc(0.4em - 1px); } /* Input errors */ -- cgit v1.2.3 From c7b4f0eb3493ffbaa330aa67762355dbf37ec008 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Thu, 4 Mar 2021 16:58:35 +0200 Subject: Fixed sizing twitch of input fields on non-chromium based browsers (FireFox) --- src/app/components/login/login.component.css | 8 ++++---- src/app/components/register/register.component.css | 8 ++++---- src/styles.css | 2 +- 3 files changed, 9 insertions(+), 9 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/login/login.component.css b/src/app/components/login/login.component.css index 766522e..103f5c0 100644 --- a/src/app/components/login/login.component.css +++ b/src/app/components/login/login.component.css @@ -1,7 +1,3 @@ -* { - transition: .2s; -} - form { width: 100%; } @@ -12,6 +8,10 @@ form { box-sizing: border-box; } +.submit-btn { + transition: 0.2s; +} + .input-selection:nth-of-type(1) { margin-top: 1.2em; } diff --git a/src/app/components/register/register.component.css b/src/app/components/register/register.component.css index 93d8006..973c6f0 100644 --- a/src/app/components/register/register.component.css +++ b/src/app/components/register/register.component.css @@ -1,9 +1,5 @@ /* A lot of stuff are moved to the global styles! */ -* { - transition: 0.2s; -} - form { width: 100%; } @@ -20,6 +16,10 @@ form { box-sizing: border-box; } +.submit-btn { + transition: 0.2s; +} + .input-selection:nth-of-type(1) { margin-top: 1.2em; } diff --git a/src/styles.css b/src/styles.css index 725eee4..ae70525 100644 --- a/src/styles.css +++ b/src/styles.css @@ -222,7 +222,7 @@ button:focus { } .submit-btn:active { - transition: 0s; + transition: 0s !important; transform: scale(0.9); } -- cgit v1.2.3 From 777432d8c3a429214caab66864eab141370d3d72 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Thu, 4 Mar 2021 16:59:20 +0200 Subject: Fixed file upload button being visible on FireFox --- src/app/components/profile-settings/profile-settings.component.css | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) (limited to 'src/app/components') diff --git a/src/app/components/profile-settings/profile-settings.component.css b/src/app/components/profile-settings/profile-settings.component.css index 5da2bf2..a10d9c6 100644 --- a/src/app/components/profile-settings/profile-settings.component.css +++ b/src/app/components/profile-settings/profile-settings.component.css @@ -65,7 +65,8 @@ hr { cursor: pointer; } -#upload-file > input::-webkit-file-upload-button { +#upload-file > input::-webkit-file-upload-button, +#upload-file > input::file-selector-button { visibility: hidden; } -- cgit v1.2.3 From 6c52fd1199525a63dd5bed80a8609b96510282aa Mon Sep 17 00:00:00 2001 From: Syndamia Date: Thu, 4 Mar 2021 17:03:13 +0200 Subject: Made file input hide it's button part of the global styling --- src/app/components/feed/feed.component.css | 4 ---- src/app/components/profile-settings/profile-settings.component.css | 5 ----- src/styles.css | 5 +++++ 3 files changed, 5 insertions(+), 9 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/feed/feed.component.css b/src/app/components/feed/feed.component.css index 23a70d5..3d22349 100644 --- a/src/app/components/feed/feed.component.css +++ b/src/app/components/feed/feed.component.css @@ -136,10 +136,6 @@ cursor: pointer; } -#file-upload::-webkit-file-upload-button { - visibility: hidden; -} - #attachment-img { height: 1.5em; width: 1.5em; diff --git a/src/app/components/profile-settings/profile-settings.component.css b/src/app/components/profile-settings/profile-settings.component.css index a10d9c6..347c650 100644 --- a/src/app/components/profile-settings/profile-settings.component.css +++ b/src/app/components/profile-settings/profile-settings.component.css @@ -65,11 +65,6 @@ hr { cursor: pointer; } -#upload-file > input::-webkit-file-upload-button, -#upload-file > input::file-selector-button { - visibility: hidden; -} - #update-user { margin-top: 1.1em; } diff --git a/src/styles.css b/src/styles.css index ae70525..cc92d4d 100644 --- a/src/styles.css +++ b/src/styles.css @@ -24,6 +24,11 @@ button:focus { outline: 0; } +input[type=file]::-webkit-file-upload-button, +input[type=file]::file-selector-button { + visibility: hidden; +} + #content { /* Used for the login and register pages */ height: 100%; -- cgit v1.2.3 From 4b094fb29ea7eaeb58f0c29df60e55586a74db76 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Sat, 6 Mar 2021 14:29:14 +0200 Subject: Reverted footer --- src/app/app.module.ts | 4 +- .../admin-panel-page.component.html | 154 +++----------- .../comment-page/comment-page.component.html | 19 +- src/app/components/feed/feed.component.html | 71 ++----- src/app/components/footer/footer.component.css | 20 -- src/app/components/footer/footer.component.html | 12 -- src/app/components/footer/footer.component.ts | 18 -- src/app/components/login/login.component.html | 40 +--- .../components/not-found/not-found.component.html | 15 +- .../components/post-page/post-page.component.html | 63 ++---- .../profile-settings.component.html | 234 ++++----------------- src/app/components/profile/profile.component.html | 67 ++---- .../components/register/register.component.html | 134 ++---------- 13 files changed, 151 insertions(+), 700 deletions(-) delete mode 100644 src/app/components/footer/footer.component.css delete mode 100644 src/app/components/footer/footer.component.html delete mode 100644 src/app/components/footer/footer.component.ts (limited to 'src/app/components') diff --git a/src/app/app.module.ts b/src/app/app.module.ts index e331a5d..1bf44ad 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -25,7 +25,6 @@ import { CommentComponent } from './components/comment/comment.component'; import { CommentPageComponent } from './components/comment-page/comment-page.component'; import { PostAttachmentComponent } from './components/post-attachment/post-attachment.component'; import { RouterModule } from '@angular/router'; -import { FooterComponent } from './components/footer/footer.component'; @NgModule({ declarations: [ @@ -44,8 +43,7 @@ import { FooterComponent } from './components/footer/footer.component'; AdminPanelPageComponent, CommentComponent, CommentPageComponent, - PostAttachmentComponent, - FooterComponent + PostAttachmentComponent ], imports: [ BrowserModule.withServerTransition({ appId: 'serverApp' }), diff --git a/src/app/components/admin-panel-page/admin-panel-page.component.html b/src/app/components/admin-panel-page/admin-panel-page.component.html index 0c0954a..31f0849 100644 --- a/src/app/components/admin-panel-page/admin-panel-page.component.html +++ b/src/app/components/admin-panel-page/admin-panel-page.component.html @@ -2,182 +2,84 @@
-
+
- -
+ +
- +
- - + +
- +
-
+
Available languages:
-
+
{{ lang.name }}
-
+
- -
+ +
- +
- - + +
- +
- -
+ +
Available technologies:
-
+
{{ tech.name }}
-
+
- -
+ +
- +
- +
- +
-
+
-
diff --git a/src/app/components/comment-page/comment-page.component.html b/src/app/components/comment-page/comment-page.component.html index d59c956..ae114da 100644 --- a/src/app/components/comment-page/comment-page.component.html +++ b/src/app/components/comment-page/comment-page.component.html @@ -2,26 +2,15 @@
-
- + +
-
diff --git a/src/app/components/feed/feed.component.html b/src/app/components/feed/feed.component.html index 7f3cb68..230c27b 100644 --- a/src/app/components/feed/feed.component.html +++ b/src/app/components/feed/feed.component.html @@ -3,81 +3,41 @@
-
+
- None of your friends have posted anything yet!
+ None of your friends have posted anything yet!
Try refreshing your page!
@@ -85,5 +45,4 @@
-
diff --git a/src/app/components/footer/footer.component.css b/src/app/components/footer/footer.component.css deleted file mode 100644 index b93e1f3..0000000 --- a/src/app/components/footer/footer.component.css +++ /dev/null @@ -1,20 +0,0 @@ -footer { - display: flex; - width: 100%; -} - -footer > * { - flex: 1; -} - -#version { - text-align: left; -} - -#middle-footer-message { - text-align: center; -} - -#license { - text-align: right; -} diff --git a/src/app/components/footer/footer.component.html b/src/app/components/footer/footer.component.html deleted file mode 100644 index d410597..0000000 --- a/src/app/components/footer/footer.component.html +++ /dev/null @@ -1,12 +0,0 @@ - diff --git a/src/app/components/footer/footer.component.ts b/src/app/components/footer/footer.component.ts deleted file mode 100644 index e83f840..0000000 --- a/src/app/components/footer/footer.component.ts +++ /dev/null @@ -1,18 +0,0 @@ -import { Component, OnInit } from '@angular/core'; - -@Component({ - selector: 'app-footer', - templateUrl: './footer.component.html', - styleUrls: ['./footer.component.css'] -}) -export class FooterComponent implements OnInit { - public version: string = "v0.1"; - public licenseUrl: string = "https://github.com/Team-Kaleidoscope/DevHive-Angular/blob/main/LICENSE"; - public organizationUrl: string = "https://github.com/Team-Kaleidoscope"; - - constructor() { } - - ngOnInit(): void { - } - -} diff --git a/src/app/components/login/login.component.html b/src/app/components/login/login.component.html index d4f956d..9f74faa 100644 --- a/src/app/components/login/login.component.html +++ b/src/app/components/login/login.component.html @@ -2,55 +2,29 @@ Login
-
+
- +
- +
- +
- +
-
+
- - + diff --git a/src/app/components/not-found/not-found.component.html b/src/app/components/not-found/not-found.component.html index 4588d2c..83d73ce 100644 --- a/src/app/components/not-found/not-found.component.html +++ b/src/app/components/not-found/not-found.component.html @@ -1,13 +1,10 @@
- Page not found! -
+ + Page not found! + +
-
diff --git a/src/app/components/post-page/post-page.component.html b/src/app/components/post-page/post-page.component.html index 9781c18..b8e7e22 100644 --- a/src/app/components/post-page/post-page.component.html +++ b/src/app/components/post-page/post-page.component.html @@ -2,75 +2,36 @@
- +
-
- - - + + + +
- {{ file.name ? file.name : "Attachment" }} -
+ {{ file.name ? file.name : 'Attachment' }} +
☒
- +
-
diff --git a/src/app/components/profile-settings/profile-settings.component.html b/src/app/components/profile-settings/profile-settings.component.html index f5f19bd..502697d 100644 --- a/src/app/components/profile-settings/profile-settings.component.html +++ b/src/app/components/profile-settings/profile-settings.component.html @@ -3,276 +3,114 @@
-
+
-
- + +
- +
- +
-
-
+
+
- +
- - + +
- +
- - + +
- +
- - + +
- +
- - + +
- +
- - - + + +
- +
- +
- +
Available languages:
-
+
{{ lang.name }}
- +
- +
- +
Available technologies:
-
+
{{ tech.name }}
- + -
+
- Are you sure you want to delete your account?
This is - permanent! + Are you sure you want to delete your account?
This is permanent!
- +
-
diff --git a/src/app/components/profile/profile.component.html b/src/app/components/profile/profile.component.html index 0d9dc6a..0e5f633 100644 --- a/src/app/components/profile/profile.component.html +++ b/src/app/components/profile/profile.component.html @@ -3,48 +3,25 @@
-
+
- +
-
{{ user.firstName }} {{ user.lastName }}
-
@{{ user.userName }}
-
- -
- +
+ {{ user.firstName }} {{ user.lastName }} +
+
+ @{{ user.userName }} +
+ + +
+
@@ -55,7 +32,9 @@ {{ lang.name }}
-
 None
+
+  None +
Technologies: @@ -64,18 +43,18 @@ {{ tech.name }}
-
 None
+
+  None +
-
+
- {{ user.firstName }} {{ user.lastName }} hasn't posted anything - yet! + {{ user.firstName }} {{ user.lastName }} hasn't posted anything yet!
- diff --git a/src/app/components/register/register.component.html b/src/app/components/register/register.component.html index c521d44..0075b1d 100644 --- a/src/app/components/register/register.component.html +++ b/src/app/components/register/register.component.html @@ -2,160 +2,64 @@ Register
-
+
- +
- - + +
- +
- - + +
- +
- - + +
- +
- - + +
- +
- - - + + +
-
+
- - + -- cgit v1.2.3 From 1f008dfc777022582e5e0cf0823175e66c2790cf Mon Sep 17 00:00:00 2001 From: Danail Dimitrov Date: Sat, 6 Mar 2021 14:43:32 +0200 Subject: starting development of rating system --- .vs/DevHive-Angular/config/applicationhost.config | 1021 +++++++++++++++++++++ .vs/DevHive-Angular/v16/.suo | Bin 0 -> 23552 bytes .vs/ProjectSettings.json | 3 + .vs/VSWorkspaceState.json | 8 + .vs/slnx.sqlite | Bin 0 -> 155648 bytes src/app/components/post/post.component.css | 5 - src/app/components/post/post.component.html | 2 +- src/app/components/post/post.component.ts | 7 +- src/app/services/rating.service.ts | 17 + 9 files changed, 1056 insertions(+), 7 deletions(-) create mode 100644 .vs/DevHive-Angular/config/applicationhost.config create mode 100644 .vs/DevHive-Angular/v16/.suo create mode 100644 .vs/ProjectSettings.json create mode 100644 .vs/VSWorkspaceState.json create mode 100644 .vs/slnx.sqlite create mode 100644 src/app/services/rating.service.ts (limited to 'src/app/components') diff --git a/.vs/DevHive-Angular/config/applicationhost.config b/.vs/DevHive-Angular/config/applicationhost.config new file mode 100644 index 0000000..269dc55 --- /dev/null +++ b/.vs/DevHive-Angular/config/applicationhost.config @@ -0,0 +1,1021 @@ + + + + + + + + +
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+ +
+
+
+
+
+
+ +
+
+
+
+
+ +
+
+
+ +
+
+ +
+
+ +
+
+
+ + +
+
+
+
+
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/.vs/DevHive-Angular/v16/.suo b/.vs/DevHive-Angular/v16/.suo new file mode 100644 index 0000000..6166dc6 Binary files /dev/null and b/.vs/DevHive-Angular/v16/.suo differ diff --git a/.vs/ProjectSettings.json b/.vs/ProjectSettings.json new file mode 100644 index 0000000..f8b4888 --- /dev/null +++ b/.vs/ProjectSettings.json @@ -0,0 +1,3 @@ +{ + "CurrentProjectSetting": null +} \ No newline at end of file diff --git a/.vs/VSWorkspaceState.json b/.vs/VSWorkspaceState.json new file mode 100644 index 0000000..5023c47 --- /dev/null +++ b/.vs/VSWorkspaceState.json @@ -0,0 +1,8 @@ +{ + "ExpandedNodes": [ + "", + "\\src" + ], + "SelectedNode": "\\src\\main.ts", + "PreviewInSolutionExplorer": false +} \ No newline at end of file diff --git a/.vs/slnx.sqlite b/.vs/slnx.sqlite new file mode 100644 index 0000000..fb0acc2 Binary files /dev/null and b/.vs/slnx.sqlite differ diff --git a/src/app/components/post/post.component.css b/src/app/components/post/post.component.css index 1b88c7d..07d931f 100644 --- a/src/app/components/post/post.component.css +++ b/src/app/components/post/post.component.css @@ -76,11 +76,6 @@ hr { /* Rating */ -/* Temporary, until ratings are implemented fully */ -.rating { - display: none !important; -} - .rating { display: flex; flex-direction: column; diff --git a/src/app/components/post/post.component.html b/src/app/components/post/post.component.html index 4ba4d43..4584591 100644 --- a/src/app/components/post/post.component.html +++ b/src/app/components/post/post.component.html @@ -30,7 +30,7 @@
- diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index 387f56f..39391ad 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -2,6 +2,7 @@ import { Component, Input, OnInit } from '@angular/core'; import { Router } from '@angular/router'; import { Guid } from 'guid-typescript'; import { PostService } from 'src/app/services/post.service'; +import { RatingService } from 'src/app/services/rating.service'; import { UserService } from 'src/app/services/user.service'; import { User } from 'src/models/identity/user'; import { Post } from 'src/models/post'; @@ -19,7 +20,7 @@ export class PostComponent implements OnInit { public timeCreated: string; @Input() paramId: string; - constructor(private _postService: PostService, private _userService: UserService, private _router: Router) + constructor(private _postService: PostService, private _ratingServe: RatingService, private _userService: UserService, private _router: Router) { } ngOnInit(): void { @@ -54,4 +55,8 @@ export class PostComponent implements OnInit { goToPostPage(): void { this._router.navigate(['/post/' + this.post.postId]); } + + upVotePost(): void { + + } } diff --git a/src/app/services/rating.service.ts b/src/app/services/rating.service.ts new file mode 100644 index 0000000..630a43c --- /dev/null +++ b/src/app/services/rating.service.ts @@ -0,0 +1,17 @@ +import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http'; +import { Injectable } from '@angular/core'; +import * as FormData from 'form-data'; +import { Guid } from 'guid-typescript'; +import { Observable } from 'rxjs'; +import { Post } from 'src/models/post'; +import { AppConstants } from '../app-constants.module'; +import { TokenService } from './token.service'; + + +@Injectable({ + providedIn: 'root' +}) +export class RatingService { + constructor(private _http: HttpClient, private _tokenService: TokenService) + { } +} -- cgit v1.2.3 From fe4c9eaeac345c63e0c08c43b9dc3185d07716e8 Mon Sep 17 00:00:00 2001 From: Danail Dimitrov Date: Thu, 11 Mar 2021 21:09:47 +0200 Subject: Post rating shows current rating(not static number) --- .vs/DevHive-Angular/v16/.suo | Bin 23552 -> 32256 bytes .vs/VSWorkspaceState.json | 9 +++++++-- .vs/slnx.sqlite | Bin 155648 -> 167936 bytes src/app/components/post/post.component.ts | 2 +- src/models/post.ts | 11 ++++++++++- 5 files changed, 18 insertions(+), 4 deletions(-) (limited to 'src/app/components') diff --git a/.vs/DevHive-Angular/v16/.suo b/.vs/DevHive-Angular/v16/.suo index 6166dc6..c5248df 100644 Binary files a/.vs/DevHive-Angular/v16/.suo and b/.vs/DevHive-Angular/v16/.suo differ diff --git a/.vs/VSWorkspaceState.json b/.vs/VSWorkspaceState.json index 5023c47..6e9e1ba 100644 --- a/.vs/VSWorkspaceState.json +++ b/.vs/VSWorkspaceState.json @@ -1,8 +1,13 @@ { "ExpandedNodes": [ "", - "\\src" + "\\e2e\\src", + "\\src", + "\\src\\app", + "\\src\\app\\components", + "\\src\\app\\components\\post", + "\\src\\app\\services" ], - "SelectedNode": "\\src\\main.ts", + "SelectedNode": "\\src\\app\\services\\rating.service.ts", "PreviewInSolutionExplorer": false } \ No newline at end of file diff --git a/.vs/slnx.sqlite b/.vs/slnx.sqlite index fb0acc2..d413bfa 100644 Binary files a/.vs/slnx.sqlite and b/.vs/slnx.sqlite differ diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index 39391ad..f813d8c 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -31,7 +31,7 @@ export class PostComponent implements OnInit { (result: object) => { Object.assign(this.post, result); this.post.fileURLs = Object.values(result)[7]; - this.votesNumber = 23; + this.votesNumber = this.post.currentRating; this.timeCreated = new Date(this.post.timeCreated).toLocaleString('en-GB'); this.loadUser(); diff --git a/src/models/post.ts b/src/models/post.ts index 8e58bea..8c1890a 100644 --- a/src/models/post.ts +++ b/src/models/post.ts @@ -11,8 +11,9 @@ export class Post { private _timeCreated: Date; private _comments: PostComment[]; private _fileURLs: string[]; + private _currentRating: number; - constructor(postId: Guid, creatorFirstName: string, creatorLastName: string, creatorUsername: string, message: string, timeCreated: Date, comments: PostComment[], fileURLs: string[]) { + constructor(postId: Guid, creatorFirstName: string, creatorLastName: string, creatorUsername: string, message: string, timeCreated: Date, comments: PostComment[], fileURLs: string[], currentRating: number) { this.postId = postId; this.creatorFirstName = creatorFirstName; this.creatorLastName = creatorLastName; @@ -21,6 +22,7 @@ export class Post { this.timeCreated = timeCreated; this.comments = comments; this.fileURLs = fileURLs; + this.currentRating = currentRating; } public get postId(): Guid { @@ -78,4 +80,11 @@ export class Post { public set fileURLs(v: string[]) { this._fileURLs = v; } + + public get currentRating(): number { + return this._currentRating; + } + public set currentRating(v: number) { + this._currentRating = v; + } } -- cgit v1.2.3 From 051da12e0edd5408c902695fbc45ddd15d7972b1 Mon Sep 17 00:00:00 2001 From: Danail Dimitrov Date: Thu, 11 Mar 2021 21:57:16 +0200 Subject: added upvote post functionality --- .vs/DevHive-Angular/v16/.suo | Bin 32256 -> 32256 bytes .vs/slnx.sqlite | Bin 167936 -> 167936 bytes src/app/app-constants.module.ts | 1 + src/app/components/post/post.component.ts | 17 +++++++++++++++-- src/app/services/post.service.ts | 2 +- src/app/services/rating.service.ts | 20 ++++++++++++++++++++ 6 files changed, 37 insertions(+), 3 deletions(-) (limited to 'src/app/components') diff --git a/.vs/DevHive-Angular/v16/.suo b/.vs/DevHive-Angular/v16/.suo index c5248df..eb32805 100644 Binary files a/.vs/DevHive-Angular/v16/.suo and b/.vs/DevHive-Angular/v16/.suo differ diff --git a/.vs/slnx.sqlite b/.vs/slnx.sqlite index d413bfa..a563275 100644 Binary files a/.vs/slnx.sqlite and b/.vs/slnx.sqlite differ diff --git a/src/app/app-constants.module.ts b/src/app/app-constants.module.ts index d72af53..f8722f7 100644 --- a/src/app/app-constants.module.ts +++ b/src/app/app-constants.module.ts @@ -9,6 +9,7 @@ export class AppConstants { public static API_TECHNOLOGY_URL = AppConstants.BASE_API_URL + '/Technology'; public static API_POST_URL = AppConstants.BASE_API_URL + '/Post'; + public static API_RATING_URL = AppConstants.BASE_API_URL + '/Rating'; public static API_FEED_URL = AppConstants.BASE_API_URL + '/Feed'; public static API_COMMENT_URL = AppConstants.BASE_API_URL + '/Comment'; diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index f813d8c..0f48337 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -6,6 +6,7 @@ import { RatingService } from 'src/app/services/rating.service'; import { UserService } from 'src/app/services/user.service'; import { User } from 'src/models/identity/user'; import { Post } from 'src/models/post'; +import { TokenService } from '../../services/token.service'; @Component({ selector: 'app-post', @@ -19,11 +20,14 @@ export class PostComponent implements OnInit { public votesNumber: number; public timeCreated: string; @Input() paramId: string; + public loggedIn = false; - constructor(private _postService: PostService, private _ratingServe: RatingService, private _userService: UserService, private _router: Router) + constructor(private _postService: PostService, private _ratingServe: RatingService, private _userService: UserService, private _router: Router, private _tokenService: TokenService) { } ngOnInit(): void { + this.loggedIn = this._tokenService.getTokenFromSessionStorage() !== ''; + this.post = this._postService.getDefaultPost(); this.user = this._userService.getDefaultUser(); @@ -57,6 +61,15 @@ export class PostComponent implements OnInit { } upVotePost(): void { - + if (!this.loggedIn) { + this._router.navigate(['/login']); + return; + } + + this._ratingServe.createRatingWithSessionStorageRequest(Guid.parse(this.paramId), true).subscribe( + () => { + this.votesNumber++; + } + ); } } diff --git a/src/app/services/post.service.ts b/src/app/services/post.service.ts index 7b2a539..d582085 100644 --- a/src/app/services/post.service.ts +++ b/src/app/services/post.service.ts @@ -15,7 +15,7 @@ export class PostService { { } getDefaultPost(): Post { - return new Post(Guid.createEmpty(), 'Gosho', 'Trapov', 'gosho_trapov', 'Your opinion on my idea?', new Date(), [], []); + return new Post(Guid.createEmpty(), 'Gosho', 'Trapov', 'gosho_trapov', 'Your opinion on my idea?', new Date(), [], [], 0); } /* Requests from session storage */ diff --git a/src/app/services/rating.service.ts b/src/app/services/rating.service.ts index 630a43c..5a86b67 100644 --- a/src/app/services/rating.service.ts +++ b/src/app/services/rating.service.ts @@ -14,4 +14,24 @@ import { TokenService } from './token.service'; export class RatingService { constructor(private _http: HttpClient, private _tokenService: TokenService) { } + + createRatingWithSessionStorageRequest(postId: Guid, isLike: boolean): Observable { + const userId = this._tokenService.getUserIdFromSessionStorageToken(); + const token = this._tokenService.getTokenFromSessionStorage(); + + return this.createRatingRequest(userId, token, postId, isLike); + } + + createRatingRequest(userId: Guid, authToken: string, postId: Guid, isLike: boolean): Observable { + const body = { + postId: postId.toString(), + isLike: isLike + }; + const options = { + params: new HttpParams().set('UserId', userId.toString()), + headers: new HttpHeaders().set('Authorization', 'Bearer ' + authToken) + }; + + return this._http.post(AppConstants.API_RATING_URL, body, options); + } } -- cgit v1.2.3 From afeba5e832d87bc659d72e7d945a78821bd7e7b8 Mon Sep 17 00:00:00 2001 From: Danail Dimitrov Date: Fri, 12 Mar 2021 21:16:34 +0200 Subject: adding downVote functionality --- .vs/DevHive-Angular/v16/.suo | Bin 32256 -> 52736 bytes .vs/VSWorkspaceState.json | 5 ++-- .vs/slnx.sqlite | Bin 167936 -> 167936 bytes src/app/components/post/post.component.html | 2 +- src/app/components/post/post.component.ts | 35 ++++++++++++++++++++++++++++ src/app/services/rating.service.ts | 27 +++++++++++++++++---- 6 files changed, 61 insertions(+), 8 deletions(-) (limited to 'src/app/components') diff --git a/.vs/DevHive-Angular/v16/.suo b/.vs/DevHive-Angular/v16/.suo index eb32805..ceaae10 100644 Binary files a/.vs/DevHive-Angular/v16/.suo and b/.vs/DevHive-Angular/v16/.suo differ diff --git a/.vs/VSWorkspaceState.json b/.vs/VSWorkspaceState.json index 6e9e1ba..c78c053 100644 --- a/.vs/VSWorkspaceState.json +++ b/.vs/VSWorkspaceState.json @@ -1,12 +1,11 @@ { "ExpandedNodes": [ "", - "\\e2e\\src", "\\src", "\\src\\app", "\\src\\app\\components", - "\\src\\app\\components\\post", - "\\src\\app\\services" + "\\src\\app\\services", + "\\src\\models" ], "SelectedNode": "\\src\\app\\services\\rating.service.ts", "PreviewInSolutionExplorer": false diff --git a/.vs/slnx.sqlite b/.vs/slnx.sqlite index a563275..5dcda80 100644 Binary files a/.vs/slnx.sqlite and b/.vs/slnx.sqlite differ diff --git a/src/app/components/post/post.component.html b/src/app/components/post/post.component.html index 4584591..830fa75 100644 --- a/src/app/components/post/post.component.html +++ b/src/app/components/post/post.component.html @@ -36,7 +36,7 @@ {{ votesNumber }} - diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index 0f48337..168b6a3 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -66,10 +66,45 @@ export class PostComponent implements OnInit { return; } + this._ratingServe.putRatingWithSessionStorageRequest(Guid.parse(this.paramId), true).subscribe( + () => { + this.votesNumber += 2; + }, + () => { + this.crateUpVoteRating(); + } + ); + } + + crateUpVoteRating(): void { this._ratingServe.createRatingWithSessionStorageRequest(Guid.parse(this.paramId), true).subscribe( () => { this.votesNumber++; } ); } + + downVotePost(): void { + if (!this.loggedIn) { + this._router.navigate(['/login']); + return; + } + + this._ratingServe.putRatingWithSessionStorageRequest(Guid.parse(this.paramId), false).subscribe( + () => { + this.votesNumber -= 2; + }, + () => { + this.crateDownVoteRating(); + } + ); + } + + crateDownVoteRating(): void { + this._ratingServe.createRatingWithSessionStorageRequest(Guid.parse(this.paramId), false).subscribe( + () => { + this.votesNumber--; + } + ); + } } diff --git a/src/app/services/rating.service.ts b/src/app/services/rating.service.ts index 5a86b67..9403575 100644 --- a/src/app/services/rating.service.ts +++ b/src/app/services/rating.service.ts @@ -22,16 +22,35 @@ export class RatingService { return this.createRatingRequest(userId, token, postId, isLike); } + putRatingWithSessionStorageRequest(postId: Guid, isLike: boolean): Observable { + const userId = this._tokenService.getUserIdFromSessionStorageToken(); + const token = this._tokenService.getTokenFromSessionStorage(); + + return this.putRatingRequest(userId, token, postId, isLike); + } + createRatingRequest(userId: Guid, authToken: string, postId: Guid, isLike: boolean): Observable { + const options = { + params: new HttpParams().set('UserId', userId.toString()), + headers: new HttpHeaders().set('Authorization', 'Bearer ' + authToken) + }; const body = { postId: postId.toString(), isLike: isLike - }; + }; + + return this._http.post(AppConstants.API_RATING_URL, body, options); + } + + putRatingRequest(userId: Guid, authToken: string, postId: Guid, isLike: boolean): Observable { const options = { - params: new HttpParams().set('UserId', userId.toString()), - headers: new HttpHeaders().set('Authorization', 'Bearer ' + authToken) + params: new HttpParams().set('UserId', userId.toString()).set('PostId', postId.toString()), + headers: new HttpHeaders().set('Authorization', 'Bearer ' + authToken) + }; + const body = { + isLike: isLike }; - return this._http.post(AppConstants.API_RATING_URL, body, options); + return this._http.put(AppConstants.API_RATING_URL, body, options); } } -- cgit v1.2.3 From 2ea7a39c3f8eaf90ec28f8fd6fc465f215a0d99b Mon Sep 17 00:00:00 2001 From: Danail Dimitrov Date: Sat, 13 Mar 2021 11:46:57 +0200 Subject: upVote functionality is finished --- .vs/DevHive-Angular/v16/.suo | Bin 52736 -> 62976 bytes .vs/VSWorkspaceState.json | 3 +- .vs/slnx.sqlite | Bin 167936 -> 167936 bytes src/app/components/post/post.component.ts | 71 ++++++++++++++++++++---------- src/app/services/rating.service.ts | 18 +++++++- 5 files changed, 66 insertions(+), 26 deletions(-) (limited to 'src/app/components') diff --git a/.vs/DevHive-Angular/v16/.suo b/.vs/DevHive-Angular/v16/.suo index ceaae10..6b50c82 100644 Binary files a/.vs/DevHive-Angular/v16/.suo and b/.vs/DevHive-Angular/v16/.suo differ diff --git a/.vs/VSWorkspaceState.json b/.vs/VSWorkspaceState.json index c78c053..9d81b57 100644 --- a/.vs/VSWorkspaceState.json +++ b/.vs/VSWorkspaceState.json @@ -4,9 +4,10 @@ "\\src", "\\src\\app", "\\src\\app\\components", + "\\src\\app\\components\\post", "\\src\\app\\services", "\\src\\models" ], - "SelectedNode": "\\src\\app\\services\\rating.service.ts", + "SelectedNode": "\\src\\app\\components\\post\\post.component.ts", "PreviewInSolutionExplorer": false } \ No newline at end of file diff --git a/.vs/slnx.sqlite b/.vs/slnx.sqlite index 9e7e654..e79a43d 100644 Binary files a/.vs/slnx.sqlite and b/.vs/slnx.sqlite differ diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index 168b6a3..68bf161 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -22,8 +22,7 @@ export class PostComponent implements OnInit { @Input() paramId: string; public loggedIn = false; - constructor(private _postService: PostService, private _ratingServe: RatingService, private _userService: UserService, private _router: Router, private _tokenService: TokenService) - { } + constructor(private _postService: PostService, private _ratingServe: RatingService, private _userService: UserService, private _router: Router, private _tokenService: TokenService) { } ngOnInit(): void { this.loggedIn = this._tokenService.getTokenFromSessionStorage() !== ''; @@ -66,45 +65,69 @@ export class PostComponent implements OnInit { return; } - this._ratingServe.putRatingWithSessionStorageRequest(Guid.parse(this.paramId), true).subscribe( - () => { - this.votesNumber += 2; + this._ratingServe.getRatingByUserAndPostWithSessionStorageRequest(Guid.parse(this.paramId)).subscribe( + (x: object) => { + if (Object.values(x)[3]) { + this.deleteUpVoteRating(Object.values(x)[0]); + } + else { + this.putUpVoteRating(); + } }, () => { this.crateUpVoteRating(); } - ); - } - - crateUpVoteRating(): void { - this._ratingServe.createRatingWithSessionStorageRequest(Guid.parse(this.paramId), true).subscribe( - () => { - this.votesNumber++; - } ); } - - downVotePost(): void { - if (!this.loggedIn) { - this._router.navigate(['/login']); - return; + + crateUpVoteRating(): void { + this._ratingServe.createRatingWithSessionStorageRequest(Guid.parse(this.paramId), true).subscribe( + () => { + this.votesNumber++; } + ); +} - this._ratingServe.putRatingWithSessionStorageRequest(Guid.parse(this.paramId), false).subscribe( + putUpVoteRating(): void { + this._ratingServe.putRatingWithSessionStorageRequest(Guid.parse(this.paramId), true).subscribe( () => { - this.votesNumber -= 2; + this.votesNumber += 2; }, () => { - this.crateDownVoteRating(); + this.crateUpVoteRating(); } - ); + ); } - crateDownVoteRating(): void { - this._ratingServe.createRatingWithSessionStorageRequest(Guid.parse(this.paramId), false).subscribe( + deleteUpVoteRating(ratingId: string): void { + this._ratingServe.deleteRatingFromSessionStorageRequest(Guid.parse(ratingId)).subscribe( () => { this.votesNumber--; } ); } + + downVotePost(): void { + if(!this.loggedIn) { + this._router.navigate(['/login']); + return; +} + +this._ratingServe.putRatingWithSessionStorageRequest(Guid.parse(this.paramId), false).subscribe( + () => { + this.votesNumber -= 2; + }, + () => { + this.crateDownVoteRating(); + } +); + } + + crateDownVoteRating(): void { + this._ratingServe.createRatingWithSessionStorageRequest(Guid.parse(this.paramId), false).subscribe( + () => { + this.votesNumber--; + } + ); +} } diff --git a/src/app/services/rating.service.ts b/src/app/services/rating.service.ts index f3e3265..58ff1f4 100644 --- a/src/app/services/rating.service.ts +++ b/src/app/services/rating.service.ts @@ -36,6 +36,13 @@ export class RatingService { return this.getRatingByUserAndPostRequest(userId, token, postId); } + deleteRatingFromSessionStorageRequest(ratingId: Guid): Observable { + const userId = this._tokenService.getUserIdFromSessionStorageToken(); + const token = this._tokenService.getTokenFromSessionStorage(); + + return this.deleteRatingRequest(userId, token, ratingId); + } + createRatingRequest(userId: Guid, authToken: string, postId: Guid, isLike: boolean): Observable { const options = { params: new HttpParams().set('UserId', userId.toString()), @@ -67,6 +74,15 @@ export class RatingService { headers: new HttpHeaders().set('Authorization', 'Bearer ' + authToken) }; - return this._http.get(AppConstants.API_RATING_URL + 'GetByUserAndPost', options); + return this._http.get(AppConstants.API_RATING_URL + '/GetByUserAndPost', options); + } + + deleteRatingRequest(userId: Guid, authToken: string, ratingId: Guid): Observable { + const options = { + params: new HttpParams().set('UserId', userId.toString()).set('RatingId', ratingId.toString()), + headers: new HttpHeaders().set('Authorization', 'Bearer ' + authToken) + }; + + return this._http.delete(AppConstants.API_RATING_URL, options); } } -- cgit v1.2.3 From 98d4f0e3a0fc8fd8d753617a2b681a18f8a60e2b Mon Sep 17 00:00:00 2001 From: Danail Dimitrov Date: Sat, 13 Mar 2021 12:02:56 +0200 Subject: adding downVote functionality --- .vs/slnx.sqlite | Bin 167936 -> 167936 bytes src/app/components/post/post.component.ts | 75 ++++++++++++++---------------- 2 files changed, 35 insertions(+), 40 deletions(-) (limited to 'src/app/components') diff --git a/.vs/slnx.sqlite b/.vs/slnx.sqlite index e79a43d..2061481 100644 Binary files a/.vs/slnx.sqlite and b/.vs/slnx.sqlite differ diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index 68bf161..1ec9232 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -68,66 +68,61 @@ export class PostComponent implements OnInit { this._ratingServe.getRatingByUserAndPostWithSessionStorageRequest(Guid.parse(this.paramId)).subscribe( (x: object) => { if (Object.values(x)[3]) { - this.deleteUpVoteRating(Object.values(x)[0]); + this.deleteRating(Object.values(x)[0], true); } else { - this.putUpVoteRating(); + this.putRating(true); } }, () => { - this.crateUpVoteRating(); + this.crateRating(true); } ); } - - crateUpVoteRating(): void { - this._ratingServe.createRatingWithSessionStorageRequest(Guid.parse(this.paramId), true).subscribe( - () => { - this.votesNumber++; + + downVotePost(): void { + if (!this.loggedIn) { + this._router.navigate(['/login']); + return; } - ); -} - putUpVoteRating(): void { - this._ratingServe.putRatingWithSessionStorageRequest(Guid.parse(this.paramId), true).subscribe( - () => { - this.votesNumber += 2; + this._ratingServe.getRatingByUserAndPostWithSessionStorageRequest(Guid.parse(this.paramId)).subscribe( + (x: object) => { + if (!Object.values(x)[3]) { + this.deleteRating(Object.values(x)[0], false); + } + else { + this.putRating(false); + } }, () => { - this.crateUpVoteRating(); + this.crateRating(false); } ); } - deleteUpVoteRating(ratingId: string): void { - this._ratingServe.deleteRatingFromSessionStorageRequest(Guid.parse(ratingId)).subscribe( + crateRating(isLike: boolean): void { + this._ratingServe.createRatingWithSessionStorageRequest(Guid.parse(this.paramId), isLike).subscribe( + () => { + this.votesNumber += -1 + Number(isLike) * 2; + } + ); +} + + putRating(isLike: boolean): void { + this._ratingServe.putRatingWithSessionStorageRequest(Guid.parse(this.paramId), isLike).subscribe( () => { - this.votesNumber--; + // when false -2 + 0 wjen true -2 + 4 + this.votesNumber += -2 + Number(isLike) * 4; } ); } - downVotePost(): void { - if(!this.loggedIn) { - this._router.navigate(['/login']); - return; -} - -this._ratingServe.putRatingWithSessionStorageRequest(Guid.parse(this.paramId), false).subscribe( - () => { - this.votesNumber -= 2; - }, - () => { - this.crateDownVoteRating(); - } -); + deleteRating(ratingId: string, isLike: boolean): void { + this._ratingServe.deleteRatingFromSessionStorageRequest(Guid.parse(ratingId)).subscribe( + () => { + this.votesNumber += 1 - Number(isLike) * 2; + } + ); } - - crateDownVoteRating(): void { - this._ratingServe.createRatingWithSessionStorageRequest(Guid.parse(this.paramId), false).subscribe( - () => { - this.votesNumber--; - } - ); -} } -- cgit v1.2.3 From 341aafe72c96cad41bc5b8f1bdf665c4f2cd5319 Mon Sep 17 00:00:00 2001 From: Danail Dimitrov Date: Sat, 13 Mar 2021 12:08:44 +0200 Subject: improved rating system --- .vs/slnx.sqlite | Bin 167936 -> 167936 bytes src/app/components/post/post.component.html | 4 ++-- src/app/components/post/post.component.ts | 31 +++++----------------------- 3 files changed, 7 insertions(+), 28 deletions(-) (limited to 'src/app/components') diff --git a/.vs/slnx.sqlite b/.vs/slnx.sqlite index 2061481..6561dfb 100644 Binary files a/.vs/slnx.sqlite and b/.vs/slnx.sqlite differ diff --git a/src/app/components/post/post.component.html b/src/app/components/post/post.component.html index 830fa75..1603ebf 100644 --- a/src/app/components/post/post.component.html +++ b/src/app/components/post/post.component.html @@ -30,13 +30,13 @@
- {{ votesNumber }} -
diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index 1ec9232..0be3c43 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -59,7 +59,7 @@ export class PostComponent implements OnInit { this._router.navigate(['/post/' + this.post.postId]); } - upVotePost(): void { + votePost(isLike: boolean): void { if (!this.loggedIn) { this._router.navigate(['/login']); return; @@ -67,36 +67,15 @@ export class PostComponent implements OnInit { this._ratingServe.getRatingByUserAndPostWithSessionStorageRequest(Guid.parse(this.paramId)).subscribe( (x: object) => { - if (Object.values(x)[3]) { - this.deleteRating(Object.values(x)[0], true); + if (Object.values(x)[3] === isLike) { + this.deleteRating(Object.values(x)[0], isLike); } else { - this.putRating(true); + this.putRating(isLike); } }, () => { - this.crateRating(true); - } - ); - } - - downVotePost(): void { - if (!this.loggedIn) { - this._router.navigate(['/login']); - return; - } - - this._ratingServe.getRatingByUserAndPostWithSessionStorageRequest(Guid.parse(this.paramId)).subscribe( - (x: object) => { - if (!Object.values(x)[3]) { - this.deleteRating(Object.values(x)[0], false); - } - else { - this.putRating(false); - } - }, - () => { - this.crateRating(false); + this.crateRating(isLike); } ); } -- cgit v1.2.3 From 986ca08271fe0b8fed9e7934d3fd221c2e8b5495 Mon Sep 17 00:00:00 2001 From: Danail Dimitrov Date: Sat, 13 Mar 2021 12:46:13 +0200 Subject: added functionality to hightlit the rating button clicked by the user --- .vs/DevHive-Angular/v16/.suo | Bin 62976 -> 62976 bytes .vs/slnx.sqlite | Bin 167936 -> 167936 bytes src/app/components/post/post.component.ts | 21 ++++++++++++++++----- 3 files changed, 16 insertions(+), 5 deletions(-) (limited to 'src/app/components') diff --git a/.vs/DevHive-Angular/v16/.suo b/.vs/DevHive-Angular/v16/.suo index 6b50c82..7c63106 100644 Binary files a/.vs/DevHive-Angular/v16/.suo and b/.vs/DevHive-Angular/v16/.suo differ diff --git a/.vs/slnx.sqlite b/.vs/slnx.sqlite index 6561dfb..c62291d 100644 Binary files a/.vs/slnx.sqlite and b/.vs/slnx.sqlite differ diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index 0be3c43..b2742c0 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -21,6 +21,7 @@ export class PostComponent implements OnInit { public timeCreated: string; @Input() paramId: string; public loggedIn = false; + private voteBtns: HTMLCollectionOf; constructor(private _postService: PostService, private _ratingServe: RatingService, private _userService: UserService, private _router: Router, private _tokenService: TokenService) { } @@ -36,8 +37,10 @@ export class PostComponent implements OnInit { this.post.fileURLs = Object.values(result)[7]; this.votesNumber = this.post.currentRating; + this.voteBtns = document.getElementsByClassName('vote') as HTMLCollectionOf; + this.timeCreated = new Date(this.post.timeCreated).toLocaleString('en-GB'); - this.loadUser(); + this.loadUser(); } ); } @@ -69,18 +72,26 @@ export class PostComponent implements OnInit { (x: object) => { if (Object.values(x)[3] === isLike) { this.deleteRating(Object.values(x)[0], isLike); + + this.voteBtns.item(Number(!isLike))!.style.backgroundColor = 'white'; + this.voteBtns.item(Number(isLike))!.style.backgroundColor = 'white'; } else { this.putRating(isLike); + + this.voteBtns.item(Number(!isLike))!.style.backgroundColor = 'lightblue'; + this.voteBtns.item(Number(isLike))!.style.backgroundColor = 'white'; } }, () => { - this.crateRating(isLike); + this.createRating(isLike); + + this.voteBtns.item(Number(!isLike))!.style.backgroundColor = 'lightblue'; } ); } - crateRating(isLike: boolean): void { + private createRating(isLike: boolean): void { this._ratingServe.createRatingWithSessionStorageRequest(Guid.parse(this.paramId), isLike).subscribe( () => { this.votesNumber += -1 + Number(isLike) * 2; @@ -88,7 +99,7 @@ export class PostComponent implements OnInit { ); } - putRating(isLike: boolean): void { + private putRating(isLike: boolean): void { this._ratingServe.putRatingWithSessionStorageRequest(Guid.parse(this.paramId), isLike).subscribe( () => { // when false -2 + 0 wjen true -2 + 4 @@ -97,7 +108,7 @@ export class PostComponent implements OnInit { ); } - deleteRating(ratingId: string, isLike: boolean): void { + private deleteRating(ratingId: string, isLike: boolean): void { this._ratingServe.deleteRatingFromSessionStorageRequest(Guid.parse(ratingId)).subscribe( () => { this.votesNumber += 1 - Number(isLike) * 2; -- cgit v1.2.3 From 8419a8e403abf5b25e3b53655cfafabf4eb30a3e Mon Sep 17 00:00:00 2001 From: Danail Dimitrov Date: Sat, 13 Mar 2021 12:54:58 +0200 Subject: Updated the highlight functionality --- .vs/slnx.sqlite | Bin 167936 -> 167936 bytes src/app/components/post/post.component.ts | 13 ++++++++----- 2 files changed, 8 insertions(+), 5 deletions(-) (limited to 'src/app/components') diff --git a/.vs/slnx.sqlite b/.vs/slnx.sqlite index c62291d..6863014 100644 Binary files a/.vs/slnx.sqlite and b/.vs/slnx.sqlite differ diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index b2742c0..bf43a83 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -73,20 +73,18 @@ export class PostComponent implements OnInit { if (Object.values(x)[3] === isLike) { this.deleteRating(Object.values(x)[0], isLike); - this.voteBtns.item(Number(!isLike))!.style.backgroundColor = 'white'; - this.voteBtns.item(Number(isLike))!.style.backgroundColor = 'white'; + this.changeColorOfVoteButton(false, false); } else { this.putRating(isLike); - this.voteBtns.item(Number(!isLike))!.style.backgroundColor = 'lightblue'; - this.voteBtns.item(Number(isLike))!.style.backgroundColor = 'white'; + this.changeColorOfVoteButton(isLike, !isLike); } }, () => { this.createRating(isLike); - this.voteBtns.item(Number(!isLike))!.style.backgroundColor = 'lightblue'; + this.changeColorOfVoteButton(isLike, !isLike); } ); } @@ -115,4 +113,9 @@ export class PostComponent implements OnInit { } ); } + + private changeColorOfVoteButton(isUpvoted: boolean, isDownvoted: boolean): void { + this.voteBtns.item(0)!.style.backgroundColor = (isUpvoted) ? 'lightblue' : 'white'; + this.voteBtns.item(1)!.style.backgroundColor = (isDownvoted) ? 'lightblue' : 'white'; + } } -- cgit v1.2.3 From 94d421d08f24b117b58bc87799861016fbff8ec0 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Sun, 14 Mar 2021 08:31:19 +0200 Subject: Updated admin-panel-page's subscriptions to use an observer object --- .../admin-panel-page/admin-panel-page.component.ts | 116 +++++++++++---------- 1 file changed, 61 insertions(+), 55 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/admin-panel-page/admin-panel-page.component.ts b/src/app/components/admin-panel-page/admin-panel-page.component.ts index 95d69d3..d5ecc71 100644 --- a/src/app/components/admin-panel-page/admin-panel-page.component.ts +++ b/src/app/components/admin-panel-page/admin-panel-page.component.ts @@ -46,17 +46,17 @@ export class AdminPanelPageComponent implements OnInit { return; } - this._userService.getUserFromSessionStorageRequest().subscribe( - (result: object) => { + this._userService.getUserFromSessionStorageRequest().subscribe({ + next: (result: object) => { const user = result as User; if (!user.roles.map(x => x.name).includes(AppConstants.ADMIN_ROLE_NAME)) { this._router.navigate(['/login']); } }, - () => { + error: () => { this._router.navigate(['/login']); } - ); + }); this.languageForm = this._fb.group({ languageCreate: new FormControl(''), @@ -65,9 +65,11 @@ export class AdminPanelPageComponent implements OnInit { deleteLanguageName: new FormControl('') }); - this.languageForm.valueChanges.subscribe(() => { - this._successBar?.hideMsg(); - this._errorBar?.hideError(); + this.languageForm.valueChanges.subscribe({ + next: () => { + this._successBar?.hideMsg(); + this._errorBar?.hideError(); + } }); this.technologyForm = this._fb.group({ @@ -77,9 +79,11 @@ export class AdminPanelPageComponent implements OnInit { deleteTechnologyName: new FormControl('') }); - this.technologyForm.valueChanges.subscribe(() => { - this._successBar?.hideMsg(); - this._errorBar?.hideError(); + this.technologyForm.valueChanges.subscribe({ + next: () => { + this._successBar?.hideMsg(); + this._errorBar?.hideError(); + } }); this.deleteForm = this._fb.group({ @@ -88,9 +92,11 @@ export class AdminPanelPageComponent implements OnInit { deleteComment: new FormControl('') }); - this.deleteForm.valueChanges.subscribe(() => { - this._successBar?.hideMsg(); - this._errorBar?.hideError(); + this.deleteForm.valueChanges.subscribe({ + next: () => { + this._successBar?.hideMsg(); + this._errorBar?.hideError(); + } }); this.loadAvailableLanguages(); @@ -128,14 +134,14 @@ export class AdminPanelPageComponent implements OnInit { const languageCreate: string = this.languageForm.get('languageCreate')?.value; if (languageCreate !== '' && languageCreate !== null) { - this._languageService.createLanguageWithSessionStorageRequest(languageCreate.trim()).subscribe( - () => { + this._languageService.createLanguageWithSessionStorageRequest(languageCreate.trim()).subscribe({ + next: () => { this.languageModifiedSuccess('Successfully updated languages!'); }, - (err: HttpErrorResponse) => { + error: (err: HttpErrorResponse) => { this._errorBar.showError(err); } - ); + }); } } @@ -146,14 +152,14 @@ export class AdminPanelPageComponent implements OnInit { if (updateLanguageOldName !== '' && updateLanguageOldName !== null && updateLanguageNewName !== '' && updateLanguageNewName !== null) { const langId = this.availableLanguages.filter(x => x.name === updateLanguageOldName.trim())[0].id; - this._languageService.putLanguageWithSessionStorageRequest(langId, updateLanguageNewName.trim()).subscribe( - () => { + this._languageService.putLanguageWithSessionStorageRequest(langId, updateLanguageNewName.trim()).subscribe({ + next: () => { this.languageModifiedSuccess('Successfully updated languages!'); }, - (err: HttpErrorResponse) => { + error: (err: HttpErrorResponse) => { this._errorBar.showError(err); } - ); + }); } } @@ -163,14 +169,14 @@ export class AdminPanelPageComponent implements OnInit { if (deleteLanguageName !== '' && deleteLanguageName !== null) { const langId = this.availableLanguages.filter(x => x.name === deleteLanguageName.trim())[0].id; - this._languageService.deleteLanguageWithSessionStorageRequest(langId).subscribe( - () => { + this._languageService.deleteLanguageWithSessionStorageRequest(langId).subscribe({ + next: () => { this.languageModifiedSuccess('Successfully deleted language!'); }, - (err: HttpErrorResponse) => { + error: (err: HttpErrorResponse) => { this._errorBar.showError(err); } - ); + }); } } @@ -181,11 +187,11 @@ export class AdminPanelPageComponent implements OnInit { } private loadAvailableLanguages(): void { - this._languageService.getAllLanguagesWithSessionStorageRequest().subscribe( - (result: object) => { + this._languageService.getAllLanguagesWithSessionStorageRequest().subscribe({ + next: (result: object) => { this.availableLanguages = result as Language[]; } - ); + }); } // Technology modifying @@ -204,14 +210,14 @@ export class AdminPanelPageComponent implements OnInit { const technologyCreate: string = this.technologyForm.get('technologyCreate')?.value; if (technologyCreate !== '' && technologyCreate !== null) { - this._technologyService.createTechnologyWithSessionStorageRequest(technologyCreate.trim()).subscribe( - () => { + this._technologyService.createTechnologyWithSessionStorageRequest(technologyCreate.trim()).subscribe({ + next: () => { this.technologyModifiedSuccess('Successfully updated technologies!'); }, - (err: HttpErrorResponse) => { + error: (err: HttpErrorResponse) => { this._errorBar.showError(err); } - ); + }); } } @@ -222,14 +228,14 @@ export class AdminPanelPageComponent implements OnInit { if (updateTechnologyOldName !== '' && updateTechnologyOldName !== null && updateTechnologyNewName !== '' && updateTechnologyNewName !== null) { const techId = this.availableTechnologies.filter(x => x.name === updateTechnologyOldName.trim())[0].id; - this._technologyService.putTechnologyWithSessionStorageRequest(techId, updateTechnologyNewName.trim()).subscribe( - () => { + this._technologyService.putTechnologyWithSessionStorageRequest(techId, updateTechnologyNewName.trim()).subscribe({ + next: () => { this.technologyModifiedSuccess('Successfully updated technologies!'); }, - (err: HttpErrorResponse) => { + error: (err: HttpErrorResponse) => { this._errorBar.showError(err); } - ); + }); } } @@ -239,14 +245,14 @@ export class AdminPanelPageComponent implements OnInit { if (deleteTechnologyName !== '' && deleteTechnologyName !== null) { const techId = this.availableTechnologies.filter(x => x.name === deleteTechnologyName.trim())[0].id; - this._technologyService.deleteTechnologyWithSessionStorageRequest(techId).subscribe( - () => { + this._technologyService.deleteTechnologyWithSessionStorageRequest(techId).subscribe({ + next: () => { this.technologyModifiedSuccess('Successfully deleted technology!'); }, - (err: HttpErrorResponse) => { + error: (err: HttpErrorResponse) => { this._errorBar.showError(err); } - ); + }); } } @@ -257,11 +263,11 @@ export class AdminPanelPageComponent implements OnInit { } private loadAvailableTechnologies(): void { - this._technologyService.getAllTechnologiesWithSessionStorageRequest().subscribe( - (result: object) => { + this._technologyService.getAllTechnologiesWithSessionStorageRequest().subscribe({ + next: (result: object) => { this.availableTechnologies = result as Technology[]; } - ); + }); } // Deletions @@ -282,14 +288,14 @@ export class AdminPanelPageComponent implements OnInit { if (deleteUser !== '' && deleteUser !== null) { const userId: Guid = Guid.parse(deleteUser); - this._userService.deleteUserRequest(userId, this._tokenService.getTokenFromSessionStorage()).subscribe( - () => { + this._userService.deleteUserRequest(userId, this._tokenService.getTokenFromSessionStorage()).subscribe({ + next: () => { this.deletionSuccess('Successfully deleted user!'); }, - (err: HttpErrorResponse) => { + error: (err: HttpErrorResponse) => { this._errorBar.showError(err); } - ); + }); } } @@ -299,14 +305,14 @@ export class AdminPanelPageComponent implements OnInit { if (deletePost !== '' && deletePost !== null) { const postId: Guid = Guid.parse(deletePost); - this._postService.deletePostRequest(postId, this._tokenService.getTokenFromSessionStorage()).subscribe( - () => { + this._postService.deletePostRequest(postId, this._tokenService.getTokenFromSessionStorage()).subscribe({ + next: () => { this.deletionSuccess('Successfully deleted user!'); }, - (err: HttpErrorResponse) => { + error: (err: HttpErrorResponse) => { this._errorBar.showError(err); } - ); + }); } } @@ -316,14 +322,14 @@ export class AdminPanelPageComponent implements OnInit { if (deleteComment !== '' && deleteComment !== null) { const commentId: Guid = Guid.parse(deleteComment); - this._commentService.deleteCommentWithSessionStorage(commentId).subscribe( - () => { + this._commentService.deleteCommentWithSessionStorage(commentId).subscribe({ + next: () => { this.deletionSuccess('Successfully deleted comment!'); }, - (err: HttpErrorResponse) => { + error: (err: HttpErrorResponse) => { this._errorBar.showError(err); } - ); + }); } } -- cgit v1.2.3 From 807e72b990e7412bdf243095a07bd716bb93453f Mon Sep 17 00:00:00 2001 From: Syndamia Date: Sun, 14 Mar 2021 08:34:59 +0200 Subject: Updated comment and comment-page's subscriptions to use an observer object --- .../comment-page/comment-page.component.ts | 20 ++++++++++---------- src/app/components/comment/comment.component.ts | 12 ++++++------ 2 files changed, 16 insertions(+), 16 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/comment-page/comment-page.component.ts b/src/app/components/comment-page/comment-page.component.ts index 413436e..9bbdc59 100644 --- a/src/app/components/comment-page/comment-page.component.ts +++ b/src/app/components/comment-page/comment-page.component.ts @@ -32,8 +32,8 @@ export class CommentPageComponent implements OnInit { // Gets the post and the logged in user and compares them, // to determine if the current post is made by the user - this._commentService.getCommentRequest(this.commentId).subscribe( - (result: object) => { + this._commentService.getCommentRequest(this.commentId).subscribe({ + next: (result: object) => { this.comment = result as Comment; if (this.loggedIn) { this.editable = this.comment.issuerUsername === this._tokenService.getUsernameFromSessionStorageToken(); @@ -41,10 +41,10 @@ export class CommentPageComponent implements OnInit { } this.loaded = true; }, - () => { + error: () => { this._router.navigate(['/not-found']); } - ); + }); this.editCommentFormGroup = this._fb.group({ newCommentMessage: new FormControl('') @@ -66,22 +66,22 @@ export class CommentPageComponent implements OnInit { if (newMessage !== '' && newMessage !== this.comment.message) { console.log(this.commentId); - this._commentService.putCommentWithSessionStorageRequest(this.commentId, this.comment.postId, newMessage).subscribe( - () => { + this._commentService.putCommentWithSessionStorageRequest(this.commentId, this.comment.postId, newMessage).subscribe({ + next: () => { this.reloadPage(); } - ); + }); } } this.editingComment = !this.editingComment; } deleteComment(): void { - this._commentService.deleteCommentWithSessionStorage(this.commentId).subscribe( - () => { + this._commentService.deleteCommentWithSessionStorage(this.commentId).subscribe({ + next: () => { this.toPost(); } - ); + }); } private reloadPage(): void { diff --git a/src/app/components/comment/comment.component.ts b/src/app/components/comment/comment.component.ts index 5076769..d4dd9f4 100644 --- a/src/app/components/comment/comment.component.ts +++ b/src/app/components/comment/comment.component.ts @@ -25,23 +25,23 @@ export class CommentComponent implements OnInit { 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(); } - ); + }); } 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); this.loaded = true; } - ); + }); } goToAuthorProfile(): void { -- cgit v1.2.3 From c073a058bb7e97e6a9319e88f3f7765d4a466bd0 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Sun, 14 Mar 2021 08:37:10 +0200 Subject: Updated feed's subscriptions to use an observer object --- src/app/components/feed/feed.component.ts | 24 ++++++++++++------------ 1 file changed, 12 insertions(+), 12 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/feed/feed.component.ts b/src/app/components/feed/feed.component.ts index eaa0ef1..a9a042c 100644 --- a/src/app/components/feed/feed.component.ts +++ b/src/app/components/feed/feed.component.ts @@ -49,27 +49,27 @@ export class FeedComponent implements OnInit { fileUpload: new FormControl('') }); - this._userService.getUserFromSessionStorageRequest().subscribe( - (res: object) => { + this._userService.getUserFromSessionStorageRequest().subscribe({ + next: (res: object) => { Object.assign(this.user, res); this.loadFeed(); }, - () => { + error: () => { this.logout(); } - ); + }); } private loadFeed(): void { - this._feedService.getUserFeedFromSessionStorageRequest(this._currentPage++, this._timeLoaded, AppConstants.PAGE_SIZE).subscribe( - (result: object) => { + this._feedService.getUserFeedFromSessionStorageRequest(this._currentPage++, this._timeLoaded, AppConstants.PAGE_SIZE).subscribe({ + next: (result: object) => { this.posts.push(...Object.values(result)[0]); this.finishUserLoading(); }, - () => { + error: () => { this.finishUserLoading(); } - ); + }); } private finishUserLoading(): void { @@ -102,14 +102,14 @@ export class FeedComponent implements OnInit { const postMessage = this.createPostFormGroup.get('newPostMessage')?.value; this.dataArrived = false; - this._postService.createPostWithSessionStorageRequest(postMessage, this.files).subscribe( - () => { + this._postService.createPostWithSessionStorageRequest(postMessage, this.files).subscribe({ + next: () => { this.goToProfile(); }, - () => { + error: () => { this.dataArrived = true; } - ); + }); } onScroll(event: any): void { -- cgit v1.2.3 From 82594c050a9bbd1f527142ffe21e66c8c5f27ba3 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Sun, 14 Mar 2021 08:39:03 +0200 Subject: Updated login and register's subscriptions to use an observer object --- src/app/components/login/login.component.ts | 8 ++++---- src/app/components/register/register.component.ts | 8 ++++---- 2 files changed, 8 insertions(+), 8 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/login/login.component.ts b/src/app/components/login/login.component.ts index c3fb79c..f64848c 100644 --- a/src/app/components/login/login.component.ts +++ b/src/app/components/login/login.component.ts @@ -34,15 +34,15 @@ export class LoginComponent implements OnInit { onSubmit(): void { this._errorBar.hideError(); - this._userService.loginUserRequest(this.loginUserFormGroup).subscribe( - (res: object) => { + this._userService.loginUserRequest(this.loginUserFormGroup).subscribe({ + next: (res: object) => { this._tokenService.setUserTokenToSessionStorage(res); this._router.navigate(['/']); }, - (err: HttpErrorResponse) => { + error: (err: HttpErrorResponse) => { this._errorBar.showError(err); } - ); + }); } onRedirectRegister(): void { diff --git a/src/app/components/register/register.component.ts b/src/app/components/register/register.component.ts index 36eaa55..e51a365 100644 --- a/src/app/components/register/register.component.ts +++ b/src/app/components/register/register.component.ts @@ -50,15 +50,15 @@ export class RegisterComponent implements OnInit { } onSubmit(): void { - this._userService.registerUserRequest(this.registerUserFormGroup).subscribe( - res => { + this._userService.registerUserRequest(this.registerUserFormGroup).subscribe({ + next: (res: object) => { this._tokenService.setUserTokenToSessionStorage(res); this._router.navigate(['/']); }, - (err: HttpErrorResponse) => { + error: (err: HttpErrorResponse) => { this._errorBar.showError(err); } - ); + }); } onRedirectLogin(): void { this._router.navigate(['/login']); -- cgit v1.2.3 From 065bfead76fc9e94c8344d812ee7f5b214c74321 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Sun, 14 Mar 2021 08:41:52 +0200 Subject: Update post and post-page's subscriptions to use an observer object --- .../components/post-page/post-page.component.ts | 32 +++++++++++----------- src/app/components/post/post.component.ts | 12 ++++---- 2 files changed, 22 insertions(+), 22 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/post-page/post-page.component.ts b/src/app/components/post-page/post-page.component.ts index 1ac89f4..7c32ce0 100644 --- a/src/app/components/post-page/post-page.component.ts +++ b/src/app/components/post-page/post-page.component.ts @@ -37,8 +37,8 @@ export class PostPageComponent implements OnInit { // 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._postService.getPostRequest(this.postId).subscribe({ + next: (result: object) => { this.post = result as Post; this.post.fileURLs = Object.values(result)[7]; if (this.loggedIn) { @@ -52,10 +52,10 @@ export class PostPageComponent implements OnInit { this.dataArrived = true; } }, - () => { + error: () => { this._router.navigate(['/not-found']); } - ); + }); this.editPostFormGroup = this._fb.group({ newPostMessage: new FormControl(''), @@ -69,8 +69,8 @@ export class PostPageComponent implements OnInit { private loadFiles(): void { for (const fileURL of this.post.fileURLs) { - this._cloudinaryService.getFileRequest(fileURL).subscribe( - (result: object) => { + this._cloudinaryService.getFileRequest(fileURL).subscribe({ + next: (result: object) => { const file = result as File; const tmp = { name: fileURL.match('(?<=\/)(?:.(?!\/))+$')?.pop() ?? 'Attachment' @@ -83,7 +83,7 @@ export class PostPageComponent implements OnInit { this.dataArrived = true; } } - ); + }); } } @@ -118,11 +118,11 @@ export class PostPageComponent implements OnInit { const newMessage = this.editPostFormGroup.get('newPostMessage')?.value; if (newMessage === '' && newMessage !== this.post.message) { - this._postService.putPostWithSessionStorageRequest(this.postId, newMessage, this.files).subscribe( - () => { + this._postService.putPostWithSessionStorageRequest(this.postId, newMessage, this.files).subscribe({ + next: () => { this.reloadPage(); } - ); + }); this.dataArrived = false; } } @@ -137,21 +137,21 @@ export class PostPageComponent implements OnInit { const newComment = this.addCommentFormGroup.get('newComment')?.value; if (newComment !== '' && newComment !== null) { - this._commentService.createCommentWithSessionStorageRequest(this.postId, newComment).subscribe( - () => { + this._commentService.createCommentWithSessionStorageRequest(this.postId, newComment).subscribe({ + next: () => { this.editPostFormGroup.reset(); this.reloadPage(); } - ); + }); } } deletePost(): void { - this._postService.deletePostWithSessionStorage(this.postId).subscribe( - () => { + this._postService.deletePostWithSessionStorage(this.postId).subscribe({ + next: () => { this._router.navigate(['/profile/' + this._tokenService.getUsernameFromSessionStorageToken()]); } - ); + }); } private reloadPage(): void { diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index 387f56f..a46811d 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -26,8 +26,8 @@ export class PostComponent implements OnInit { this.post = this._postService.getDefaultPost(); this.user = this._userService.getDefaultUser(); - this._postService.getPostRequest(Guid.parse(this.paramId)).subscribe( - (result: object) => { + this._postService.getPostRequest(Guid.parse(this.paramId)).subscribe({ + next: (result: object) => { Object.assign(this.post, result); this.post.fileURLs = Object.values(result)[7]; this.votesNumber = 23; @@ -35,16 +35,16 @@ export class PostComponent implements OnInit { this.timeCreated = new Date(this.post.timeCreated).toLocaleString('en-GB'); this.loadUser(); } - ); + }); } private loadUser(): void { - this._userService.getUserByUsernameRequest(this.post.creatorUsername).subscribe( - (result: object) => { + this._userService.getUserByUsernameRequest(this.post.creatorUsername).subscribe({ + next: (result: object) => { Object.assign(this.user, result); this.loaded = true; } - ); + }); } goToAuthorProfile(): void { -- cgit v1.2.3 From a643d5ca122b2546a02ec06e355c0d42661fdf24 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Sun, 14 Mar 2021 08:45:45 +0200 Subject: Updated profile and profile-setting's subscriptions to use an observer object --- .../profile-settings/profile-settings.component.ts | 58 +++++++++++----------- src/app/components/profile/profile.component.ts | 38 +++++++------- 2 files changed, 49 insertions(+), 47 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/profile-settings/profile-settings.component.ts b/src/app/components/profile-settings/profile-settings.component.ts index f3cd4c1..ba1fbb6 100644 --- a/src/app/components/profile-settings/profile-settings.component.ts +++ b/src/app/components/profile-settings/profile-settings.component.ts @@ -50,35 +50,35 @@ export class ProfileSettingsComponent implements OnInit { this.availableTechnologies = []; this.newProfilePicture = new File([], ''); - this._userService.getUserByUsernameRequest(this._urlUsername).subscribe( - (res: object) => { + this._userService.getUserByUsernameRequest(this._urlUsername).subscribe({ + next: (res: object) => { Object.assign(this.user, res); this.isAdminUser = this.user.roles.map(x => x.name).includes(AppConstants.ADMIN_ROLE_NAME); this.finishUserLoading(); }, - () => { + error: () => { this._router.navigate(['/not-found']); } - ); + }); - this._languageService.getAllLanguagesWithSessionStorageRequest().subscribe( - (result: object) => { + this._languageService.getAllLanguagesWithSessionStorageRequest().subscribe({ + next: (result: object) => { this.availableLanguages = result as Language[]; } - ); - this._technologyService.getAllTechnologiesWithSessionStorageRequest().subscribe( - (result: object) => { + }); + this._technologyService.getAllTechnologiesWithSessionStorageRequest().subscribe({ + next: (result: object) => { this.availableTechnologies = result as Technology[]; } - ); + }); } private finishUserLoading(): void { if (sessionStorage.getItem('UserCred')) { const userFromToken: User = this._userService.getDefaultUser(); - this._userService.getUserFromSessionStorageRequest().subscribe( - (tokenRes: object) => { + this._userService.getUserFromSessionStorageRequest().subscribe({ + next: (tokenRes: object) => { Object.assign(userFromToken, tokenRes); if (userFromToken.userName === this._urlUsername) { @@ -89,10 +89,10 @@ export class ProfileSettingsComponent implements OnInit { this.goToProfile(); } }, - () => { + error: () => { this.logout(); } - ); + }); } else { this.goToProfile(); @@ -147,9 +147,11 @@ export class ProfileSettingsComponent implements OnInit { fileUpload: new FormControl('') }); - this.updateUserFormGroup.valueChanges.subscribe(() => { - this._successBar?.hideMsg(); - this._errorBar?.hideError(); + this.updateUserFormGroup.valueChanges.subscribe({ + next: () => { + this._successBar?.hideMsg(); + this._errorBar?.hideError(); + } }); } @@ -180,11 +182,11 @@ export class ProfileSettingsComponent implements OnInit { return; } - this._userService.putProfilePictureFromSessionStorageRequest(this.newProfilePicture).subscribe( - () => { + this._userService.putProfilePictureFromSessionStorageRequest(this.newProfilePicture).subscribe({ + next: () => { this.reloadPage(); } - ); + }); this.dataArrived = false; } @@ -195,14 +197,14 @@ export class ProfileSettingsComponent implements OnInit { this.patchLanguagesControl(); this.patchTechnologiesControl(); - this._userService.putUserFromSessionStorageRequest(this.updateUserFormGroup, this.user.roles, this.user.friends).subscribe( - () => { + this._userService.putUserFromSessionStorageRequest(this.updateUserFormGroup, this.user.roles, this.user.friends).subscribe({ + next: () => { this._successBar.showMsg('Profile updated successfully!'); }, - (err: HttpErrorResponse) => { + error: (err: HttpErrorResponse) => { this._errorBar.showError(err); } - ); + }); } private patchLanguagesControl(): void { @@ -284,14 +286,14 @@ export class ProfileSettingsComponent implements OnInit { deleteAccount(): void { if (this.deleteAccountConfirm) { - this._userService.deleteUserFromSessionStorageRequest().subscribe( - () => { + this._userService.deleteUserFromSessionStorageRequest().subscribe({ + next: () => { this.logout(); }, - (err: HttpErrorResponse) => { + error: (err: HttpErrorResponse) => { this._errorBar.showError(err); } - ); + }); this.dataArrived = false; } else { diff --git a/src/app/components/profile/profile.component.ts b/src/app/components/profile/profile.component.ts index eaa1bec..429b9b8 100644 --- a/src/app/components/profile/profile.component.ts +++ b/src/app/components/profile/profile.component.ts @@ -52,16 +52,16 @@ export class ProfileComponent implements OnInit { password: new FormControl('') }); - this._userService.getUserByUsernameRequest(this._urlUsername).subscribe( - (res: object) => { + this._userService.getUserByUsernameRequest(this._urlUsername).subscribe({ + next: (res: object) => { Object.assign(this.user, res); this.isAdminUser = this.user.roles.map(x => x.name).includes(AppConstants.ADMIN_ROLE_NAME); this.loadLanguages(); }, - () => { + error: () => { this._router.navigate(['/not-found']); } - ); + }); } private loadLanguages(): void { @@ -91,17 +91,17 @@ export class ProfileComponent implements OnInit { } private loadPosts(): void { - this._feedService.getUserPostsRequest(this.user.userName, this._currentPage++, this._timeLoaded, AppConstants.PAGE_SIZE).subscribe( - (result: object) => { + this._feedService.getUserPostsRequest(this.user.userName, this._currentPage++, this._timeLoaded, AppConstants.PAGE_SIZE).subscribe({ + next: (result: object) => { const resultArr: Post[] = Object.values(result)[0]; this.userPosts.push(...resultArr); this.finishUserLoading(); }, - () => { + error: () => { this._currentPage = -1; this.finishUserLoading(); } - ); + }); } private finishUserLoading(): void { @@ -109,8 +109,8 @@ export class ProfileComponent implements OnInit { this.isUserLoggedIn = true; const userFromToken: User = this._userService.getDefaultUser(); - this._userService.getUserFromSessionStorageRequest().subscribe( - (tokenRes: object) => { + this._userService.getUserFromSessionStorageRequest().subscribe({ + next: (tokenRes: object) => { Object.assign(userFromToken, tokenRes); if (userFromToken.friends.map(x => x.userName).includes(this._urlUsername)) { @@ -121,10 +121,10 @@ export class ProfileComponent implements OnInit { } this.dataArrived = true; }, - () => { + error: () => { this.logout(); } - ); + }); } else { this.dataArrived = true; @@ -156,8 +156,8 @@ export class ProfileComponent implements OnInit { if (this.updatingFriendship) { this.dataArrived = false; - this._userService.getUserFromSessionStorageRequest().subscribe( - (result: object) => { + this._userService.getUserFromSessionStorageRequest().subscribe({ + next: (result: object) => { const loggedInUser: User = result as User; if (this.friendOfUser) { @@ -169,16 +169,16 @@ export class ProfileComponent implements OnInit { loggedInUser.friends.push(newFriend); } - this._userService.putBareUserFromSessionStorageRequest(loggedInUser, this.updateFrienship.get('password')?.value).subscribe( - () => { + this._userService.putBareUserFromSessionStorageRequest(loggedInUser, this.updateFrienship.get('password')?.value).subscribe({ + next: () => { this.reloadPage(); }, - () => { + error: () => { this._router.navigate(['/']); } - ); + }); } - ); + }); } this.updatingFriendship = !this.updatingFriendship; } -- cgit v1.2.3 From 0d58551a6b54457fc24d926f46a6efd73e332901 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Sun, 14 Mar 2021 08:51:57 +0200 Subject: Removed unnecessary getters for form group controls from login and register components --- src/app/components/login/login.component.ts | 10 +--------- src/app/components/register/register.component.ts | 20 -------------------- 2 files changed, 1 insertion(+), 29 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/login/login.component.ts b/src/app/components/login/login.component.ts index f64848c..edbc461 100644 --- a/src/app/components/login/login.component.ts +++ b/src/app/components/login/login.component.ts @@ -1,5 +1,5 @@ import { Component, OnInit, ViewChild } from '@angular/core'; -import { FormGroup, FormBuilder, Validators, FormControl, AbstractControl } from '@angular/forms'; +import { FormGroup, FormBuilder, Validators, FormControl } from '@angular/forms'; import { Router } from '@angular/router'; import { Title } from '@angular/platform-browser'; import { UserService } from 'src/app/services/user.service'; @@ -48,12 +48,4 @@ export class LoginComponent implements OnInit { onRedirectRegister(): void { this._router.navigate(['/register']); } - - get username(): AbstractControl | null { - return this.loginUserFormGroup.get('username'); - } - - get password(): AbstractControl | null { - return this.loginUserFormGroup.get('password'); - } } diff --git a/src/app/components/register/register.component.ts b/src/app/components/register/register.component.ts index e51a365..b5800ad 100644 --- a/src/app/components/register/register.component.ts +++ b/src/app/components/register/register.component.ts @@ -63,24 +63,4 @@ export class RegisterComponent implements OnInit { onRedirectLogin(): void { this._router.navigate(['/login']); } - - get firstName(): AbstractControl | null { - return this.registerUserFormGroup.get('firstName'); - } - - get lastName(): AbstractControl | null { - return this.registerUserFormGroup.get('lastName'); - } - - get username(): AbstractControl | null { - return this.registerUserFormGroup.get('username'); - } - - get email(): AbstractControl | null { - return this.registerUserFormGroup.get('email'); - } - - get password(): AbstractControl | null { - return this.registerUserFormGroup.get('password'); - } } -- cgit v1.2.3 From 95bcb91f281049fef320c788b71b0731b4910108 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Sun, 14 Mar 2021 08:58:25 +0200 Subject: Moved a nested http request in profile component to it's own method --- src/app/components/profile/profile.component.ts | 20 ++++++++++++-------- 1 file changed, 12 insertions(+), 8 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/profile/profile.component.ts b/src/app/components/profile/profile.component.ts index 429b9b8..73e1e96 100644 --- a/src/app/components/profile/profile.component.ts +++ b/src/app/components/profile/profile.component.ts @@ -169,20 +169,24 @@ export class ProfileComponent implements OnInit { loggedInUser.friends.push(newFriend); } - this._userService.putBareUserFromSessionStorageRequest(loggedInUser, this.updateFrienship.get('password')?.value).subscribe({ - next: () => { - this.reloadPage(); - }, - error: () => { - this._router.navigate(['/']); - } - }); + this.updateUserWithNewFriends(loggedInUser); } }); } this.updatingFriendship = !this.updatingFriendship; } + private updateUserWithNewFriends(loggedInUser: User): void { + this._userService.putBareUserFromSessionStorageRequest(loggedInUser, this.updateFrienship.get('password')?.value).subscribe({ + next: () => { + this.reloadPage(); + }, + error: () => { + this._router.navigate(['/']); + } + }); + } + onScroll(event: any): void { // Detects when the element has reached the bottom, thx https://stackoverflow.com/a/50038429/12036073 if (event.target.offsetHeight + event.target.scrollTop >= event.target.scrollHeight && this._currentPage > 0) { -- cgit v1.2.3 From 8434044dcf8cec14765aa5d96072feaa2560a823 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Sun, 14 Mar 2021 09:06:08 +0200 Subject: Fixed includes (for models) of all components --- src/app/components/admin-panel-page/admin-panel-page.component.ts | 6 +++--- src/app/components/comment-page/comment-page.component.ts | 2 +- src/app/components/comment/comment.component.ts | 4 ++-- src/app/components/feed/feed.component.ts | 4 ++-- src/app/components/post-page/post-page.component.ts | 2 +- src/app/components/post/post.component.ts | 4 ++-- src/app/components/profile-settings/profile-settings.component.ts | 6 +++--- src/app/components/profile/profile.component.ts | 6 +++--- src/app/components/register/register.component.ts | 2 +- 9 files changed, 18 insertions(+), 18 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/admin-panel-page/admin-panel-page.component.ts b/src/app/components/admin-panel-page/admin-panel-page.component.ts index d5ecc71..9beb8bc 100644 --- a/src/app/components/admin-panel-page/admin-panel-page.component.ts +++ b/src/app/components/admin-panel-page/admin-panel-page.component.ts @@ -11,9 +11,9 @@ import { PostService } from 'src/app/services/post.service'; import { TechnologyService } from 'src/app/services/technology.service'; import { TokenService } from 'src/app/services/token.service'; import { UserService } from 'src/app/services/user.service'; -import { User } from 'src/models/identity/user'; -import { Language } from 'src/models/language'; -import { Technology } from 'src/models/technology'; +import { User } from 'src/models/identity/user.model'; +import { Language } from 'src/models/language.model'; +import { Technology } from 'src/models/technology.model'; import { ErrorBarComponent } from '../error-bar/error-bar.component'; import { SuccessBarComponent } from '../success-bar/success-bar.component'; diff --git a/src/app/components/comment-page/comment-page.component.ts b/src/app/components/comment-page/comment-page.component.ts index 9bbdc59..5d256bf 100644 --- a/src/app/components/comment-page/comment-page.component.ts +++ b/src/app/components/comment-page/comment-page.component.ts @@ -5,7 +5,7 @@ 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 { Comment } from 'src/models/comment'; +import { Comment } from 'src/models/comment.model'; @Component({ selector: 'app-comment-page', diff --git a/src/app/components/comment/comment.component.ts b/src/app/components/comment/comment.component.ts index d4dd9f4..7da896d 100644 --- a/src/app/components/comment/comment.component.ts +++ b/src/app/components/comment/comment.component.ts @@ -3,8 +3,8 @@ import { Router } from '@angular/router'; import { Guid } from 'guid-typescript'; import { CommentService } from 'src/app/services/comment.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', diff --git a/src/app/components/feed/feed.component.ts b/src/app/components/feed/feed.component.ts index a9a042c..895bf76 100644 --- a/src/app/components/feed/feed.component.ts +++ b/src/app/components/feed/feed.component.ts @@ -1,11 +1,11 @@ import { Component, OnInit } from '@angular/core'; import { Title } from '@angular/platform-browser'; import { Router } from '@angular/router'; -import { User } from 'src/models/identity/user'; +import { User } from 'src/models/identity/user.model'; import { UserService } from '../../services/user.service'; import { AppConstants } from 'src/app/app-constants.module'; import { FeedService } from 'src/app/services/feed.service'; -import { Post } from 'src/models/post'; +import { Post } from 'src/models/post.model'; import { FormBuilder, FormControl, FormGroup } from '@angular/forms'; import { PostService } from 'src/app/services/post.service'; import { TokenService } from 'src/app/services/token.service'; diff --git a/src/app/components/post-page/post-page.component.ts b/src/app/components/post-page/post-page.component.ts index 7c32ce0..a60f4da 100644 --- a/src/app/components/post-page/post-page.component.ts +++ b/src/app/components/post-page/post-page.component.ts @@ -6,7 +6,7 @@ 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 { Post } from 'src/models/post.model'; import { CloudinaryService } from 'src/app/services/cloudinary.service'; @Component({ diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index a46811d..fa5ac2f 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -3,8 +3,8 @@ import { Router } from '@angular/router'; import { Guid } from 'guid-typescript'; import { PostService } from 'src/app/services/post.service'; import { UserService } from 'src/app/services/user.service'; -import { User } from 'src/models/identity/user'; -import { Post } from 'src/models/post'; +import { User } from 'src/models/identity/user.model'; +import { Post } from 'src/models/post.model'; @Component({ selector: 'app-post', diff --git a/src/app/components/profile-settings/profile-settings.component.ts b/src/app/components/profile-settings/profile-settings.component.ts index ba1fbb6..b856bef 100644 --- a/src/app/components/profile-settings/profile-settings.component.ts +++ b/src/app/components/profile-settings/profile-settings.component.ts @@ -6,11 +6,11 @@ import { Router } from '@angular/router'; import { LanguageService } from 'src/app/services/language.service'; import { UserService } from 'src/app/services/user.service'; import { TechnologyService } from 'src/app/services/technology.service'; -import { User } from 'src/models/identity/user'; +import { User } from 'src/models/identity/user.model'; import { ErrorBarComponent } from '../error-bar/error-bar.component'; import { SuccessBarComponent } from '../success-bar/success-bar.component'; -import { Language } from 'src/models/language'; -import { Technology } from 'src/models/technology'; +import { Language } from 'src/models/language.model'; +import { Technology } from 'src/models/technology.model'; import { TokenService } from 'src/app/services/token.service'; import { Title } from '@angular/platform-browser'; import { AppConstants } from 'src/app/app-constants.module'; diff --git a/src/app/components/profile/profile.component.ts b/src/app/components/profile/profile.component.ts index 73e1e96..ed17f33 100644 --- a/src/app/components/profile/profile.component.ts +++ b/src/app/components/profile/profile.component.ts @@ -1,16 +1,16 @@ import { Component, OnInit } from '@angular/core'; import { Router } from '@angular/router'; import { UserService } from 'src/app/services/user.service'; -import { User } from 'src/models/identity/user'; +import { User } from 'src/models/identity/user.model'; import { AppConstants } from 'src/app/app-constants.module'; import { Location } from '@angular/common'; import { LanguageService } from 'src/app/services/language.service'; import { TechnologyService } from 'src/app/services/technology.service'; -import { Post } from 'src/models/post'; +import { Post } from 'src/models/post.model'; import { FeedService } from 'src/app/services/feed.service'; import { TokenService } from 'src/app/services/token.service'; import { Title } from '@angular/platform-browser'; -import { Friend } from 'src/models/identity/friend'; +import { Friend } from 'src/models/identity/friend.model'; import { FormBuilder, FormControl, FormGroup } from '@angular/forms'; @Component({ diff --git a/src/app/components/register/register.component.ts b/src/app/components/register/register.component.ts index b5800ad..07b8976 100644 --- a/src/app/components/register/register.component.ts +++ b/src/app/components/register/register.component.ts @@ -1,6 +1,6 @@ import { HttpErrorResponse } from '@angular/common/http'; import { Component, OnInit, ViewChild } from '@angular/core'; -import { AbstractControl, FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms'; +import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms'; import { Title } from '@angular/platform-browser'; import { Router } from '@angular/router'; import { TokenService } from 'src/app/services/token.service'; -- cgit v1.2.3 From 7752a79fe5d8dd498ba0b7a842bbae19d38bd963 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Sun, 14 Mar 2021 09:26:04 +0200 Subject: Fixed settings page having an outdated link and routing user to outdated profile page when changing username --- src/app/components/profile-settings/profile-settings.component.ts | 6 ++++++ 1 file changed, 6 insertions(+) (limited to 'src/app/components') diff --git a/src/app/components/profile-settings/profile-settings.component.ts b/src/app/components/profile-settings/profile-settings.component.ts index b856bef..b314a9a 100644 --- a/src/app/components/profile-settings/profile-settings.component.ts +++ b/src/app/components/profile-settings/profile-settings.component.ts @@ -200,6 +200,12 @@ export class ProfileSettingsComponent implements OnInit { this._userService.putUserFromSessionStorageRequest(this.updateUserFormGroup, this.user.roles, this.user.friends).subscribe({ next: () => { this._successBar.showMsg('Profile updated successfully!'); + + // "Reload" page when changing username + const newUsername = this.updateUserFormGroup.get('username')?.value; + if (newUsername !== this._urlUsername) { + this._router.navigate(['/profile/' + newUsername + '/settings']); + } }, error: (err: HttpErrorResponse) => { this._errorBar.showError(err); -- cgit v1.2.3 From 07c30c0896de316119b188c9e62f4666bf0cb2a9 Mon Sep 17 00:00:00 2001 From: Danail Dimitrov Date: Sun, 14 Mar 2021 20:03:39 +0200 Subject: added functionality to highlight buttons on init --- .vs/DevHive-Angular/v16/.suo | Bin 62976 -> 65024 bytes .vs/slnx.sqlite | Bin 167936 -> 167936 bytes src/app/components/post/post.component.ts | 24 ++++++++++++++++++++++-- 3 files changed, 22 insertions(+), 2 deletions(-) (limited to 'src/app/components') diff --git a/.vs/DevHive-Angular/v16/.suo b/.vs/DevHive-Angular/v16/.suo index 7c63106..60e79b7 100644 Binary files a/.vs/DevHive-Angular/v16/.suo and b/.vs/DevHive-Angular/v16/.suo differ diff --git a/.vs/slnx.sqlite b/.vs/slnx.sqlite index 6863014..8f7e0c6 100644 Binary files a/.vs/slnx.sqlite and b/.vs/slnx.sqlite differ diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index bf43a83..572ad9c 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -34,15 +34,23 @@ export class PostComponent implements OnInit { this._postService.getPostRequest(Guid.parse(this.paramId)).subscribe( (result: object) => { Object.assign(this.post, result); + + console.log(this.post.postId); + this.post.fileURLs = Object.values(result)[7]; this.votesNumber = this.post.currentRating; this.voteBtns = document.getElementsByClassName('vote') as HTMLCollectionOf; - this.timeCreated = new Date(this.post.timeCreated).toLocaleString('en-GB'); + this.timeCreated = new Date(this.post.timeCreated).toLocaleString('en-GB'); + this.loadUser(); } ); + + window.addEventListener("load", () => { + this.highlightButtonsOnInit(); + }); } private loadUser(): void { @@ -107,7 +115,7 @@ export class PostComponent implements OnInit { } private deleteRating(ratingId: string, isLike: boolean): void { - this._ratingServe.deleteRatingFromSessionStorageRequest(Guid.parse(ratingId)).subscribe( + this._ratingServe.deleteRatingFromSessionStorageRequest(Guid.parse(this.paramId)).subscribe( () => { this.votesNumber += 1 - Number(isLike) * 2; } @@ -118,4 +126,16 @@ export class PostComponent implements OnInit { this.voteBtns.item(0)!.style.backgroundColor = (isUpvoted) ? 'lightblue' : 'white'; this.voteBtns.item(1)!.style.backgroundColor = (isDownvoted) ? 'lightblue' : 'white'; } + + private highlightButtonsOnInit(): void { + this._ratingServe.getRatingByUserAndPostWithSessionStorageRequest(Guid.parse(this.paramId)).subscribe( + (x: object) => { + const isLike: boolean = Object.values(x)[3]; + + console.log(this.voteBtns); + + this.changeColorOfVoteButton(isLike, !isLike); + } + ); + } } -- cgit v1.2.3 From b428eaddb497ac0edc97020c310fa72eeab82e7e Mon Sep 17 00:00:00 2001 From: Danail Dimitrov Date: Sun, 14 Mar 2021 20:04:36 +0200 Subject: fixed a bug when rating should be deleted --- .vs/slnx.sqlite | Bin 167936 -> 167936 bytes src/app/components/post/post.component.ts | 2 +- 2 files changed, 1 insertion(+), 1 deletion(-) (limited to 'src/app/components') diff --git a/.vs/slnx.sqlite b/.vs/slnx.sqlite index 8f7e0c6..8b6d17b 100644 Binary files a/.vs/slnx.sqlite and b/.vs/slnx.sqlite differ diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index 572ad9c..89620d7 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -115,7 +115,7 @@ export class PostComponent implements OnInit { } private deleteRating(ratingId: string, isLike: boolean): void { - this._ratingServe.deleteRatingFromSessionStorageRequest(Guid.parse(this.paramId)).subscribe( + this._ratingServe.deleteRatingFromSessionStorageRequest(Guid.parse(ratingId)).subscribe( () => { this.votesNumber += 1 - Number(isLike) * 2; } -- cgit v1.2.3 From afe30ab78432d16c42b2f19e3bd8355e3f27a0e1 Mon Sep 17 00:00:00 2001 From: Danail Dimitrov Date: Sun, 14 Mar 2021 21:06:33 +0200 Subject: fixed rating not beeing highlighted on init and and added capability of rating to handle multiple posts --- .vs/slnx.sqlite | Bin 167936 -> 167936 bytes src/app/components/feed/feed.component.html | 4 ++-- src/app/components/post/post.component.ts | 20 ++++++++------------ src/app/components/profile/profile.component.html | 4 ++-- 4 files changed, 12 insertions(+), 16 deletions(-) (limited to 'src/app/components') diff --git a/.vs/slnx.sqlite b/.vs/slnx.sqlite index 8b6d17b..36ca8dd 100644 Binary files a/.vs/slnx.sqlite and b/.vs/slnx.sqlite differ diff --git a/src/app/components/feed/feed.component.html b/src/app/components/feed/feed.component.html index 230c27b..5ff2dca 100644 --- a/src/app/components/feed/feed.component.html +++ b/src/app/components/feed/feed.component.html @@ -40,8 +40,8 @@ None of your friends have posted anything yet!
Try refreshing your page! -
- +
+
diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index 89620d7..a38d507 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -20,6 +20,7 @@ export class PostComponent implements OnInit { public votesNumber: number; public timeCreated: string; @Input() paramId: string; + @Input() index: number; public loggedIn = false; private voteBtns: HTMLCollectionOf; @@ -33,9 +34,7 @@ export class PostComponent implements OnInit { this._postService.getPostRequest(Guid.parse(this.paramId)).subscribe( (result: object) => { - Object.assign(this.post, result); - - console.log(this.post.postId); + Object.assign(this.post, result); this.post.fileURLs = Object.values(result)[7]; this.votesNumber = this.post.currentRating; @@ -46,17 +45,16 @@ export class PostComponent implements OnInit { this.loadUser(); } - ); - - window.addEventListener("load", () => { - this.highlightButtonsOnInit(); - }); + ); } private loadUser(): void { this._userService.getUserByUsernameRequest(this.post.creatorUsername).subscribe( (result: object) => { Object.assign(this.user, result); + + this.highlightButtonsOnInit(); + this.loaded = true; } ); @@ -123,8 +121,8 @@ export class PostComponent implements OnInit { } private changeColorOfVoteButton(isUpvoted: boolean, isDownvoted: boolean): void { - this.voteBtns.item(0)!.style.backgroundColor = (isUpvoted) ? 'lightblue' : 'white'; - this.voteBtns.item(1)!.style.backgroundColor = (isDownvoted) ? 'lightblue' : 'white'; + this.voteBtns.item(this.index * 2)!.style.backgroundColor = (isUpvoted) ? 'lightblue' : 'white'; + this.voteBtns.item((this.index * 2) + 1)!.style.backgroundColor = (isDownvoted) ? 'lightblue' : 'white'; } private highlightButtonsOnInit(): void { @@ -132,8 +130,6 @@ export class PostComponent implements OnInit { (x: object) => { const isLike: boolean = Object.values(x)[3]; - console.log(this.voteBtns); - this.changeColorOfVoteButton(isLike, !isLike); } ); diff --git a/src/app/components/profile/profile.component.html b/src/app/components/profile/profile.component.html index 0e5f633..5c21cee 100644 --- a/src/app/components/profile/profile.component.html +++ b/src/app/components/profile/profile.component.html @@ -52,8 +52,8 @@
{{ user.firstName }} {{ user.lastName }} hasn't posted anything yet!
-
- +
+
-- cgit v1.2.3 From 904b618fbd00d5e21328a0e709bce3cf9f45cae1 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Sun, 14 Mar 2021 21:59:04 +0200 Subject: Fixed outdated imports in post component and rating service --- src/app/components/post/post.component.ts | 18 +++++++++--------- src/app/services/rating.service.ts | 6 ++---- 2 files changed, 11 insertions(+), 13 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index 4bb41a7..319e9cd 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -4,8 +4,8 @@ import { Guid } from 'guid-typescript'; import { PostService } from 'src/app/services/post.service'; import { RatingService } from 'src/app/services/rating.service'; import { UserService } from 'src/app/services/user.service'; -import { User } from 'src/models/identity/user'; -import { Post } from 'src/models/post'; +import { User } from 'src/models/identity/user.model'; +import { Post } from 'src/models/post.model'; import { TokenService } from '../../services/token.service'; @Component({ @@ -41,9 +41,9 @@ export class PostComponent implements OnInit { this.voteBtns = document.getElementsByClassName('vote') as HTMLCollectionOf; - this.timeCreated = new Date(this.post.timeCreated).toLocaleString('en-GB'); + this.timeCreated = new Date(this.post.timeCreated).toLocaleString('en-GB'); - this.loadUser(); + this.loadUser(); } }); } @@ -75,7 +75,7 @@ export class PostComponent implements OnInit { } this._ratingServe.getRatingByUserAndPostWithSessionStorageRequest(Guid.parse(this.paramId)).subscribe( - (x: object) => { + (x: object) => { if (Object.values(x)[3] === isLike) { this.deleteRating(Object.values(x)[0], isLike); @@ -99,14 +99,14 @@ export class PostComponent implements OnInit { this._ratingServe.createRatingWithSessionStorageRequest(Guid.parse(this.paramId), isLike).subscribe( () => { this.votesNumber += -1 + Number(isLike) * 2; - } - ); -} + } + ); + } private putRating(isLike: boolean): void { this._ratingServe.putRatingWithSessionStorageRequest(Guid.parse(this.paramId), isLike).subscribe( () => { - // when false -2 + 0 wjen true -2 + 4 + // when false -2 + 0 wjen true -2 + 4 this.votesNumber += -2 + Number(isLike) * 4; } ); diff --git a/src/app/services/rating.service.ts b/src/app/services/rating.service.ts index 58ff1f4..be35a81 100644 --- a/src/app/services/rating.service.ts +++ b/src/app/services/rating.service.ts @@ -1,9 +1,7 @@ import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http'; import { Injectable } from '@angular/core'; -import * as FormData from 'form-data'; import { Guid } from 'guid-typescript'; import { Observable } from 'rxjs'; -import { Post } from 'src/models/post'; import { AppConstants } from '../app-constants.module'; import { TokenService } from './token.service'; @@ -51,7 +49,7 @@ export class RatingService { const body = { postId: postId.toString(), isLike: isLike - }; + }; return this._http.post(AppConstants.API_RATING_URL, body, options); } @@ -61,7 +59,7 @@ export class RatingService { params: new HttpParams().set('UserId', userId.toString()).set('PostId', postId.toString()), headers: new HttpHeaders().set('Authorization', 'Bearer ' + authToken) }; - const body = { + const body = { isLike: isLike }; -- cgit v1.2.3 From 59e9970d78cc1285a42306942fc4b2d7d7a9c9bc Mon Sep 17 00:00:00 2001 From: Syndamia Date: Mon, 15 Mar 2021 09:23:32 +0200 Subject: Fixed post rating not highlighted when opening post page --- src/app/components/post-page/post-page.component.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src/app/components') diff --git a/src/app/components/post-page/post-page.component.html b/src/app/components/post-page/post-page.component.html index b8e7e22..5da8cc7 100644 --- a/src/app/components/post-page/post-page.component.html +++ b/src/app/components/post-page/post-page.component.html @@ -8,7 +8,7 @@ - +
-- cgit v1.2.3 From b33f929226e8836f1f94bdb4cc72c5b8281d76a3 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Mon, 15 Mar 2021 09:26:36 +0200 Subject: Fixed post not loading properly when user not logged in --- src/app/components/post/post.component.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) (limited to 'src/app/components') diff --git a/src/app/components/post/post.component.ts b/src/app/components/post/post.component.ts index 319e9cd..24ecdb4 100644 --- a/src/app/components/post/post.component.ts +++ b/src/app/components/post/post.component.ts @@ -53,7 +53,9 @@ export class PostComponent implements OnInit { next: (result: object) => { Object.assign(this.user, result); - this.highlightButtonsOnInit(); + if (this.loggedIn) { + this.highlightButtonsOnInit(); + } this.loaded = true; } -- cgit v1.2.3 From 5880656282edfb7dc1bb7073c20ccf74aad6a093 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Thu, 18 Mar 2021 19:50:02 +0200 Subject: Major redesign of post component styling. Added foundatinal global stylings as well as icons. --- src/app/components/post/post.component.css | 119 ++------------------- src/app/components/post/post.component.html | 84 ++++++++------- src/assets/icons/tabler-icon-calendar-time.svg | 87 +++++++++++++++ src/assets/icons/tabler-icon-chevron-down.svg | 65 +++++++++++ src/assets/icons/tabler-icon-chevron-up.svg | 65 +++++++++++ src/assets/icons/tabler-icon-link.svg | 69 ++++++++++++ src/assets/icons/tabler-icon-message-2.svg | 79 ++++++++++++++ src/styles.css | 142 ++++++++++++++++++++++++- 8 files changed, 562 insertions(+), 148 deletions(-) create mode 100644 src/assets/icons/tabler-icon-calendar-time.svg create mode 100644 src/assets/icons/tabler-icon-chevron-down.svg create mode 100644 src/assets/icons/tabler-icon-chevron-up.svg create mode 100644 src/assets/icons/tabler-icon-link.svg create mode 100644 src/assets/icons/tabler-icon-message-2.svg (limited to 'src/app/components') diff --git a/src/app/components/post/post.component.css b/src/app/components/post/post.component.css index 07d931f..52f3283 100644 --- a/src/app/components/post/post.component.css +++ b/src/app/components/post/post.component.css @@ -1,129 +1,30 @@ -.post { - display: flex; - width: 98%; - - margin: .5em auto; +.left-pane { box-sizing: border-box; - padding: .5em; - background-color: var(--card-bg); - position: relative; -} - -.post:first-child { - margin-top: 0; -} - -hr { - border: 1px solid black; - width: 90%; } /* Author */ -.author { - display: flex; - margin-bottom: .2em; -} - -.author:hover { - cursor: pointer; -} - -.author > img { +.author-picture { width: 2.2em; height: 2.2em; - margin-right: .2em; -} - -.author-info > .handle { - font-size: .9em; - color: gray; } /* Content */ .content { - flex: 1; + padding: 0 var(--card-padding); } .message { - margin: .3em 0; - word-break: break-all; -} - -.bottom-post { - font-size: .5em; - color: gray; - display: flex; - align-items: center; -} - -.separator { - margin: 0 .5em; -} - -.comment-count { - font-size: 1em; -} - -.comment-count > img { - height: .8em; -} - -.message:hover, .timestamp:hover { - cursor: pointer; -} - -/* Rating */ - -.rating { - display: flex; - flex-direction: column; - align-items: center; - min-height: 4.4em; - margin: auto -.1em auto 0; -} - -.score { - flex: 1; - display: flex; - align-items: center; -} - - -.vote { - display: flex; - align-items: center; - flex: 1; - - background: var(--card-bg); - font-size: 1em; - - border: 1px solid var(--card-bg); - box-sizing: border-box; - border-radius: .2em; - - } - -.vote:hover { - border: 1px solid var(--focus-color); - color: var(--focus-color); - cursor: pointer; -} - -/* Attachments */ - -.attachments { - display: flex; - width: 98%; - margin: -.3em auto .5em auto; - flex-wrap: wrap; + margin: 0.2em 0; + word-break: break-word; } -.attachments:empty { - display: none; +.post-details { + margin-bottom: calc(var(--card-padding) / 1.5); + padding: 0.2em 0; } -.attachments > * { - flex: 1; +.post-details > * { + margin-left: 1.1em; } diff --git a/src/app/components/post/post.component.html b/src/app/components/post/post.component.html index 1603ebf..a4acfe6 100644 --- a/src/app/components/post/post.component.html +++ b/src/app/components/post/post.component.html @@ -1,48 +1,60 @@ -
-
- - -
-
- {{ user.firstName }} {{ user.lastName }} -
-
- @{{ user.userName }} -
-
+
+ +
+ + + {{ user.firstName }} {{ user.lastName }} + + + @{{ user.userName }} + -
+
{{ post.message }}
-
-
-
-
-
+
+ + +
+ +
+
- diff --git a/src/assets/icons/tabler-icon-calendar-time.svg b/src/assets/icons/tabler-icon-calendar-time.svg new file mode 100644 index 0000000..3bb3a3e --- /dev/null +++ b/src/assets/icons/tabler-icon-calendar-time.svg @@ -0,0 +1,87 @@ + + + + + + image/svg+xml + + + + + + + + + + + + + + diff --git a/src/assets/icons/tabler-icon-chevron-down.svg b/src/assets/icons/tabler-icon-chevron-down.svg new file mode 100644 index 0000000..0971874 --- /dev/null +++ b/src/assets/icons/tabler-icon-chevron-down.svg @@ -0,0 +1,65 @@ + + + + + + image/svg+xml + + + + + + + + + diff --git a/src/assets/icons/tabler-icon-chevron-up.svg b/src/assets/icons/tabler-icon-chevron-up.svg new file mode 100644 index 0000000..20d694a --- /dev/null +++ b/src/assets/icons/tabler-icon-chevron-up.svg @@ -0,0 +1,65 @@ + + + + + + image/svg+xml + + + + + + + + + diff --git a/src/assets/icons/tabler-icon-link.svg b/src/assets/icons/tabler-icon-link.svg new file mode 100644 index 0000000..a9f9110 --- /dev/null +++ b/src/assets/icons/tabler-icon-link.svg @@ -0,0 +1,69 @@ + + + + + + image/svg+xml + + + + + + + + + + diff --git a/src/assets/icons/tabler-icon-message-2.svg b/src/assets/icons/tabler-icon-message-2.svg new file mode 100644 index 0000000..6a9d20c --- /dev/null +++ b/src/assets/icons/tabler-icon-message-2.svg @@ -0,0 +1,79 @@ + + + + + + image/svg+xml + + + + + + + + + + + diff --git a/src/styles.css b/src/styles.css index b62f493..b187391 100644 --- a/src/styles.css +++ b/src/styles.css @@ -2,11 +2,15 @@ @import "./reset.css"; :root { - --bg-color: white; + --max-width: 40rem; + --bg-color: #18191a; + --fg-color: #ffeede; --focus-color: forestgreen; - --card-bg: white; + --card-bg: #303030; + --card-padding: 0.5em; --success: forestgreen; --failure: indianred; + --faded-color: #696969; } html, @@ -16,9 +20,18 @@ body { } body { font: 21px sans-serif !important; + color: var(--fg-color); background-color: var(--bg-color); } +button { + color: inherit; + background: inherit; + font: inherit; + padding: 0; + border: none; +} + input:focus, button:focus { outline: 0; @@ -38,7 +51,7 @@ input[type=file]::file-selector-button { #content { /* Used for the login and register pages */ height: 100%; - max-width: 20em; + max-width: var(--max-width); box-sizing: border-box; border: 0.5em solid var(--bg-color); @@ -96,6 +109,129 @@ input[type=file]::file-selector-button { width: fit-content; } +/* General flex */ + +.flex-row, .flex-col { + display: flex; + flex-wrap: wrap; +} + +.flex-row { + flex-direction: row; +} + +.flex-col { + flex-direction: column; +} + +.flexible, .flexible-children > * { + flex: 1; +} + +.flex-center-align-items { + align-items: center; +} + +.flex-justify-start { + justify-content: flex-start; +} + +.flex-justify-end { + justify-content: flex-end; +} + +.justify-children-center > * { + display: flex; + justify-content: center; +} + +/* General font sizes */ + +.font-size-dot9 { + font-size: 0.9em; +} + +.font-size-dot8 { + font-size: 0.8em; +} + +.font-size-dot7 { + font-size: 0.7em; +} + +.img-height-font-size { + height: 1em; +} + +/* General colors */ + +.fg-color-faded { + color: var(--faded-color); +} + +/* General text */ + +.text-vertical-middle { + vertical-align: middle; +} + +/* General border */ + +.faded-slim-border { + border: 1px solid var(--faded-color); +} + +.border-radius-normal, .card { + border-radius: 0.5em; +} + +.border-radius-smaller { + border-radius: 0.3em; +} + +.border-radius-small { + border-radius: 0.2em; +} + +.border-bottom-only { + border-top: none; + border-left: none; + border-right: none; +} + +/* General padding */ + +.small-padding { + padding: 0.2em; +} + +/* Cards */ + +.card { + margin: .5em auto; + box-sizing: border-box; + padding: var(--card-padding); + background-color: var(--card-bg); + position: relative; +} + + +/* Effects */ + +.lighter-hover:hover { + cursor: pointer; + background: #424242; +} + +.click-effect:active { + transform: scale(0.9); +} + +.hover-half-opacity:hover { + opacity: 0.5; + cursor: pointer; +} + /* Inputs, the type found in login and register */ .input-field { -- cgit v1.2.3 From a9358fb8a27cd3d48547f5427797702ee2780de8 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Fri, 19 Mar 2021 16:02:43 +0200 Subject: Implemented navbar component; added some global stylings and changed the name of others; added icons --- src/app/app.module.ts | 4 +- src/app/components/navbar/navbar.component.css | 43 +++++++++++++ src/app/components/navbar/navbar.component.html | 36 +++++++++++ src/app/components/navbar/navbar.component.ts | 49 ++++++++++++++ src/app/components/post/post.component.html | 4 +- src/assets/icons/tabler-icon-home.svg | 73 +++++++++++++++++++++ src/assets/icons/tabler-icon-logout.svg | 69 ++++++++++++++++++++ src/assets/icons/tabler-icon-message-circle.svg | 86 +++++++++++++++++++++++++ src/assets/icons/tabler-icon-search.svg | 74 +++++++++++++++++++++ src/assets/icons/tabler-icon-settings.svg | 71 ++++++++++++++++++++ src/assets/icons/tabler-icon-trending-up.svg | 69 ++++++++++++++++++++ src/styles.css | 28 ++++++-- 12 files changed, 598 insertions(+), 8 deletions(-) create mode 100644 src/app/components/navbar/navbar.component.css create mode 100644 src/app/components/navbar/navbar.component.html create mode 100644 src/app/components/navbar/navbar.component.ts create mode 100644 src/assets/icons/tabler-icon-home.svg create mode 100644 src/assets/icons/tabler-icon-logout.svg create mode 100644 src/assets/icons/tabler-icon-message-circle.svg create mode 100644 src/assets/icons/tabler-icon-search.svg create mode 100644 src/assets/icons/tabler-icon-settings.svg create mode 100644 src/assets/icons/tabler-icon-trending-up.svg (limited to 'src/app/components') diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 1bf44ad..f582bbc 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -25,6 +25,7 @@ import { CommentComponent } from './components/comment/comment.component'; import { CommentPageComponent } from './components/comment-page/comment-page.component'; import { PostAttachmentComponent } from './components/post-attachment/post-attachment.component'; import { RouterModule } from '@angular/router'; +import { NavbarComponent } from './components/navbar/navbar.component'; @NgModule({ declarations: [ @@ -43,7 +44,8 @@ import { RouterModule } from '@angular/router'; AdminPanelPageComponent, CommentComponent, CommentPageComponent, - PostAttachmentComponent + PostAttachmentComponent, + NavbarComponent, ], imports: [ BrowserModule.withServerTransition({ appId: 'serverApp' }), diff --git a/src/app/components/navbar/navbar.component.css b/src/app/components/navbar/navbar.component.css new file mode 100644 index 0000000..58ec821 --- /dev/null +++ b/src/app/components/navbar/navbar.component.css @@ -0,0 +1,43 @@ +#navbar { + width: 100%; + background-color: var(--card-bg); +} + +#nav-contents { + max-width: var(--max-width); + margin: 0 auto; + box-sizing: border-box; +} + +#nav-contents img { + height: 1.9em; + width: 1.9em; +} + +@media screen and (max-width: 30rem) { + #nav-username { + display: none; + } + + #navbar { + font-size: 0.8em; + } +} + +#nav-profile-picture { + padding: 0.1em; +} + +#nav-profile-picture img { + height: 1.8em; + width: 1.8em; +} + +.nav-item { + margin-left: 0.2em; + padding: 0 0.1em; +} + +.nav-item:first-child { + margin-left: 0; +} diff --git a/src/app/components/navbar/navbar.component.html b/src/app/components/navbar/navbar.component.html new file mode 100644 index 0000000..2d386aa --- /dev/null +++ b/src/app/components/navbar/navbar.component.html @@ -0,0 +1,36 @@ + diff --git a/src/app/components/navbar/navbar.component.ts b/src/app/components/navbar/navbar.component.ts new file mode 100644 index 0000000..4af7a8a --- /dev/null +++ b/src/app/components/navbar/navbar.component.ts @@ -0,0 +1,49 @@ +import { Component, OnInit } from '@angular/core'; +import { Router } from '@angular/router'; +import { TokenService } from 'src/app/services/token.service'; +import { UserService } from 'src/app/services/user.service'; +import { User } from 'src/models/identity/user.model'; + +@Component({ + selector: 'app-navbar', + templateUrl: './navbar.component.html', + styleUrls: ['./navbar.component.css'] +}) +export class NavbarComponent implements OnInit { + public user: User; + + constructor(private _router: Router, private _userService: UserService, private _tokenService: TokenService) + { } + + ngOnInit(): void { + if (!this._tokenService.getTokenFromSessionStorage()) { + this._router.navigate(['/login']); + return; + } + + this.user = this._userService.getDefaultUser(); + + this._userService.getUserFromSessionStorageRequest().subscribe({ + next: (res: object) => { + Object.assign(this.user, res); + }, + }); + } + + goToProfile(): void { + this._router.navigate(['/profile/' + this.user.userName]); + } + + goToFeed(): void { + this._router.navigate(['/']); + } + + goToSettings(): void { + this._router.navigate(['/profile/' + this.user.userName + '/settings']); + } + + logout(): void { + this._tokenService.logoutUserFromSessionStorage(); + this._router.navigate(['/login']); + } +} diff --git a/src/app/components/post/post.component.html b/src/app/components/post/post.component.html index a4acfe6..4d9fc64 100644 --- a/src/app/components/post/post.component.html +++ b/src/app/components/post/post.component.html @@ -36,11 +36,11 @@
- - diff --git a/src/assets/icons/tabler-icon-home.svg b/src/assets/icons/tabler-icon-home.svg new file mode 100644 index 0000000..3578ddb --- /dev/null +++ b/src/assets/icons/tabler-icon-home.svg @@ -0,0 +1,73 @@ + + + + + + image/svg+xml + + + + + + + + + + + diff --git a/src/assets/icons/tabler-icon-logout.svg b/src/assets/icons/tabler-icon-logout.svg new file mode 100644 index 0000000..c311628 --- /dev/null +++ b/src/assets/icons/tabler-icon-logout.svg @@ -0,0 +1,69 @@ + + + + + + image/svg+xml + + + + + + + + + + diff --git a/src/assets/icons/tabler-icon-message-circle.svg b/src/assets/icons/tabler-icon-message-circle.svg new file mode 100644 index 0000000..fc999bd --- /dev/null +++ b/src/assets/icons/tabler-icon-message-circle.svg @@ -0,0 +1,86 @@ + + + + + + image/svg+xml + + + + + + + + + + + + diff --git a/src/assets/icons/tabler-icon-search.svg b/src/assets/icons/tabler-icon-search.svg new file mode 100644 index 0000000..abbd480 --- /dev/null +++ b/src/assets/icons/tabler-icon-search.svg @@ -0,0 +1,74 @@ + + + + + + image/svg+xml + + + + + + + + + + diff --git a/src/assets/icons/tabler-icon-settings.svg b/src/assets/icons/tabler-icon-settings.svg new file mode 100644 index 0000000..c133334 --- /dev/null +++ b/src/assets/icons/tabler-icon-settings.svg @@ -0,0 +1,71 @@ + + + + + + image/svg+xml + + + + + + + + + + diff --git a/src/assets/icons/tabler-icon-trending-up.svg b/src/assets/icons/tabler-icon-trending-up.svg new file mode 100644 index 0000000..c40ee92 --- /dev/null +++ b/src/assets/icons/tabler-icon-trending-up.svg @@ -0,0 +1,69 @@ + + + + + + image/svg+xml + + + + + + + + + + diff --git a/src/styles.css b/src/styles.css index b187391..75fe905 100644 --- a/src/styles.css +++ b/src/styles.css @@ -201,10 +201,22 @@ input[type=file]::file-selector-button { /* General padding */ -.small-padding { +.padding-normal { + padding: 0.4em; +} + +.padding-smaller { + padding: 0.3em; +} + +.padding-small { padding: 0.2em; } +.padding-tiny { + padding: 0.1em; +} + /* Cards */ .card { @@ -218,18 +230,24 @@ input[type=file]::file-selector-button { /* Effects */ -.lighter-hover:hover { +.lighter-hover:hover, .light-hover:hover, .hover-half-opacity:hover { cursor: pointer; +} + +.lighter-hover:hover { background: #424242; } -.click-effect:active { - transform: scale(0.9); +.light-hover:hover { + background: #696969; } .hover-half-opacity:hover { opacity: 0.5; - cursor: pointer; +} + +.click-effect:active { + transform: scale(0.9); } /* Inputs, the type found in login and register */ -- cgit v1.2.3 From 5916079f20c5cd36e4092fd717c1bcc8814670f7 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Fri, 19 Mar 2021 16:07:42 +0200 Subject: Added navbar component to pages that need it --- src/app/components/admin-panel-page/admin-panel-page.component.html | 2 ++ src/app/components/comment-page/comment-page.component.html | 2 ++ src/app/components/feed/feed.component.html | 2 ++ src/app/components/post-page/post-page.component.html | 2 ++ src/app/components/profile-settings/profile-settings.component.html | 2 ++ src/app/components/profile/profile.component.html | 2 ++ 6 files changed, 12 insertions(+) (limited to 'src/app/components') diff --git a/src/app/components/admin-panel-page/admin-panel-page.component.html b/src/app/components/admin-panel-page/admin-panel-page.component.html index 31f0849..96ab545 100644 --- a/src/app/components/admin-panel-page/admin-panel-page.component.html +++ b/src/app/components/admin-panel-page/admin-panel-page.component.html @@ -1,3 +1,5 @@ + +
diff --git a/src/app/components/comment-page/comment-page.component.html b/src/app/components/comment-page/comment-page.component.html index ae114da..1b94568 100644 --- a/src/app/components/comment-page/comment-page.component.html +++ b/src/app/components/comment-page/comment-page.component.html @@ -1,3 +1,5 @@ + +
diff --git a/src/app/components/feed/feed.component.html b/src/app/components/feed/feed.component.html index 5ff2dca..5694b09 100644 --- a/src/app/components/feed/feed.component.html +++ b/src/app/components/feed/feed.component.html @@ -1,3 +1,5 @@ + +
diff --git a/src/app/components/post-page/post-page.component.html b/src/app/components/post-page/post-page.component.html index 5da8cc7..fe12177 100644 --- a/src/app/components/post-page/post-page.component.html +++ b/src/app/components/post-page/post-page.component.html @@ -1,3 +1,5 @@ + +
diff --git a/src/app/components/profile-settings/profile-settings.component.html b/src/app/components/profile-settings/profile-settings.component.html index 502697d..dbfc747 100644 --- a/src/app/components/profile-settings/profile-settings.component.html +++ b/src/app/components/profile-settings/profile-settings.component.html @@ -1,3 +1,5 @@ + +
diff --git a/src/app/components/profile/profile.component.html b/src/app/components/profile/profile.component.html index 5c21cee..dede887 100644 --- a/src/app/components/profile/profile.component.html +++ b/src/app/components/profile/profile.component.html @@ -1,3 +1,5 @@ + +
-- cgit v1.2.3 From 90003ad1e0342fc6e87b844fbbb05870ac128308 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Fri, 19 Mar 2021 16:15:53 +0200 Subject: Fixed navbar component not handling logged out user properly --- src/app/components/navbar/navbar.component.html | 17 ++++-- src/app/components/navbar/navbar.component.ts | 17 ++++-- src/assets/icons/tabler-icon-login.svg | 69 +++++++++++++++++++++++++ 3 files changed, 94 insertions(+), 9 deletions(-) create mode 100644 src/assets/icons/tabler-icon-login.svg (limited to 'src/app/components') diff --git a/src/app/components/navbar/navbar.component.html b/src/app/components/navbar/navbar.component.html index 2d386aa..6bd3e66 100644 --- a/src/app/components/navbar/navbar.component.html +++ b/src/app/components/navbar/navbar.component.html @@ -1,9 +1,12 @@ diff --git a/src/app/components/navbar/navbar.component.ts b/src/app/components/navbar/navbar.component.ts index 4af7a8a..d10a49d 100644 --- a/src/app/components/navbar/navbar.component.ts +++ b/src/app/components/navbar/navbar.component.ts @@ -11,15 +11,13 @@ import { User } from 'src/models/identity/user.model'; }) export class NavbarComponent implements OnInit { public user: User; + public loggedIn: Boolean; constructor(private _router: Router, private _userService: UserService, private _tokenService: TokenService) { } ngOnInit(): void { - if (!this._tokenService.getTokenFromSessionStorage()) { - this._router.navigate(['/login']); - return; - } + this.loggedIn = this._tokenService.getTokenFromSessionStorage() !== ''; this.user = this._userService.getDefaultUser(); @@ -35,7 +33,12 @@ export class NavbarComponent implements OnInit { } goToFeed(): void { - this._router.navigate(['/']); + if (this.loggedIn) { + this._router.navigate(['/']); + } + else { + this.goToLogin(); + } } goToSettings(): void { @@ -44,6 +47,10 @@ export class NavbarComponent implements OnInit { logout(): void { this._tokenService.logoutUserFromSessionStorage(); + this.goToLogin(); + } + + goToLogin(): void { this._router.navigate(['/login']); } } diff --git a/src/assets/icons/tabler-icon-login.svg b/src/assets/icons/tabler-icon-login.svg new file mode 100644 index 0000000..4f62892 --- /dev/null +++ b/src/assets/icons/tabler-icon-login.svg @@ -0,0 +1,69 @@ + + -- cgit v1.2.3 From a5fd7df34da790377052e660e991e614a1bde27c Mon Sep 17 00:00:00 2001 From: Syndamia Date: Fri, 19 Mar 2021 16:18:47 +0200 Subject: Fixed going to your profile (via navbar) while on someone else's profile --- src/app/components/navbar/navbar.component.ts | 5 +++++ 1 file changed, 5 insertions(+) (limited to 'src/app/components') diff --git a/src/app/components/navbar/navbar.component.ts b/src/app/components/navbar/navbar.component.ts index d10a49d..b62d8e0 100644 --- a/src/app/components/navbar/navbar.component.ts +++ b/src/app/components/navbar/navbar.component.ts @@ -29,6 +29,11 @@ export class NavbarComponent implements OnInit { } goToProfile(): void { + // Properly reload the page + // Needed because if you're on someone's profile and go to yours, angular won't refresh the page (with your info) + this._router.routeReuseStrategy.shouldReuseRoute = () => false; + this._router.onSameUrlNavigation = 'reload'; + this._router.navigate(['/profile/' + this.user.userName]); } -- cgit v1.2.3 From 3002de560f363886fddcfa5520ef5520bf78fcc8 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Fri, 19 Mar 2021 17:12:23 +0200 Subject: Improved card (post) scaling, slight modifications of global styling --- src/app/components/navbar/navbar.component.css | 6 ------ src/app/components/navbar/navbar.component.html | 2 +- src/app/components/post/post.component.html | 2 +- src/styles.css | 24 +++++++++++++++++++++++- 4 files changed, 25 insertions(+), 9 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/navbar/navbar.component.css b/src/app/components/navbar/navbar.component.css index 58ec821..aa666b0 100644 --- a/src/app/components/navbar/navbar.component.css +++ b/src/app/components/navbar/navbar.component.css @@ -3,12 +3,6 @@ background-color: var(--card-bg); } -#nav-contents { - max-width: var(--max-width); - margin: 0 auto; - box-sizing: border-box; -} - #nav-contents img { height: 1.9em; width: 1.9em; diff --git a/src/app/components/navbar/navbar.component.html b/src/app/components/navbar/navbar.component.html index 6bd3e66..9fcd704 100644 --- a/src/app/components/navbar/navbar.component.html +++ b/src/app/components/navbar/navbar.component.html @@ -1,5 +1,5 @@
-
+
-
diff --git a/src/app/components/navbar/navbar.component.ts b/src/app/components/navbar/navbar.component.ts index b62d8e0..85f07d1 100644 --- a/src/app/components/navbar/navbar.component.ts +++ b/src/app/components/navbar/navbar.component.ts @@ -20,6 +20,7 @@ export class NavbarComponent implements OnInit { this.loggedIn = this._tokenService.getTokenFromSessionStorage() !== ''; this.user = this._userService.getDefaultUser(); + this.user.userName = ''; // so you don't always see a flash of 'Gosho' this._userService.getUserFromSessionStorageRequest().subscribe({ next: (res: object) => { -- cgit v1.2.3 From 97f3e372bd96195e6f243358ef7063a63278f699 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Fri, 19 Mar 2021 19:07:24 +0200 Subject: Major redesign of profile component styling --- src/app/components/profile/profile.component.css | 109 +++------------------- src/app/components/profile/profile.component.html | 100 ++++++++++---------- src/app/components/profile/profile.component.ts | 12 --- src/styles.css | 13 +++ 4 files changed, 72 insertions(+), 162 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/profile/profile.component.css b/src/app/components/profile/profile.component.css index ebcd406..c14fd00 100644 --- a/src/app/components/profile/profile.component.css +++ b/src/app/components/profile/profile.component.css @@ -1,105 +1,18 @@ -* { - box-sizing: border-box; +#user-info { + font-size: 1.3em; } -#content { - max-width: 22em; - justify-content: start; +#profile-picture { + height: 5rem; + width: 5rem; } -hr { - width: calc(100% - 1em); - color: black; - border: 1px solid black; +.sec-info-title { + padding-bottom: 0.2em; + margin-bottom: 0.3em; } -form { - width: 100%; -} - -/* Navigation bar (for loggedin user) */ - -#navigation { - display: flex; - width: 100%; -} - -.submit-btn { - flex: 1; - margin-top: 0; - margin-left: .5em; - font-size: inherit; -} - -#navigation > .submit-btn:first-child { - margin-left: 0; -} - -/* Top card */ - -#main-info { - display: flex; - width: 100%; - margin-bottom: .25em -} - -#main-info > img { - width: 5em; - height: 5em; -} - -#other-main-info { - flex: 1; - display: flex; - flex-direction: column; - align-items: center; - text-align: center; -} - -#other-main-info > * { - font-size: 1.4em; -} - -#other-main-info *:nth-child(1) { - margin-top: auto; -} - -#other-main-info *:nth-last-child(1) { - margin-bottom: auto; -} - -#add-friend, #loggedin-password { - flex: 0 !important; - margin-top: .4em; - max-width: 8em; - font-size: .6em !important; -} - -#loggedin-password { - max-width: 100%; -} - -/* Languages and technologies */ - -.secondary-info { - margin-top: .25em; - margin-bottom: .25em; - width: 100%; - display: flex; - align-items: center; - flex-wrap: wrap; -} - -/* Posts */ - -#no-posts { - width: 100%; - text-align: center; - color: gray; - margin-top: .2em; -} - -#posts { - width: 100%; - height: 100%; +.sec-info { + background-color: #424242; + margin: 0 0.3em 0.3em 0; } diff --git a/src/app/components/profile/profile.component.html b/src/app/components/profile/profile.component.html index dede887..45e51a5 100644 --- a/src/app/components/profile/profile.component.html +++ b/src/app/components/profile/profile.component.html @@ -2,61 +2,57 @@ -
- -
-
-
- -
-
- {{ user.firstName }} {{ user.lastName }} -
-
- @{{ user.userName }} -
-
- -
- -
-
+
+
+
+
-
- Languages: -
-
- {{ lang.name }} -
+
+
+ {{ user.firstName }} {{ user.lastName }}
-
-  None +
+ @{{ user.userName }}
+
+ +
+ +
-
- Technologies: -
-
- {{ tech.name }} -
-
-
-  None -
+
+
+
+ Languages
-
-
-
- {{ user.firstName }} {{ user.lastName }} hasn't posted anything yet! -
-
- -
+ + None + +
+ + {{ lang.name }} + +
+
+
+
+ Technologies +
+ + None + +
+ + {{ tech.name }} + +
+
+
+
+ {{ user.firstName }} {{ user.lastName }} hasn't posted anything yet! +
+
+
-
-
+ + diff --git a/src/app/components/profile/profile.component.ts b/src/app/components/profile/profile.component.ts index ed17f33..fc5d4d6 100644 --- a/src/app/components/profile/profile.component.ts +++ b/src/app/components/profile/profile.component.ts @@ -131,18 +131,6 @@ export class ProfileComponent implements OnInit { } } - goBack(): void { - this._router.navigate(['/']); - } - - navigateToAdminPanel(): void { - this._router.navigate(['/admin-panel']); - } - - navigateToSettings(): void { - this._router.navigate([this._router.url + '/settings']); - } - logout(): void { this._tokenService.logoutUserFromSessionStorage(); diff --git a/src/styles.css b/src/styles.css index b4f7539..64aa79f 100644 --- a/src/styles.css +++ b/src/styles.css @@ -89,6 +89,7 @@ input[type=file]::file-selector-button { width: 100%; max-height: 100%; overflow-y: auto; + flex-wrap: nowrap !important; } /* Hide scrollbar for Chrome, Safari and Opera */ @@ -142,6 +143,10 @@ input[type=file]::file-selector-button { justify-content: flex-end; } +.flex-justify-center { + justify-content: center; +} + .flex-center-align-children > * { display: flex; align-items: center; @@ -178,6 +183,10 @@ input[type=file]::file-selector-button { /* General text */ +.text-centered { + text-align: center; +} + .text-vertical-middle { vertical-align: middle; } @@ -268,6 +277,10 @@ input[type=file]::file-selector-button { /* Misc */ +.full-width { + width: 100%; +} + .centered-content { max-width: var(--max-width); margin: 0 auto; -- cgit v1.2.3 From da7ee0c5d640083fcce8af38730c587c4fb15395 Mon Sep 17 00:00:00 2001 From: Syndamia Date: Fri, 19 Mar 2021 19:18:21 +0200 Subject: Fixed height of pages that were the whole window height but were also below the navbar --- src/app/components/comment-page/comment-page.component.html | 2 +- src/app/components/feed/feed.component.html | 2 +- src/app/components/navbar/navbar.component.css | 1 + src/app/components/post-page/post-page.component.html | 2 +- src/app/components/profile-settings/profile-settings.component.html | 2 +- src/app/components/profile/profile.component.html | 2 +- src/app/services/comment.service.ts | 2 +- src/styles.css | 5 +++++ 8 files changed, 12 insertions(+), 6 deletions(-) (limited to 'src/app/components') diff --git a/src/app/components/comment-page/comment-page.component.html b/src/app/components/comment-page/comment-page.component.html index 1b94568..553b545 100644 --- a/src/app/components/comment-page/comment-page.component.html +++ b/src/app/components/comment-page/comment-page.component.html @@ -2,7 +2,7 @@ -
+
diff --git a/src/app/components/feed/feed.component.html b/src/app/components/feed/feed.component.html index c5c4401..a8290a1 100644 --- a/src/app/components/feed/feed.component.html +++ b/src/app/components/feed/feed.component.html @@ -2,7 +2,7 @@ -
+
diff --git a/src/app/components/navbar/navbar.component.css b/src/app/components/navbar/navbar.component.css index aa666b0..d02e928 100644 --- a/src/app/components/navbar/navbar.component.css +++ b/src/app/components/navbar/navbar.component.css @@ -1,4 +1,5 @@ #navbar { + height: var(--navbar-height); width: 100%; background-color: var(--card-bg); } diff --git a/src/app/components/post-page/post-page.component.html b/src/app/components/post-page/post-page.component.html index fe12177..ad748e3 100644 --- a/src/app/components/post-page/post-page.component.html +++ b/src/app/components/post-page/post-page.component.html @@ -2,7 +2,7 @@ -
+