diff options
Diffstat (limited to 'client/src/app/shared/shared-video-miniature')
-rw-r--r-- | client/src/app/shared/shared-video-miniature/video-miniature.component.html | 12 | ||||
-rw-r--r-- | client/src/app/shared/shared-video-miniature/video-miniature.component.ts | 25 |
2 files changed, 22 insertions, 15 deletions
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 | } |
32 | export 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 () { |