X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2F%2Bvideos%2Fvideo-list%2Ftrending%2Fvideo-trending.component.ts;h=085f29a8bd36aad37165f8837ba1ff10a2eb01b1;hb=2e80d256cc75b4b02c8efc3d3e4cdf57ddf401a8;hp=e7723158648c96d594978542922037f308c561e7;hpb=5bcbcbe338ef5a1ed14f084311d013fbb25dabcf;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/+videos/video-list/trending/video-trending.component.ts b/client/src/app/+videos/video-list/trending/video-trending.component.ts index e77231586..085f29a8b 100644 --- a/client/src/app/+videos/video-list/trending/video-trending.component.ts +++ b/client/src/app/+videos/video-list/trending/video-trending.component.ts @@ -1,6 +1,8 @@ +import { Subscription } from 'rxjs' +import { first, switchMap } from 'rxjs/operators' import { Component, ComponentFactoryResolver, Injector, OnDestroy, OnInit } from '@angular/core' -import { ActivatedRoute, Router } from '@angular/router' -import { AuthService, LocalStorageService, Notifier, ScreenService, ServerService, UserService } from '@app/core' +import { ActivatedRoute, Params, Router } from '@angular/router' +import { AuthService, LocalStorageService, Notifier, RedirectService, ScreenService, ServerService, UserService } from '@app/core' import { HooksService } from '@app/core/plugins/hooks.service' import { immutableAssign } from '@app/helpers' import { VideoService } from '@app/shared/shared-main' @@ -9,7 +11,7 @@ import { VideoSortField } from '@shared/models' import { VideoTrendingHeaderComponent } from './video-trending-header.component' @Component({ - selector: 'my-videos-trending', + selector: 'my-videos-hot', styleUrls: [ '../../../shared/shared-video-miniature/abstract-video-list.scss' ], templateUrl: '../../../shared/shared-video-miniature/abstract-video-list.html' }) @@ -18,7 +20,9 @@ export class VideoTrendingComponent extends AbstractVideoList implements OnInit, titlePage: string defaultSort: VideoSortField = '-trending' - useUserVideoPreferences = true + loadUserVideoPreferences = true + + private algorithmChangeSub: Subscription constructor ( protected router: Router, @@ -31,10 +35,13 @@ export class VideoTrendingComponent extends AbstractVideoList implements OnInit, protected storageService: LocalStorageService, protected cfr: ComponentFactoryResolver, private videoService: VideoService, + private redirectService: RedirectService, private hooks: HooksService ) { super() + this.defaultSort = this.parseAlgorithm(this.redirectService.getDefaultTrendingAlgorithm()) + this.headerComponentInjector = this.getInjector() } @@ -43,23 +50,25 @@ export class VideoTrendingComponent extends AbstractVideoList implements OnInit, this.generateSyndicationList() - this.serverService.getConfig().subscribe( - config => { - const trendingDays = config.trending.videos.intervalDays + // Subscribe to alg change after we loaded the data + // The initial alg load is handled by the parent class + this.algorithmChangeSub = this.onDataSubject + .pipe( + first(), + switchMap(() => this.route.queryParams) + ).subscribe(queryParams => { + const oldSort = this.sort - if (trendingDays === 1) { - this.titleTooltip = $localize`Trending videos are those totalizing the greatest number of views during the last 24 hours` - } else { - this.titleTooltip = $localize`Trending videos are those totalizing the greatest number of views during the last ${trendingDays} days` - } + this.loadPageRouteParams(queryParams) - this.headerComponentInjector = this.getInjector() - this.setHeader() - }) + if (oldSort !== this.sort) this.reloadVideos() + } + ) } ngOnDestroy () { super.ngOnDestroy() + if (this.algorithmChangeSub) this.algorithmChangeSub.unsubscribe() } getVideosObservable (page: number) { @@ -88,12 +97,31 @@ export class VideoTrendingComponent extends AbstractVideoList implements OnInit, getInjector () { return Injector.create({ - providers: [{ + providers: [ { provide: 'data', useValue: { model: this.defaultSort } - }] + } ] }) } + + protected loadPageRouteParams (queryParams: Params) { + const algorithm = queryParams['alg'] || this.redirectService.getDefaultTrendingAlgorithm() + + this.sort = this.parseAlgorithm(algorithm) + } + + private parseAlgorithm (algorithm: string): VideoSortField { + switch (algorithm) { + case 'most-viewed': + return '-trending' + + case 'most-liked': + return '-likes' + + default: + return '-' + algorithm as VideoSortField + } + } }