client/src/app/shared/shared-video-miniature/video-filters-header.component.ts

   1 import * as debug from 'debug'
   2 import { Subscription } from 'rxjs'
   3 import { Component, EventEmitter, Input, OnDestroy, OnInit, Output } from '@angular/core'
   4 import { FormBuilder, FormGroup } from '@angular/forms'
   5 import { AuthService } from '@app/core'
   6 import { ServerService } from '@app/core/server/server.service'
   7 import { UserRight } from '@shared/models'
   8 import { NSFWPolicyType } from '@shared/models/videos'
   9 import { PeertubeModalService } from '../shared-main'
  10 import { VideoFilters } from './video-filters.model'
  11
  12 const logger = debug('peertube:videos:VideoFiltersHeaderComponent')
  13
  14 @Component({
  15   selector: 'my-video-filters-header',
  16   styleUrls: [ './video-filters-header.component.scss' ],
  17   templateUrl: './video-filters-header.component.html'
  18 })
  19 export class VideoFiltersHeaderComponent implements OnInit, OnDestroy {
  20   @Input() filters: VideoFilters
  21
  22   @Input() displayModerationBlock = false
  23
  24   @Input() defaultSort = '-publishedAt'
  25   @Input() nsfwPolicy: NSFWPolicyType
  26
  27   @Input() hideScope = false
  28
  29   @Output() filtersChanged = new EventEmitter()
  30
  31   areFiltersCollapsed = true
  32
  33   form: FormGroup
  34
  35   private routeSub: Subscription
  36
  37   constructor (
  38     private auth: AuthService,
  39     private serverService: ServerService,
  40     private fb: FormBuilder,
  41     private modalService: PeertubeModalService
  42   ) {
  43   }
  44
  45   ngOnInit () {
  46     this.form = this.fb.group({
  47       sort: [ '' ],
  48       nsfw: [ '' ],
  49       languageOneOf: [ '' ],
  50       categoryOneOf: [ '' ],
  51       scope: [ '' ],
  52       allVideos: [ '' ],
  53       live: [ '' ]
  54     })
  55
  56     this.patchForm(false)
  57
  58     this.filters.onChange(() => {
  59       this.patchForm(false)
  60     })
  61
  62     this.form.valueChanges.subscribe(values => {
  63       logger('Loading values from form: %O', values)
  64
  65       this.filters.load(values)
  66       this.filtersChanged.emit()
  67     })
  68   }
  69
  70   ngOnDestroy () {
  71     if (this.routeSub) this.routeSub.unsubscribe()
  72   }
  73
  74   canSeeAllVideos () {
  75     if (!this.auth.isLoggedIn()) return false
  76     if (!this.displayModerationBlock) return false
  77
  78     return this.auth.getUser().hasRight(UserRight.SEE_ALL_VIDEOS)
  79   }
  80
  81   isTrendingSortEnabled (sort: 'most-viewed' | 'hot' | 'best' | 'most-liked') {
  82     const serverConfig = this.serverService.getHTMLConfig()
  83
  84     const enabled = serverConfig.trending.videos.algorithms.enabled.includes(sort)
  85
  86     // Best is adapted from the user
  87     if (sort === 'best') return enabled && this.auth.isLoggedIn()
  88
  89     return enabled
  90   }
  91
  92   resetFilter (key: string, canRemove: boolean) {
  93     if (!canRemove) return
  94
  95     this.filters.reset(key)
  96     this.patchForm(false)
  97     this.filtersChanged.emit()
  98   }
  99
 100   getFilterTitle (canRemove: boolean) {
 101     if (canRemove) return $localize`Remove this filter`
 102
 103     return ''
 104   }
 105
 106   onAccountSettingsClick (event: Event) {
 107     if (this.auth.isLoggedIn()) return
 108
 109     event.preventDefault()
 110     event.stopPropagation()
 111
 112     this.modalService.openQuickSettingsSubject.next()
 113   }
 114
 115   private patchForm (emitEvent: boolean) {
 116     const defaultValues = this.filters.toFormObject()
 117     this.form.patchValue(defaultValues, { emitEvent })
 118
 119     logger('Patched form: %O', defaultValues)
 120   }
 121 }