client/src/app/+videos/video-list/trending/video-trending-header.component.ts

   1 import { Component, Inject, OnInit } from '@angular/core'
   2 import { Router } from '@angular/router'
   3 import { VideoListHeaderComponent } from '@app/shared/shared-video-miniature'
   4 import { GlobalIconName } from '@app/shared/shared-icons'
   5 import { VideoSortField } from '@shared/models'
   6 import { ServerService } from '@app/core/server/server.service'
   7
   8 interface VideoTrendingHeaderItem {
   9   label: string
  10   iconName: GlobalIconName
  11   value: VideoSortField
  12   path: string
  13   tooltip?: string
  14   hidden?: boolean
  15 }
  16
  17 @Component({
  18   selector: 'video-trending-title-page',
  19   host: { 'class': 'title-page title-page-single' },
  20   styleUrls: [ './video-trending-header.component.scss' ],
  21   templateUrl: './video-trending-header.component.html'
  22 })
  23 export class VideoTrendingHeaderComponent extends VideoListHeaderComponent implements OnInit {
  24   buttons: VideoTrendingHeaderItem[]
  25
  26   constructor (
  27     @Inject('data') public data: any,
  28     private router: Router,
  29     private serverService: ServerService
  30   ) {
  31     super(data)
  32
  33     this.buttons = [
  34       {
  35         label: $localize`:A variant of Trending videos based on the number of recent interactions:Hot`,
  36         iconName: 'flame',
  37         value: '-hot',
  38         path: 'hot',
  39         tooltip: $localize`Videos totalizing the most interactions for recent videos`,
  40         hidden: true
  41       },
  42       {
  43         label: $localize`:Main variant of Trending videos based on number of recent views:Views`,
  44         iconName: 'trending',
  45         value: '-trending',
  46         path: 'most-viewed',
  47         tooltip: $localize`Videos totalizing the most views during the last 24 hours`,
  48       },
  49       {
  50         label: $localize`:A variant of Trending videos based on the number of likes:Likes`,
  51         iconName: 'like',
  52         value: '-likes',
  53         path: 'most-liked',
  54         tooltip: $localize`Videos that have the most likes`
  55       }
  56     ]
  57   }
  58
  59   ngOnInit () {
  60     this.serverService.getConfig()
  61         .subscribe(config => {
  62           // don't filter if auto-blacklist is not enabled as this will be the only list
  63           if (config.instance.pages.hot.enabled) {
  64             const index = this.buttons.findIndex(b => b.path === 'hot')
  65             this.buttons[index].hidden = false
  66           }
  67         })
  68   }
  69
  70   get visibleButtons () {
  71     return this.buttons.filter(b => !b.hidden)
  72   }
  73
  74   setSort () {
  75     const path = this.buttons.find(b => b.value === this.data.model).path
  76     this.router.navigate([ `/videos/${path}` ])
  77   }
  78 }