1 import { Hotkey, HotkeysService } from 'angular2-hotkeys'
2 import { Subscription } from 'rxjs'
3 import { catchError, distinctUntilChanged, map, switchMap } from 'rxjs/operators'
4 import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core'
5 import { ActivatedRoute } from '@angular/router'
6 import { AuthService, MarkdownService, Notifier, RestExtractor, ScreenService } from '@app/core'
7 import { ListOverflowItem, VideoChannel, VideoChannelService, VideoService } from '@app/shared/shared-main'
8 import { SupportModalComponent } from '@app/shared/shared-support-modal'
9 import { SubscribeButtonComponent } from '@app/shared/shared-user-subscription'
10 import { HttpStatusCode } from '@shared/core-utils/miscs/http-error-codes'
13 templateUrl: './video-channels.component.html',
14 styleUrls: [ './video-channels.component.scss' ]
16 export class VideoChannelsComponent implements OnInit, OnDestroy {
17 @ViewChild('subscribeButton') subscribeButton: SubscribeButtonComponent
18 @ViewChild('supportModal') supportModal: SupportModalComponent
20 videoChannel: VideoChannel
22 links: ListOverflowItem[] = []
23 isChannelManageable = false
25 channelVideosCount: number
26 ownerDescriptionHTML = ''
27 channelDescriptionHTML = ''
28 channelDescriptionExpanded = false
30 private routeSub: Subscription
33 private route: ActivatedRoute,
34 private notifier: Notifier,
35 private authService: AuthService,
36 private videoChannelService: VideoChannelService,
37 private videoService: VideoService,
38 private restExtractor: RestExtractor,
39 private hotkeysService: HotkeysService,
40 private screenService: ScreenService,
41 private markdown: MarkdownService
45 this.routeSub = this.route.params
47 map(params => params[ 'videoChannelName' ]),
48 distinctUntilChanged(),
49 switchMap(videoChannelName => this.videoChannelService.getVideoChannel(videoChannelName)),
50 catchError(err => this.restExtractor.redirectTo404IfNotFound(err, 'other', [
51 HttpStatusCode.BAD_REQUEST_400,
52 HttpStatusCode.NOT_FOUND_404
55 .subscribe(async videoChannel => {
56 this.channelDescriptionHTML = await this.markdown.textMarkdownToHTML(videoChannel.description)
57 this.ownerDescriptionHTML = await this.markdown.textMarkdownToHTML(videoChannel.ownerAccount.description)
59 // After the markdown renderer to avoid layout changes
60 this.videoChannel = videoChannel
62 this.loadChannelVideosCount()
66 new Hotkey('S', (event: KeyboardEvent): boolean => {
67 this.subscribeButton.subscribed ?
68 this.subscribeButton.unsubscribe() :
69 this.subscribeButton.subscribe()
71 }, undefined, $localize`Subscribe to the account`)
73 if (this.isUserLoggedIn()) this.hotkeysService.add(this.hotkeys)
76 { label: $localize`VIDEOS`, routerLink: 'videos' },
77 { label: $localize`PLAYLISTS`, routerLink: 'video-playlists' }
82 if (this.routeSub) this.routeSub.unsubscribe()
85 if (this.isUserLoggedIn()) this.hotkeysService.remove(this.hotkeys)
89 return this.screenService.isInSmallView()
93 return this.authService.isLoggedIn()
97 if (!this.isUserLoggedIn()) return false
99 return this.videoChannel?.ownerAccount.userId === this.authService.getUser().id
102 activateCopiedMessage () {
103 this.notifier.success($localize`Username copied`)
106 hasShowMoreDescription () {
107 return !this.channelDescriptionExpanded && this.channelDescriptionHTML.length > 100
110 showSupportModal () {
111 this.supportModal.show()
115 return [ '/a', this.videoChannel.ownerBy ]
118 private loadChannelVideosCount () {
119 this.videoService.getVideoChannelVideos({
120 videoChannel: this.videoChannel,
126 }).subscribe(res => this.channelVideosCount = res.total)