Add origin instance URL in watch page

[github/Chocobozzz/PeerTube.git] / 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 e87f59c983ea20f15f02c7f496eafd6e40a1f9c6..a382777f57de9ce836f37d93792e5615539392c8 100644 (file)
--- a/client/src/app/videos/+video-watch/video-watch.component.html
+++ b/client/src/app/videos/+video-watch/video-watch.component.html
@@ -109,7 +109,7 @@
                   </div>
 
                   <my-video-actions-dropdown
-                    placement="top auto" buttonDirection="horizontal" [buttonStyled]="true" [video]="video"
+                    placement="bottom auto" buttonDirection="horizontal" [buttonStyled]="true" [video]="video" [videoCaptions]="videoCaptions"
                     (videoRemoved)="onVideoRemoved()" (modalOpened)="onModalOpened()"
                   ></my-video-actions-dropdown>
                 </div>
@@ -124,7 +124,7 @@
                     <div
                       class="video-info-likes-dislikes-bar"
                     >
-                      <div class="likes-bar" [ngStyle]="{ 'width.%': video.likesPercent }"></div>
+                      <div class="likes-bar" [ngClass]="{ 'liked': userRating !== 'none' }" [ngStyle]="{ 'width.%': video.likesPercent }"></div>
                     </div>
                   </div>
                 </div>
@@ -145,6 +145,7 @@
           <div class="pt-3 border-top video-info-channel d-flex">
             <div class="video-info-channel-left d-flex">
               <avatar-channel [video]="video"></avatar-channel>
+
               <div class="video-info-channel-left-links ml-1">
                 <a [routerLink]="[ '/video-channels', video.byVideoChannel ]" i18n-title title="Go the channel page">
                   {{ video.channel.displayName }}
@@ -155,7 +156,7 @@
               </div>
             </div>
 
-            <my-subscribe-button #subscribeButton [videoChannel]="video.channel" size="small"></my-subscribe-button>
+            <my-subscribe-button #subscribeButton [videoChannels]="[video.channel]" size="small"></my-subscribe-button>
           </div>
         </div>
 
@@ -187,6 +188,11 @@
           <span class="video-attribute-value">{{ video.privacy.label }}</span>
         </div>
 
+        <div *ngIf="video.isLocal === false" class="video-attribute">
+          <span i18n class="video-attribute-label">Origin instance</span>
+          <a class="video-attribute-value" target="_blank" rel="noopener noreferrer" [href]="video.originInstanceUrl">{{ video.originInstanceHost }}</a>
+        </div>
+
         <div *ngIf="!!video.originallyPublishedAt" class="video-attribute">
           <span i18n class="video-attribute-label">Originally published</span>
           <span class="video-attribute-value">{{ video.originallyPublishedAt | date: 'dd MMMM yyyy' }}</span>
@@ -226,6 +232,11 @@
             class="video-attribute-value" [routerLink]="[ '/search' ]" [queryParams]="{ tagsOneOf: [ tag ] }"
           >{{ tag }}</a>
         </div>
+
+        <div class="video-attribute">
+          <span i18n class="video-attribute-label">Duration</span>
+          <span class="video-attribute-value">{{ video.duration | myVideoDurationFormatter }}</span>
+        </div>
       </div>
 
       <my-video-comments