From 60c35932f6a14cfe83bb0e54407427cce70171ea Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Thu, 25 Mar 2021 13:42:55 +0100 Subject: Redesign channel page --- .../+video-channels/video-channels.component.ts | 46 +++++++++++++++------- 1 file changed, 31 insertions(+), 15 deletions(-) (limited to 'client/src/app/+video-channels/video-channels.component.ts') diff --git a/client/src/app/+video-channels/video-channels.component.ts b/client/src/app/+video-channels/video-channels.component.ts index bb601e227..037c108f2 100644 --- a/client/src/app/+video-channels/video-channels.component.ts +++ b/client/src/app/+video-channels/video-channels.component.ts @@ -3,8 +3,8 @@ import { Subscription } from 'rxjs' import { catchError, distinctUntilChanged, map, switchMap } from 'rxjs/operators' import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core' import { ActivatedRoute } from '@angular/router' -import { AuthService, Notifier, RestExtractor, ScreenService } from '@app/core' -import { ListOverflowItem, VideoChannel, VideoChannelService } from '@app/shared/shared-main' +import { AuthService, MarkdownService, Notifier, RestExtractor, ScreenService } from '@app/core' +import { ListOverflowItem, VideoChannel, VideoChannelService, VideoService } from '@app/shared/shared-main' import { SubscribeButtonComponent } from '@app/shared/shared-user-subscription' import { HttpStatusCode } from '@shared/core-utils/miscs/http-error-codes' @@ -20,6 +20,11 @@ export class VideoChannelsComponent implements OnInit, OnDestroy { links: ListOverflowItem[] = [] isChannelManageable = false + channelVideosCount: number + ownerDescriptionHTML = '' + channelDescriptionHTML = '' + channelDescriptionExpanded = false + private routeSub: Subscription constructor ( @@ -27,9 +32,11 @@ export class VideoChannelsComponent implements OnInit, OnDestroy { private notifier: Notifier, private authService: AuthService, private videoChannelService: VideoChannelService, + private videoService: VideoService, private restExtractor: RestExtractor, private hotkeysService: HotkeysService, - private screenService: ScreenService + private screenService: ScreenService, + private markdown: MarkdownService ) { } ngOnInit () { @@ -43,16 +50,14 @@ export class VideoChannelsComponent implements OnInit, OnDestroy { HttpStatusCode.NOT_FOUND_404 ])) ) - .subscribe(videoChannel => { + .subscribe(async videoChannel => { + this.channelDescriptionHTML = await this.markdown.textMarkdownToHTML(videoChannel.description) + this.ownerDescriptionHTML = await this.markdown.textMarkdownToHTML(videoChannel.ownerAccount.description) + + // After the markdown renderer to avoid layout changes this.videoChannel = videoChannel - if (this.authService.isLoggedIn()) { - this.authService.userInformationLoaded - .subscribe(() => { - const channelUserId = this.videoChannel.ownerAccount.userId - this.isChannelManageable = channelUserId && channelUserId === this.authService.getUser().id - }) - } + this.loadChannelVideosCount() }) this.hotkeys = [ @@ -67,8 +72,7 @@ export class VideoChannelsComponent implements OnInit, OnDestroy { this.links = [ { label: $localize`VIDEOS`, routerLink: 'videos' }, - { label: $localize`VIDEO PLAYLISTS`, routerLink: 'video-playlists' }, - { label: $localize`ABOUT`, routerLink: 'about' } + { label: $localize`VIDEO PLAYLISTS`, routerLink: 'video-playlists' } ] } @@ -79,7 +83,7 @@ export class VideoChannelsComponent implements OnInit, OnDestroy { if (this.isUserLoggedIn()) this.hotkeysService.remove(this.hotkeys) } - get isInSmallView () { + isInSmallView () { return this.screenService.isInSmallView() } @@ -87,12 +91,24 @@ export class VideoChannelsComponent implements OnInit, OnDestroy { return this.authService.isLoggedIn() } - get isManageable () { + isManageable () { if (!this.isUserLoggedIn()) return false + return this.videoChannel.ownerAccount.userId === this.authService.getUser().id } activateCopiedMessage () { this.notifier.success($localize`Username copied`) } + + private loadChannelVideosCount () { + this.videoService.getVideoChannelVideos({ + videoChannel: this.videoChannel, + videoPagination: { + currentPage: 1, + itemsPerPage: 0 + }, + sort: '-publishedAt' + }).subscribe(res => this.channelVideosCount = res.total) + } } -- cgit v1.2.3