update voting

2021-10-04 11:40:58 +02:00 · 2021-10-04 11:40:58 +02:00 · a92a2447d5
commit a92a2447d5
parent 91958dc3ff
9 changed files with 105 additions and 37 deletions
--- a/package-lock.json
+++ b/package-lock.json
@ -3165,6 +3165,16 @@
      "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
      "dev": true
    },
+    "bindings": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz",
+      "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "file-uri-to-path": "1.0.0"
+      }
+    },
    "bl": {
      "version": "4.1.0",
      "resolved": "https://registry.npmjs.org/bl/-/bl-4.1.0.tgz",
@ -5895,6 +5905,13 @@
        }
      }
    },
+    "file-uri-to-path": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
+      "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
+      "dev": true,
+      "optional": true
+    },
    "fill-range": {
      "version": "7.0.1",
      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
@ -8578,6 +8595,13 @@
      "integrity": "sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA==",
      "dev": true
    },
+    "nan": {
+      "version": "2.15.0",
+      "resolved": "https://registry.npmjs.org/nan/-/nan-2.15.0.tgz",
+      "integrity": "sha512-8ZtvEnA2c5aYCZYd1cvgdnU6cqwixRoYg70xPLWUws5ORTa/lnw+u4amixRS/Ac5U5mQVgp9pnlSUnbNWFaWZQ==",
+      "dev": true,
+      "optional": true
+    },
    "nanoid": {
      "version": "3.1.22",
      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.22.tgz",
@ -14148,7 +14172,11 @@
          "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz",
          "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==",
          "dev": true,
-          "optional": true
+          "optional": true,
+          "requires": {
+            "bindings": "^1.5.0",
+            "nan": "^2.12.1"
+          }
        },
        "glob-parent": {
          "version": "3.1.0",
@ -14783,7 +14811,11 @@
          "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz",
          "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==",
          "dev": true,
-          "optional": true
+          "optional": true,
+          "requires": {
+            "bindings": "^1.5.0",
+            "nan": "^2.12.1"
+          }
        },
        "glob-parent": {
          "version": "3.1.0",
--- a/package.json
+++ b/package.json
@ -24,12 +24,9 @@
    "@angular/platform-browser": "~11.2.10",
    "@angular/platform-browser-dynamic": "~11.2.10",
    "@angular/router": "~11.2.10",
-    "angularx-qrcode": "^10.0.11",
    "moment": "^2.29.1",
-    "openpgp": "^4.10.8",
    "rxjs": "~6.6.7",
    "tslib": "^2.0.0",
-    "unique-names-generator": "^4.3.1",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
--- a/src/app/services/vote.service.ts
+++ b/src/app/services/vote.service.ts
@ -16,10 +16,14 @@ export class VoteService {
    }

    voteEntryUp(id: number) {
-        return this.http.put(environment.apiUrl + "/v/e/" + id, {});
+        return this.http.put(environment.apiUrl + "/v/e/" + id + "/up", {});
    }

    voteEntryDown(id: number) {
+        return this.http.put(environment.apiUrl + "/v/e/" + id + "/down", {});
+    }
+
+    unvoteEntry(id: number) {
        return this.http.delete(environment.apiUrl + "/v/e/" + id, {});
    }

@ -28,10 +32,14 @@ export class VoteService {
    }

    voteCommentUp(id: number) {
-        return this.http.put(environment.apiUrl + "/v/c/" + id, {});
+        return this.http.put(environment.apiUrl + "/v/c/" + id + "/up", {});
    }

    voteCommentDown(id: number) {
+        return this.http.put(environment.apiUrl + "/v/c/" + id + "/down", {});
+    }
+
+    unvoteComment(id: number) {
        return this.http.delete(environment.apiUrl + "/v/c/" + id, {});
    }

--- a/src/app/ui/comment/comment.ui.html
+++ b/src/app/ui/comment/comment.ui.html
@ -1,21 +1,29 @@
 <div mat-line>
  <small>
+    <ng-container *ngIf="comment.metadata && !comment.metadata.unvote">
+      <a href="javascript:" (click)="voteUp(comment.id)" matTooltip="{{'vote.up' | i18n}}">
+        <mat-icon inline="true">thumb_up</mat-icon>
+      </a>
+      <span>&nbsp;</span>
+      <a href="javascript:" (click)="voteDown(comment.id)" matTooltip="{{'vote.down' | i18n}}">
+        <mat-icon inline="true">thumb_down</mat-icon>
+      </a>
+      <span>&nbsp;</span>
+    </ng-container>
+    <span class="voted" *ngIf="comment.metadata && comment.metadata.unvote">
+        <mat-icon *ngIf="comment.metadata && comment.metadata.upvoted" inline="true" >thumb_up</mat-icon>
+        <mat-icon *ngIf="comment.metadata && comment.metadata.downvoted"  inline="true">thumb_down</mat-icon>
+      <span>&nbsp;</span>
+    </span>
    <a routerLink="/c/{{comment.id}}" matTooltip="{{comment.created | datef:'LLLL'}}">{{comment.created
      | datef}}</a>
    {{'comment.author' | i18n}}<a routerLink="/u/{{comment.author}}">{{comment.author}}</a>
-    &nbsp;
-    <a *ngIf="comment.metadata && comment.metadata.vote" href="javascript:" (click)="voteUp(comment.id)"
-      matTooltip="{{'vote.up' | i18n}}">
-      <mat-icon inline="true">thumb_up</mat-icon>
-    </a>
-    <span *ngIf="comment.metadata && comment.metadata.vote">&nbsp;</span>
-    <a *ngIf="comment.metadata && comment.metadata.downvote" href="javascript:" (click)="voteDown(comment.id)"
-      matTooltip="{{'vote.down' | i18n}}">
-      <mat-icon inline="true">thumb_down</mat-icon>
-    </a>
+    <span *ngIf="comment.metadata && comment.metadata.unvote"> | </span>
+    <a *ngIf="comment.metadata.unvote" href="javascript:" (click)="unvote()">{{'comment.unvote' | i18n}}</a>
  </small>
 </div>
-<div mat-line class="text">
+<div mat-line class="text"
+  [style.opacity]="comment.metadata && comment.metadata.points && comment.metadata.points < 0 ? 1 + (comment.metadata.points / 10) : '1.0'">
  {{comment.text}}
 </div>

@ -24,10 +32,6 @@
    <a href="javascript:" (click)="comment.metadata.reply=!comment.metadata.reply">
      {{(comment.metadata.reply ? 'comment.replyHide' : 'comment.reply') | i18n}}
    </a>
-    <span *ngIf="comment.metadata && comment.metadata.unvote">|</span>
-    <a *ngIf="comment.metadata.unvote" href="javascript:" (click)="voteDown()">
-      {{'comment.unvote' | i18n}}
-    </a>
    <span *ngIf="moderator">|</span>
    <a *ngIf="moderator" href="javascript:" (click)="deleteComment(comment)">
      {{'comment.delete' | i18n}}
--- a/src/app/ui/comment/comment.ui.scss
+++ b/src/app/ui/comment/comment.ui.scss
@ -13,3 +13,7 @@ small a:hover {
  white-space: break-spaces;
  word-break: break-all;
 }
+
+span.voted {
+  opacity: 0.5;
+}
--- a/src/app/ui/comment/comment.ui.ts
+++ b/src/app/ui/comment/comment.ui.ts
@ -53,6 +53,12 @@ export class UiComment implements OnInit {
    });
  }

