From 6ea59f415461c27eea840ed204986eaefb538afc Mon Sep 17 00:00:00 2001
From: Chocobozzz <me@florianbigard.com>
Date: Tue, 29 Jun 2021 17:00:30 +0200
Subject: Create a dedicated component for video rating

---
 .../+video-watch/video-watch.component.html        | 27 ++++------------------
 1 file changed, 4 insertions(+), 23 deletions(-)

(limited to 'client/src/app/+videos/+video-watch/video-watch.component.html')

diff --git a/client/src/app/+videos/+video-watch/video-watch.component.html b/client/src/app/+videos/+video-watch/video-watch.component.html
index 4e424d95d..a659a7db1 100644
--- a/client/src/app/+videos/+video-watch/video-watch.component.html
+++ b/client/src/app/+videos/+video-watch/video-watch.component.html
@@ -75,30 +75,11 @@
               </div>
 
               <div class="video-actions-rates">
-                <ng-template #ratePopoverText>
-                  <span [innerHTML]="getRatePopoverText()"></span>
-                </ng-template>
-
                 <div class="video-actions full-width justify-content-end">
-                  <button
-                    [ngbPopover]="getRatePopoverText() && ratePopoverText" [ngClass]="{ 'activated': userRating === 'like' }" (click)="setLike()" (keyup.enter)="setLike()"
-                    class="action-button action-button-like" [attr.aria-pressed]="userRating === 'like'" [attr.aria-label]="tooltipLike"
-                    [ngbTooltip]="tooltipLike"
-                    placement="bottom auto"
-                  >
-                    <my-global-icon iconName="like"></my-global-icon>
-                    <span *ngIf="video.likes" class="count">{{ video.likes }}</span>
-                </button>
-
-                  <button
-                    [ngbPopover]="getRatePopoverText() && ratePopoverText" [ngClass]="{ 'activated': userRating === 'dislike' }" (click)="setDislike()" (keyup.enter)="setDislike()"
-                    class="action-button action-button-dislike" [attr.aria-pressed]="userRating === 'dislike'" [attr.aria-label]="tooltipDislike"
-                    [ngbTooltip]="tooltipDislike"
-                    placement="bottom auto"
-                  >
-                    <my-global-icon iconName="dislike"></my-global-icon>
-                    <span *ngIf="video.dislikes" class="count">{{ video.dislikes }}</span>
-                  </button>
+                  <my-video-rate
+                    [video]="video" [isUserLoggedIn]="isUserLoggedIn()"
+                    (rateUpdated)="onRateUpdated($event)" (userRatingLoaded)="onRateUpdated($event)"
+                  ></my-video-rate>
 
                   <button *ngIf="video.support" (click)="showSupportModal()" (keyup.enter)="showSupportModal()" class="action-button action-button-support" [attr.aria-label]="tooltipSupport"
                     [ngbTooltip]="tooltipSupport"
-- 
cgit v1.2.3