client/src/app/+video-channels/video-channels.component.ts

   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 { SubscribeButtonComponent } from '@app/shared/shared-user-subscription'
   9 import { HttpStatusCode } from '@shared/core-utils/miscs/http-error-codes'
  10
  11 @Component({
  12   templateUrl: './video-channels.component.html',
  13   styleUrls: [ './video-channels.component.scss' ]
  14 })
  15 export class VideoChannelsComponent implements OnInit, OnDestroy {
  16   @ViewChild('subscribeButton') subscribeButton: SubscribeButtonComponent
  17
  18   videoChannel: VideoChannel
  19   hotkeys: Hotkey[]
  20   links: ListOverflowItem[] = []
  21   isChannelManageable = false
  22
  23   channelVideosCount: number
  24   ownerDescriptionHTML = ''
  25   channelDescriptionHTML = ''
  26   channelDescriptionExpanded = false
  27
  28   private routeSub: Subscription
  29
  30   constructor (
  31     private route: ActivatedRoute,
  32     private notifier: Notifier,
  33     private authService: AuthService,
  34     private videoChannelService: VideoChannelService,
  35     private videoService: VideoService,
  36     private restExtractor: RestExtractor,
  37     private hotkeysService: HotkeysService,
  38     private screenService: ScreenService,
  39     private markdown: MarkdownService
  40   ) { }
  41
  42   ngOnInit () {
  43     this.routeSub = this.route.params
  44                         .pipe(
  45                           map(params => params[ 'videoChannelName' ]),
  46                           distinctUntilChanged(),
  47                           switchMap(videoChannelName => this.videoChannelService.getVideoChannel(videoChannelName)),
  48                           catchError(err => this.restExtractor.redirectTo404IfNotFound(err, 'other', [
  49                             HttpStatusCode.BAD_REQUEST_400,
  50                             HttpStatusCode.NOT_FOUND_404
  51                           ]))
  52                         )
  53                         .subscribe(async videoChannel => {
  54                           this.channelDescriptionHTML = await this.markdown.textMarkdownToHTML(videoChannel.description)
  55                           this.ownerDescriptionHTML = await this.markdown.textMarkdownToHTML(videoChannel.ownerAccount.description)
  56
  57                           // After the markdown renderer to avoid layout changes
  58                           this.videoChannel = videoChannel
  59
  60                           this.loadChannelVideosCount()
  61                         })
  62
  63     this.hotkeys = [
  64       new Hotkey('S', (event: KeyboardEvent): boolean => {
  65         this.subscribeButton.subscribed ?
  66           this.subscribeButton.unsubscribe() :
  67           this.subscribeButton.subscribe()
  68         return false
  69       }, undefined, $localize`Subscribe to the account`)
  70     ]
  71     if (this.isUserLoggedIn()) this.hotkeysService.add(this.hotkeys)
  72
  73     this.links = [
  74       { label: $localize`VIDEOS`, routerLink: 'videos' },
  75       { label: $localize`VIDEO PLAYLISTS`, routerLink: 'video-playlists' }
  76     ]
  77   }
  78
  79   ngOnDestroy () {
  80     if (this.routeSub) this.routeSub.unsubscribe()
  81
  82     // Unbind hotkeys
  83     if (this.isUserLoggedIn()) this.hotkeysService.remove(this.hotkeys)
  84   }
  85
  86   isInSmallView () {
  87     return this.screenService.isInSmallView()
  88   }
  89
  90   isUserLoggedIn () {
  91     return this.authService.isLoggedIn()
  92   }
  93
  94   isManageable () {
  95     if (!this.isUserLoggedIn()) return false
  96
  97     return this.videoChannel?.ownerAccount.userId === this.authService.getUser().id
  98   }
  99
 100   activateCopiedMessage () {
 101     this.notifier.success($localize`Username copied`)
 102   }
 103
 104   private loadChannelVideosCount () {
 105     this.videoService.getVideoChannelVideos({
 106       videoChannel: this.videoChannel,
 107       videoPagination: {
 108         currentPage: 1,
 109         itemsPerPage: 0
 110       },
 111       sort: '-publishedAt'
 112     }).subscribe(res => this.channelVideosCount = res.total)
 113   }
 114 }