Hide generic channel display name and avatar on watch view (#2988)

* Hide generic channel display name on watch view

* Hide generic channel avatar on watch view

* Add Default username channel as a generic channel display-name

Co-authored-by: kimsible <kimsible@users.noreply.github.com>
This commit is contained in:
Kim 2020-07-24 08:49:59 +02:00 committed by GitHub
parent e13d7ae45c
commit b40a219338
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 57 additions and 13 deletions

View File

@ -144,15 +144,23 @@
<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>
<avatar-channel [video]="video" [genericChannel]="isChannelDisplayNameGeneric()"></avatar-channel>
<div class="video-info-channel-left-links ml-1">
<a [routerLink]="[ '/video-channels', video.byVideoChannel ]" i18n-title title="Channel page">
{{ video.channel.displayName }}
</a>
<a [routerLink]="[ '/accounts', video.byAccount ]" i18n-title title="Account page">
<span i18n>By {{ video.byAccount }}</span>
</a>
<ng-container *ngIf="!isChannelDisplayNameGeneric()">
<a [routerLink]="[ '/video-channels', video.byVideoChannel ]" i18n-title title="Channel page">
{{ video.channel.displayName }}
</a>
<a [routerLink]="[ '/accounts', video.byAccount ]" i18n-title title="Account page">
<span i18n>By {{ video.byAccount }}</span>
</a>
</ng-container>
<ng-container *ngIf="isChannelDisplayNameGeneric()">
<a [routerLink]="[ '/accounts', video.byAccount ]" class="single-link" i18n-title title="Account page">
<span i18n>{{ video.byAccount }}</span>
</a>
</ng-container>
</div>
</div>

View File

@ -192,6 +192,10 @@ $video-info-margin-left: 44px;
font-weight: 500;
font-size: 90%;
}
a.single-link {
margin-top: 7px;
}
}
}

View File

@ -307,6 +307,15 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
)
}
isChannelDisplayNameGeneric () {
const genericChannelDisplayName = [
`Main ${this.video.channel.ownerAccount.name} channel`,
`Default ${this.video.channel.ownerAccount.name} channel`
]
return genericChannelDisplayName.includes(this.video.channel.displayName)
}
private loadVideo (videoId: string) {
// Video did not change
if (this.video && this.video.uuid === videoId) return

View File

@ -1,8 +1,26 @@
<div class="wrapper" [ngClass]="'avatar-' + size">
<a [routerLink]="[ '/video-channels', video.byVideoChannel ]" [title]="channelLinkTitle">
<img [src]="video.videoChannelAvatarUrl" i18n-alt alt="Channel avatar" />
</a>
<a [routerLink]="[ '/accounts', video.byAccount ]" [title]="accountLinkTitle">
<img [src]="video.accountAvatarUrl" i18n-alt alt="Account avatar" />
</a>
<ng-container *ngIf="!isChannelAvatarNull() && !genericChannel">
<a [routerLink]="[ '/video-channels', video.byVideoChannel ]" [title]="channelLinkTitle">
<img [src]="video.videoChannelAvatarUrl" i18n-alt alt="Channel avatar" />
</a>
<a [routerLink]="[ '/accounts', video.byAccount ]" [title]="accountLinkTitle">
<img [src]="video.accountAvatarUrl" i18n-alt alt="Account avatar" />
</a>
</ng-container>
<ng-container *ngIf="!isChannelAvatarNull() && genericChannel">
<a [routerLink]="[ '/accounts', video.byAccount ]" [title]="accountLinkTitle">
<img [src]="video.accountAvatarUrl" i18n-alt alt="Account avatar" />
</a>
<a [routerLink]="[ '/video-channels', video.byVideoChannel ]" [title]="channelLinkTitle">
<img [src]="video.videoChannelAvatarUrl" i18n-alt alt="Channel avatar" />
</a>
</ng-container>
<ng-container *ngIf="isChannelAvatarNull()">
<a [routerLink]="[ '/accounts', video.byAccount ]" [title]="accountLinkTitle">
<img [src]="video.accountAvatarUrl" i18n-alt alt="Account avatar" />
</a>
</ng-container>
</div>

View File

@ -10,6 +10,7 @@ import { I18n } from '@ngx-translate/i18n-polyfill'
export class AvatarComponent implements OnInit {
@Input() video: Video
@Input() size: 'md' | 'sm' = 'md'
@Input() genericChannel: boolean
channelLinkTitle = ''
accountLinkTitle = ''
@ -28,4 +29,8 @@ export class AvatarComponent implements OnInit {
{ name: this.video.account.name, handle: this.video.byAccount }
)
}
isChannelAvatarNull () {
return this.video.channel.avatar === null
}
}