aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/shared
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2020-07-20 17:00:58 +0200
committerChocobozzz <me@florianbigard.com>2020-07-20 17:00:58 +0200
commitec903c010ecc54ec2acad0bf2cf10e7fbf6a0fa2 (patch)
tree255a1f176f5f18a9205d2c7c8ce5f562f0e5ab31 /client/src/app/shared
parent677ea3c084508a1c3949b9f4b3da3c21bac8ff52 (diff)
parent2170f1db6ee40531f9d08b711d8b7b00254c0031 (diff)
downloadPeerTube-ec903c010ecc54ec2acad0bf2cf10e7fbf6a0fa2.tar.gz
PeerTube-ec903c010ecc54ec2acad0bf2cf10e7fbf6a0fa2.tar.zst
PeerTube-ec903c010ecc54ec2acad0bf2cf10e7fbf6a0fa2.zip
Merge branch 'release/2.3.0' into develop
Diffstat (limited to 'client/src/app/shared')
-rw-r--r--client/src/app/shared/shared-forms/markdown-textarea.component.scss2
-rw-r--r--client/src/app/shared/shared-main/buttons/button.component.html2
-rw-r--r--client/src/app/shared/shared-main/buttons/delete-button.component.html2
-rw-r--r--client/src/app/shared/shared-thumbnail/video-thumbnail.component.html15
-rw-r--r--client/src/app/shared/shared-thumbnail/video-thumbnail.component.ts7
-rw-r--r--client/src/app/shared/shared-video-miniature/video-miniature.component.html12
-rw-r--r--client/src/app/shared/shared-video-miniature/video-miniature.component.ts25
-rw-r--r--client/src/app/shared/shared-video-miniature/videos-selection.component.scss9
-rw-r--r--client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.html2
9 files changed, 47 insertions, 29 deletions
diff --git a/client/src/app/shared/shared-forms/markdown-textarea.component.scss b/client/src/app/shared/shared-forms/markdown-textarea.component.scss
index f2c76f7a1..39e72b5bc 100644
--- a/client/src/app/shared/shared-forms/markdown-textarea.component.scss
+++ b/client/src/app/shared/shared-forms/markdown-textarea.component.scss
@@ -43,7 +43,7 @@ $input-border-radius: 3px;
43 } 43 }
44 44
45 .grey-button { 45 .grey-button {
46 padding: 0 12px 0 12px; 46 padding: 0 7px 0 12px;
47 } 47 }
48 } 48 }
49 } 49 }
diff --git a/client/src/app/shared/shared-main/buttons/button.component.html b/client/src/app/shared/shared-main/buttons/button.component.html
index a7dd4bb10..8eccd5c3c 100644
--- a/client/src/app/shared/shared-main/buttons/button.component.html
+++ b/client/src/app/shared/shared-main/buttons/button.component.html
@@ -1,4 +1,4 @@
1<span class="action-button" [ngClass]="getClasses()" [title]="getTitle()"> 1<span class="action-button" [ngClass]="getClasses()" [title]="getTitle()" tabindex="0">
2 <my-global-icon *ngIf="!loading" [iconName]="icon"></my-global-icon> 2 <my-global-icon *ngIf="!loading" [iconName]="icon"></my-global-icon>
3 <my-small-loader [loading]="loading"></my-small-loader> 3 <my-small-loader [loading]="loading"></my-small-loader>
4 4
diff --git a/client/src/app/shared/shared-main/buttons/delete-button.component.html b/client/src/app/shared/shared-main/buttons/delete-button.component.html
index 398b6db1e..6643e6013 100644
--- a/client/src/app/shared/shared-main/buttons/delete-button.component.html
+++ b/client/src/app/shared/shared-main/buttons/delete-button.component.html
@@ -1,4 +1,4 @@
1<span class="action-button action-button-delete grey-button" [title]="title" role="button"> 1<span class="action-button action-button-delete grey-button" [title]="title" role="button" tabindex="0">
2 <my-global-icon iconName="delete" aria-hidden="true"></my-global-icon> 2 <my-global-icon iconName="delete" aria-hidden="true"></my-global-icon>
3 3
4 <span class="button-label" *ngIf="label">{{ label }}</span> 4 <span class="button-label" *ngIf="label">{{ label }}</span>
diff --git a/client/src/app/shared/shared-thumbnail/video-thumbnail.component.html b/client/src/app/shared/shared-thumbnail/video-thumbnail.component.html
index fe5510c56..0cb0f321b 100644
--- a/client/src/app/shared/shared-thumbnail/video-thumbnail.component.html
+++ b/client/src/app/shared/shared-thumbnail/video-thumbnail.component.html
@@ -1,7 +1,12 @@
1<a 1<a *ngIf="!videoHref" [routerLink]="getVideoRouterLink()" [queryParams]="queryParams" class="video-thumbnail">
2 [routerLink]="getVideoRouterLink()" [queryParams]="queryParams" 2 <ng-container *ngTemplateOutlet="aContent"></ng-container>
3 class="video-thumbnail" 3</a>
4> 4
5<a *ngIf="videoHref" [href]="videoHref" [target]="videoTarget" class="video-thumbnail">
6 <ng-container *ngTemplateOutlet="aContent"></ng-container>
7</a>
8
9<ng-template #aContent>
5 <img alt="" [attr.aria-label]="video.name" [attr.src]="getImageUrl()" [ngClass]="{ 'blur-filter': nsfw }" /> 10 <img alt="" [attr.aria-label]="video.name" [attr.src]="getImageUrl()" [ngClass]="{ 'blur-filter': nsfw }" />
6 11
7 <div *ngIf="displayWatchLaterPlaylist" class="video-thumbnail-actions-overlay"> 12 <div *ngIf="displayWatchLaterPlaylist" class="video-thumbnail-actions-overlay">
@@ -30,4 +35,4 @@
30 <div class="progress-bar" *ngIf="video.userHistory?.currentTime"> 35 <div class="progress-bar" *ngIf="video.userHistory?.currentTime">
31 <div [ngStyle]="{ 'width.%': getProgressPercent() }"></div> 36 <div [ngStyle]="{ 'width.%': getProgressPercent() }"></div>
32 </div> 37 </div>
33</a> 38</ng-template>
diff --git a/client/src/app/shared/shared-thumbnail/video-thumbnail.component.ts b/client/src/app/shared/shared-thumbnail/video-thumbnail.component.ts
index 3ff45d9b7..812c7a508 100644
--- a/client/src/app/shared/shared-thumbnail/video-thumbnail.component.ts
+++ b/client/src/app/shared/shared-thumbnail/video-thumbnail.component.ts
@@ -11,8 +11,11 @@ import { Video } from '../shared-main'
11export class VideoThumbnailComponent { 11export class VideoThumbnailComponent {
12 @Input() video: Video 12 @Input() video: Video
13 @Input() nsfw = false 13 @Input() nsfw = false
14 @Input() routerLink: any[] 14
15 @Input() videoRouterLink: any[]
15 @Input() queryParams: { [ p: string ]: any } 16 @Input() queryParams: { [ p: string ]: any }
17 @Input() videoHref: string
18 @Input() videoTarget: string
16 19
17 @Input() displayWatchLaterPlaylist: boolean 20 @Input() displayWatchLaterPlaylist: boolean
18 @Input() inWatchLaterPlaylist: boolean 21 @Input() inWatchLaterPlaylist: boolean
@@ -49,7 +52,7 @@ export class VideoThumbnailComponent {
49 } 52 }
50 53
51 getVideoRouterLink () { 54 getVideoRouterLink () {
52 if (this.routerLink) return this.routerLink 55 if (this.videoRouterLink) return this.videoRouterLink
53 56
54 return [ '/videos/watch', this.video.uuid ] 57 return [ '/videos/watch', this.video.uuid ]
55 } 58 }
diff --git a/client/src/app/shared/shared-video-miniature/video-miniature.component.html b/client/src/app/shared/shared-video-miniature/video-miniature.component.html
index e5d91e69a..a88b3bc9e 100644
--- a/client/src/app/shared/shared-video-miniature/video-miniature.component.html
+++ b/client/src/app/shared/shared-video-miniature/video-miniature.component.html
@@ -1,6 +1,6 @@
1<div class="video-miniature" [ngClass]="{ 'display-as-row': displayAsRow, 'fit-width': fitWidth }" (mouseenter)="loadActions()"> 1<div class="video-miniature" [ngClass]="{ 'display-as-row': displayAsRow, 'fit-width': fitWidth }" (mouseenter)="loadActions()">
2 <my-video-thumbnail 2 <my-video-thumbnail
3 [video]="video" [nsfw]="isVideoBlur" [routerLink]="videoLink" 3 [video]="video" [nsfw]="isVideoBlur" [videoRouterLink]="videoRouterLink" [videoHref]="videoHref" [videoTarget]="videoTarget"
4 [displayWatchLaterPlaylist]="isWatchLaterPlaylistDisplayed()" [inWatchLaterPlaylist]="inWatchLaterPlaylist" (watchLaterClick)="onWatchLaterClick($event)" 4 [displayWatchLaterPlaylist]="isWatchLaterPlaylistDisplayed()" [inWatchLaterPlaylist]="inWatchLaterPlaylist" (watchLaterClick)="onWatchLaterClick($event)"
5 > 5 >
6 <ng-container ngProjectAs="label-warning" *ngIf="displayOptions.privacyLabel && isUnlistedVideo()" i18n>Unlisted</ng-container> 6 <ng-container ngProjectAs="label-warning" *ngIf="displayOptions.privacyLabel && isUnlistedVideo()" i18n>Unlisted</ng-container>
@@ -15,10 +15,12 @@
15 </a> 15 </a>
16 16
17 <div class="w-100 d-flex flex-column"> 17 <div class="w-100 d-flex flex-column">
18 <a 18 <a *ngIf="!videoHref" tabindex="-1" class="video-miniature-name"
19 tabindex="-1" 19 [routerLink]="videoRouterLink" [attr.title]="video.name" [ngClass]="{ 'blur-filter': isVideoBlur }"
20 class="video-miniature-name" 20 >{{ video.name }}</a>
21 [routerLink]="videoLink" [attr.title]="video.name" [ngClass]="{ 'blur-filter': isVideoBlur }" 21
22 <a *ngIf="videoHref" tabindex="-1" class="video-miniature-name"
23 [href]="videoHref" [target]="videoTarget" [attr.title]="video.name" [ngClass]="{ 'blur-filter': isVideoBlur }"
22 >{{ video.name }}</a> 24 >{{ video.name }}</a>
23 25
24 <span class="video-miniature-created-at-views"> 26 <span class="video-miniature-created-at-views">
diff --git a/client/src/app/shared/shared-video-miniature/video-miniature.component.ts b/client/src/app/shared/shared-video-miniature/video-miniature.component.ts
index e1adbb6ad..f434550dd 100644
--- a/client/src/app/shared/shared-video-miniature/video-miniature.component.ts
+++ b/client/src/app/shared/shared-video-miniature/video-miniature.component.ts
@@ -29,6 +29,7 @@ export type MiniatureDisplayOptions = {
29 blacklistInfo?: boolean 29 blacklistInfo?: boolean
30 nsfw?: boolean 30 nsfw?: boolean
31} 31}
32export type VideoLinkType = 'internal' | 'lazy-load' | 'external'
32 33
33@Component({ 34@Component({
34 selector: 'my-video-miniature', 35 selector: 'my-video-miniature',
@@ -55,7 +56,7 @@ export class VideoMiniatureComponent implements OnInit {
55 @Input() displayVideoActions = true 56 @Input() displayVideoActions = true
56 @Input() fitWidth = false 57 @Input() fitWidth = false
57 58
58 @Input() useLazyLoadUrl = false 59 @Input() videoLinkType: VideoLinkType = 'internal'
59 60
60 @Output() videoBlocked = new EventEmitter() 61 @Output() videoBlocked = new EventEmitter()
61 @Output() videoUnblocked = new EventEmitter() 62 @Output() videoUnblocked = new EventEmitter()
@@ -85,7 +86,9 @@ export class VideoMiniatureComponent implements OnInit {
85 playlistElementId?: number 86 playlistElementId?: number
86 } 87 }
87 88
88 videoLink: any[] = [] 89 videoRouterLink: any[] = []
90 videoHref: string
91 videoTarget: string
89 92
90 private ownerDisplayTypeChosen: 'account' | 'videoChannel' 93 private ownerDisplayTypeChosen: 'account' | 'videoChannel'
91 94
@@ -125,18 +128,20 @@ export class VideoMiniatureComponent implements OnInit {
125 } 128 }
126 129
127 buildVideoLink () { 130 buildVideoLink () {
128 if (this.useLazyLoadUrl && this.video.url) { 131 if (this.videoLinkType === 'internal' || !this.video.url) {
129 const remoteUriConfig = this.serverConfig.search.remoteUri 132 this.videoRouterLink = [ '/videos/watch', this.video.uuid ]
130 133 return
131 // Redirect on the external instance if not allowed to fetch remote data 134 }
132 const externalRedirect = (!this.authService.isLoggedIn() && !remoteUriConfig.anonymous) || !remoteUriConfig.users
133 const fromPath = window.location.pathname + window.location.search
134 135
135 this.videoLink = [ '/search/lazy-load-video', { url: this.video.url, externalRedirect, fromPath } ] 136 if (this.videoLinkType === 'external') {
137 this.videoRouterLink = null
138 this.videoHref = this.video.url
139 this.videoTarget = '_blank'
136 return 140 return
137 } 141 }
138 142
139 this.videoLink = [ '/videos/watch', this.video.uuid ] 143 // Lazy load
144 this.videoRouterLink = [ '/search/lazy-load-video', { url: this.video.url } ]
140 } 145 }
141 146
142 displayOwnerAccount () { 147 displayOwnerAccount () {
diff --git a/client/src/app/shared/shared-video-miniature/videos-selection.component.scss b/client/src/app/shared/shared-video-miniature/videos-selection.component.scss
index d3cbabf23..c33e11889 100644
--- a/client/src/app/shared/shared-video-miniature/videos-selection.component.scss
+++ b/client/src/app/shared/shared-video-miniature/videos-selection.component.scss
@@ -10,14 +10,13 @@
10 position: fixed; 10 position: fixed;
11 11
12 .action-button { 12 .action-button {
13 display: inline-block; 13 display: block;
14 margin-left: 55px;
14 } 15 }
15 16
16 .action-button-cancel-selection { 17 .action-button-cancel-selection {
17 @include peertube-button; 18 @include peertube-button;
18 @include grey-button; 19 @include grey-button;
19
20 margin-right: 10px;
21 } 20 }
22 } 21 }
23} 22}
@@ -54,4 +53,8 @@
54 margin-top: 10px; 53 margin-top: 10px;
55 } 54 }
56 } 55 }
56
57 .action-selection-mode {
58 display: none; // disable for small screens
59 }
57} 60}
diff --git a/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.html b/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.html
index e3f7ef017..473fdc102 100644
--- a/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.html
+++ b/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.html
@@ -8,7 +8,7 @@
8 <my-video-thumbnail 8 <my-video-thumbnail
9 *ngIf="playlistElement.video" 9 *ngIf="playlistElement.video"
10 [video]="playlistElement.video" [nsfw]="isVideoBlur(playlistElement.video)" 10 [video]="playlistElement.video" [nsfw]="isVideoBlur(playlistElement.video)"
11 [routerLink]="buildRouterLink()" [queryParams]="buildRouterQuery()" 11 [videoRouterLink]="buildRouterLink()" [queryParams]="buildRouterQuery()"
12 ></my-video-thumbnail> 12 ></my-video-thumbnail>
13 13
14 <div class="fake-thumbnail" *ngIf="!playlistElement.video"></div> 14 <div class="fake-thumbnail" *ngIf="!playlistElement.video"></div>