diff --git a/client/src/app/shared/shared-main/common/link.component.scss b/client/src/app/shared/shared-main/common/link.component.scss index 433bf5a2c..f6fa5e0aa 100644 --- a/client/src/app/shared/shared-main/common/link.component.scss +++ b/client/src/app/shared/shared-main/common/link.component.scss @@ -1,5 +1,6 @@ .inherit-parent-style { color: inherit; + opacity: inherit; text-decoration: inherit; } 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 fb0f4c04b..5ec9337a1 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 @@ -29,13 +29,18 @@ }
- + @if (displayOwnerAccount()) { {{ authorAccount }} } @else if (displayOwnerVideoChannel()) { {{ authorChannel }} } - +
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 8088d0cc5..fcb383461 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 @@ -127,6 +127,10 @@ export class VideoMiniatureComponent implements OnInit { videoHref: string videoTarget: string + ownerRouterLink: string | any[] = [] + ownerHref: string + ownerTarget: string + private ownerDisplayType: 'account' | 'videoChannel' private actionsLoaded = false @@ -148,7 +152,9 @@ export class VideoMiniatureComponent implements OnInit { ngOnInit () { this.serverConfig = this.serverService.getHTMLConfig() + this.buildVideoLink() + this.buildOwnerLink() this.setUpBy() @@ -179,6 +185,29 @@ export class VideoMiniatureComponent implements OnInit { this.videoRouterLink = [ '/search/lazy-load-video', { url: video.url } ] } + buildOwnerLink () { + const video = this.video() + + const linkType = this.videoLinkType() + + if (linkType === 'internal' || !video.channel.url) { + this.ownerRouterLink = `/c/${video.byVideoChannel}` + return + } + + if (linkType === 'external') { + this.ownerRouterLink = null + this.ownerHref = video.channel.url + this.ownerTarget = '_blank' + return + } + + // Lazy load + this.ownerRouterLink = [ '/search/lazy-load-channel', { url: video.channel.url } ] + } + + // --------------------------------------------------------------------------- + displayOwnerAccount () { return this.ownerDisplayType === 'account' } diff --git a/client/src/app/shared/shared-video-playlist/video-playlist-miniature.component.html b/client/src/app/shared/shared-video-playlist/video-playlist-miniature.component.html index 6b0c4d2e7..f4bc4b1fc 100644 --- a/client/src/app/shared/shared-video-playlist/video-playlist-miniature.component.html +++ b/client/src/app/shared/shared-video-playlist/video-playlist-miniature.component.html @@ -1,6 +1,6 @@
@@ -16,15 +16,19 @@
{{ playlist().displayName }} - + {{ playlist().videoChannelBy }} - +
{{ playlist().privacy.label }} diff --git a/client/src/app/shared/shared-video-playlist/video-playlist-miniature.component.ts b/client/src/app/shared/shared-video-playlist/video-playlist-miniature.component.ts index f1831dcfd..eebeed64f 100644 --- a/client/src/app/shared/shared-video-playlist/video-playlist-miniature.component.ts +++ b/client/src/app/shared/shared-video-playlist/video-playlist-miniature.component.ts @@ -27,13 +27,20 @@ export class VideoPlaylistMiniatureComponent implements OnInit { readonly linkType = input('internal') - routerLink: any + ownerRouterLink: any + ownerHref: string + ownerTarget: string + + playlistRouterLink: any playlistHref: string playlistTarget: string + playlistDescription: string async ngOnInit () { this.buildPlaylistUrl() + this.buildOwnerUrl() + if (this.displayDescription()) { this.playlistDescription = await this.markdownService.textMarkdownToHTML({ markdown: this.playlist().description }) } @@ -41,32 +48,53 @@ export class VideoPlaylistMiniatureComponent implements OnInit { buildPlaylistUrl () { if (this.toManage()) { - this.routerLink = [ '/my-library/video-playlists', this.playlist().shortUUID ] + this.playlistRouterLink = [ '/my-library/video-playlists', this.playlist().shortUUID ] return } const playlist = this.playlist() if (playlist.videosLength === 0) { - this.routerLink = null + this.playlistRouterLink = null return } const linkType = this.linkType() if (linkType === 'internal' || !playlist.url) { - this.routerLink = VideoPlaylist.buildWatchUrl(playlist) + this.playlistRouterLink = VideoPlaylist.buildWatchUrl(playlist) return } if (linkType === 'external') { - this.routerLink = null + this.playlistRouterLink = null this.playlistHref = playlist.url this.playlistTarget = '_blank' return } // Lazy load - this.routerLink = [ '/search/lazy-load-playlist', { url: playlist.url } ] + this.playlistRouterLink = [ '/search/lazy-load-playlist', { url: playlist.url } ] + } + buildOwnerUrl () { + const playlist = this.playlist() + const linkType = this.linkType() + + if (!playlist.videoChannel) return + + if (linkType === 'internal' || !playlist.videoChannel.url) { + this.ownerRouterLink = `/c/${playlist.videoChannelBy}` + return + } + + if (linkType === 'external') { + this.ownerRouterLink = null + this.ownerHref = playlist.videoChannel.url + this.ownerTarget = '_blank' + return + } + + // Lazy load + this.ownerRouterLink = [ '/search/lazy-load-channel', { url: playlist.videoChannel.url } ] return } }