+  unvote() {
+    this.voteService.unvoteComment(this.comment.id).subscribe((result) => {
+      this.change && this.change()
+    });
+  }
+
  author(author: string) {
    return '<a href="/u/' + author + '">' + author + '</a>';
  }
--- a/src/app/ui/entry/entry.ui.html
+++ b/src/app/ui/entry/entry.ui.html
@ -1,25 +1,36 @@
 <div mat-line>
  <span *ngIf="index">{{index}}.&nbsp;</span>
-  <mat-icon>{{'entryType.' + entry.entryType + '.icon' | i18n}}</mat-icon>&nbsp;
-  <span *ngIf="entry.metadata && entry.metadata.vote" (click)="voteUp(entry.id)" matTooltip="{{'vote.up' | i18n}}">
-    <mat-icon inline="true">thumb_up</mat-icon>
-  </span>
-  &nbsp;
+  <mat-icon inline="true">{{'entryType.' + entry.entryType + '.icon' | i18n}}</mat-icon>
  <a class="title" *ngIf="entry.url" [href]="entry.url" target="_blank">{{entry.title}}</a>
  <a class="title" *ngIf="!entry.url" routerLink="/e/{{entry.id}}">{{entry.title}}</a>
 </div>
 <div mat-line>
  <small>
+    <ng-container *ngIf="entry.metadata && !entry.metadata.unvote">
+      <a href="javascript:" (click)="voteUp(entry.id)" matTooltip="{{'vote.up' | i18n}}">
+        <mat-icon inline="true">thumb_up</mat-icon>
+      </a>
+      <span>&nbsp;</span>
+      <!--
+      <a href="javascript:" (click)="voteDown(entry.id)" matTooltip="{{'vote.down' | i18n}}">
+        <mat-icon inline="true">thumb_down</mat-icon>
+      </a>
+      <span>&nbsp;</span>
+      -->
+    </ng-container>
+    <span class="voted" *ngIf="entry.metadata && entry.metadata.unvote">
+        <mat-icon *ngIf="entry.metadata && entry.metadata.upvoted" inline="true" >thumb_up</mat-icon>
+        <mat-icon *ngIf="entry.metadata && entry.metadata.downvoted"  inline="true">thumb_down</mat-icon>
+      <span>&nbsp;</span>
+    </span>
    {{'points' | i18n:(entry.metadata && entry.metadata.points)}}
