1 <div class=
"root" *
ngIf=
"videoChannel">
2 <div class=
"channel-info">
4 <ng-template #buttonsTemplate
>
5 <a *
ngIf=
"isManageable()" [routerLink]=
"[ '/my-library/video-channels/update', videoChannel.nameWithHost ]" class=
"peertube-button-link orange-button" i18n
>
9 <my-subscribe-button *
ngIf=
"!isManageable()" #subscribeButton [videoChannels]=
"[videoChannel]"></my-subscribe-button>
11 <button *
ngIf=
"videoChannel.support" (click)=
"showSupportModal()" class=
"support-button peertube-button orange-button-inverted">
12 <my-global-icon iconName=
"support" aria-hidden=
"true"></my-global-icon>
13 <span class=
"icon-text" i18n
>Support
</span>
17 <ng-template #ownerTemplate
>
18 <div class=
"owner-block">
19 <div class=
"avatar-row">
20 <a [routerLink]=
"getAccountUrl()" title=
"View account" i18n-title
>
21 <img class=
"account-avatar" [src]=
"videoChannel.ownerAvatarUrl" alt=
"Owner account avatar" />
24 <div class=
"actor-info">
26 <a [routerLink]=
"getAccountUrl()" title=
"View account" i18n-title
>{{ videoChannel.ownerAccount.displayName }}
</a>
29 <div class=
"actor-handle">@{{ videoChannel.ownerBy }}
</div>
33 <div class=
"owner-description">
34 <div class=
"description-html" [innerHTML]=
"ownerDescriptionHTML"></div>
37 <a class=
"view-account short" [routerLink]=
"getAccountUrl()" i18n
>
41 <a class=
"view-account complete" [routerLink]=
"getAccountUrl()" i18n
>
47 <div class=
"channel-avatar-row">
48 <img class=
"channel-avatar" [src]=
"videoChannel.avatarUrl" alt=
"Avatar" />
51 <div class=
"section-label" i18n
>VIDEO CHANNEL
</div>
53 <div class=
"actor-info">
55 <div class=
"actor-display-name">
56 <h1>{{ videoChannel.displayName }}
</h1>
59 <div class=
"actor-handle">
60 <span>@{{ videoChannel.nameWithHost }}
</span>
61 <button [cdkCopyToClipboard]=
"videoChannel.nameWithHostForced" (click)=
"activateCopiedMessage()"
62 class=
"btn btn-outline-secondary btn-sm copy-button" title=
"Copy channel handle" i18n-title
64 <span class=
"glyphicon glyphicon-duplicate"></span>
68 <div class=
"actor-counters">
69 <span i18n
>{videoChannel.followersCount, plural, =
1 {
1 subscriber} other {{{ videoChannel.followersCount }} subscribers}}
</span>
71 <span class=
"videos-count" *
ngIf=
"channelVideosCount !== undefined" i18n
>
72 {channelVideosCount, plural, =
1 {
1 videos} other {{{ channelVideosCount }} videos}}
77 <div class=
"channel-buttons right">
78 <ng-template *
ngTemplateOutlet=
"buttonsTemplate"></ng-template>
84 <div class=
"channel-description" [ngClass]=
"{ expanded: channelDescriptionExpanded }">
85 <div class=
"description-html" [innerHTML]=
"channelDescriptionHTML"></div>
87 <div class=
"created-at" i18n
>Channel created on {{ videoChannel.createdAt | date }}
</div>
90 <div *
ngIf=
"hasShowMoreDescription()" class=
"show-more" role=
"button"
91 (click)=
"channelDescriptionExpanded = !channelDescriptionExpanded"
92 title=
"Show the complete description" i18n-title i18n
97 <div class=
"channel-buttons bottom">
98 <ng-template *
ngTemplateOutlet=
"buttonsTemplate"></ng-template>
101 <div class=
"owner-card">
102 <div class=
"section-label" i18n
>OWNER ACCOUNT
</div>
104 <ng-template *
ngTemplateOutlet=
"ownerTemplate"></ng-template>
108 <div class=
"bottom-owner">
109 <div class=
"section-label" i18n
>OWNER ACCOUNT
</div>
111 <ng-template *
ngTemplateOutlet=
"ownerTemplate"></ng-template>
115 <ng-template #linkTemplate
let-item=
"item">
116 <a [routerLink]=
"item.routerLink" routerLinkActive=
"active" class=
"title-page">{{ item.label }}
</a>
119 <list-overflow [items]=
"links" [itemTemplate]=
"linkTemplate"></list-overflow>
122 <router-outlet></router-outlet>
125 <my-support-modal #supportModal [videoChannel]=
"videoChannel"></my-support-modal>