-    {{'entry.author' | i18n}}<a routerLink="/u/{{entry.author}}">{{entry.author}}</a>&nbsp;
    <a routerLink="/e/{{entry.id}}" matTooltip="{{entry.created | datef:'LLLL'}}">{{entry.created
-      | datef}}</a> |
-    <a *ngIf="entry.metadata && entry.metadata.unvote" href="javascript:" (click)="voteDown(entry.id)">
-      {{'entry.unvote' | i18n}}
-    </a> <span *ngIf="entry.metadata && entry.metadata.unvote">|</span>
-    <a routerLink="/e/{{entry.id}}">
-      {{'entry.comments' | i18n:(entry.metadata && entry.metadata.comments)}}
-    </a>
+      | datef}}</a>
+    {{'entry.author' | i18n}}<a routerLink="/u/{{entry.author}}">{{entry.author}}</a>
+    |
+    <a routerLink="/e/{{entry.id}}">{{'entry.comments' | i18n:(entry.metadata && entry.metadata.comments)}}</a>
+    <span *ngIf="entry.metadata && entry.metadata.unvote"> | </span>
+    <a *ngIf="entry.metadata && entry.metadata.unvote" href="javascript:" (click)="unvote(entry.id)">{{'entry.unvote' | i18n}}</a>
    <span *ngIf="moderator">|</span>
    <a *ngIf="moderator" href="javascript:" (click)="deleteEntry(entry)">
      {{'entry.delete' | i18n}}
--- a/src/app/ui/entry/entry.ui.scss
+++ b/src/app/ui/entry/entry.ui.scss
@ -11,6 +11,6 @@ small a:hover {
  text-decoration: underline;
 }

-a.vote {
-  color: $light-primary-text;
+span.voted {
+  opacity: 0.5;
 }
--- a/src/app/ui/entry/entry.ui.ts
+++ b/src/app/ui/entry/entry.ui.ts
@ -46,6 +46,12 @@ export class UiEntry implements OnInit {
    });
  }

+  unvote() {
+    this.voteService.unvoteEntry(this.entry.id).subscribe((result) => {
+      this.change && this.change()
+    });
+  }
+
  deleteEntry(entry: any) {
    const dialogRef = this.dialog.open(ConfirmDialog, {
      data: {