client/src/app/+search/search-filters.component.ts

   1 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
   2 import { ServerService } from '@app/core'
   3 import { AdvancedSearch } from '@app/shared/shared-search'
   4 import { ServerConfig, VideoConstant } from '@shared/models'
   5
   6 type FormOption = { id: string, label: string }
   7
   8 @Component({
   9   selector: 'my-search-filters',
  10   styleUrls: [ './search-filters.component.scss' ],
  11   templateUrl: './search-filters.component.html'
  12 })
  13 export class SearchFiltersComponent implements OnInit {
  14   @Input() advancedSearch: AdvancedSearch = new AdvancedSearch()
  15
  16   @Output() filtered = new EventEmitter<AdvancedSearch>()
  17
  18   videoCategories: VideoConstant<number>[] = []
  19   videoLicences: VideoConstant<number>[] = []
  20   videoLanguages: VideoConstant<string>[] = []
  21
  22   publishedDateRanges: FormOption[] = []
  23   sorts: FormOption[] = []
  24   durationRanges: FormOption[] = []
  25   videoType: FormOption[] = []
  26
  27   publishedDateRange: string
  28   durationRange: string
  29
  30   originallyPublishedStartYear: string
  31   originallyPublishedEndYear: string
  32
  33   private serverConfig: ServerConfig
  34
  35   constructor (
  36     private serverService: ServerService
  37   ) {
  38     this.publishedDateRanges = [
  39       {
  40         id: 'today',
  41         label: $localize`Today`
  42       },
  43       {
  44         id: 'last_7days',
  45         label: $localize`Last 7 days`
  46       },
  47       {
  48         id: 'last_30days',
  49         label: $localize`Last 30 days`
  50       },
  51       {
  52         id: 'last_365days',
  53         label: $localize`Last 365 days`
  54       }
  55     ]
  56
  57     this.videoType = [
  58       {
  59         id: 'vod',
  60         label: $localize`VOD videos`
  61       },
  62       {
  63         id: 'live',
  64         label: $localize`Live videos`
  65       }
  66     ]
  67
  68     this.durationRanges = [
  69       {
  70         id: 'short',
  71         label: $localize`Short (< 4 min)`
  72       },
  73       {
  74         id: 'medium',
  75         label: $localize`Medium (4-10 min)`
  76       },
  77       {
  78         id: 'long',
  79         label: $localize`Long (> 10 min)`
  80       }
  81     ]
  82
  83     this.sorts = [
  84       {
  85         id: '-match',
  86         label: $localize`Relevance`
  87       },
  88       {
  89         id: '-publishedAt',
  90         label: $localize`Publish date`
  91       },
  92       {
  93         id: '-views',
  94         label: $localize`Views`
  95       }
  96     ]
  97   }
  98
  99   ngOnInit () {
 100     this.serverConfig = this.serverService.getTmpConfig()
 101     this.serverService.getConfig()
 102         .subscribe(config => this.serverConfig = config)
 103
 104     this.serverService.getVideoCategories().subscribe(categories => this.videoCategories = categories)
 105     this.serverService.getVideoLicences().subscribe(licences => this.videoLicences = licences)
 106     this.serverService.getVideoLanguages().subscribe(languages => this.videoLanguages = languages)
 107
 108     this.loadFromDurationRange()
 109     this.loadFromPublishedRange()
 110     this.loadOriginallyPublishedAtYears()
 111   }
 112
 113   onInputUpdated () {
 114     this.updateModelFromDurationRange()
 115     this.updateModelFromPublishedRange()
 116     this.updateModelFromOriginallyPublishedAtYears()
 117   }
 118
 119   formUpdated () {
 120     this.onInputUpdated()
 121     this.filtered.emit(this.advancedSearch)
 122   }
 123
 124   reset () {
 125     this.advancedSearch.reset()
 126
 127     this.resetOriginalPublicationYears()
 128
 129     this.durationRange = undefined
 130     this.publishedDateRange = undefined
 131
 132     this.onInputUpdated()
 133   }
 134
 135   resetField (fieldName: string, value?: any) {
 136     this.advancedSearch[fieldName] = value
 137   }
 138
 139   resetLocalField (fieldName: string, value?: any) {
 140     this[fieldName] = value
 141     this.onInputUpdated()
 142   }
 143
 144   resetOriginalPublicationYears () {
 145     this.originallyPublishedStartYear = this.originallyPublishedEndYear = undefined
 146   }
 147
 148   isSearchTargetEnabled () {
 149     return this.serverConfig.search.searchIndex.enabled && this.serverConfig.search.searchIndex.disableLocalSearch !== true
 150   }
 151
 152   private loadOriginallyPublishedAtYears () {
 153     this.originallyPublishedStartYear = this.advancedSearch.originallyPublishedStartDate
 154       ? new Date(this.advancedSearch.originallyPublishedStartDate).getFullYear().toString()
 155       : null
 156
 157     this.originallyPublishedEndYear = this.advancedSearch.originallyPublishedEndDate
 158       ? new Date(this.advancedSearch.originallyPublishedEndDate).getFullYear().toString()
 159       : null
 160   }
 161
 162   private loadFromDurationRange () {
 163     if (this.advancedSearch.durationMin || this.advancedSearch.durationMax) {
 164       const fourMinutes = 60 * 4
 165       const tenMinutes = 60 * 10
 166
 167       if (this.advancedSearch.durationMin === fourMinutes && this.advancedSearch.durationMax === tenMinutes) {
 168         this.durationRange = 'medium'
 169       } else if (this.advancedSearch.durationMax === fourMinutes) {
 170         this.durationRange = 'short'
 171       } else if (this.advancedSearch.durationMin === tenMinutes) {
 172         this.durationRange = 'long'
 173       }
 174     }
 175   }
 176
 177   private loadFromPublishedRange () {
 178     if (this.advancedSearch.startDate) {
 179       const date = new Date(this.advancedSearch.startDate)
 180       const now = new Date()
 181
 182       const diff = Math.abs(date.getTime() - now.getTime())
 183
 184       const dayMS = 1000 * 3600 * 24
 185       const numberOfDays = diff / dayMS
 186
 187       if (numberOfDays >= 365) this.publishedDateRange = 'last_365days'
 188       else if (numberOfDays >= 30) this.publishedDateRange = 'last_30days'
 189       else if (numberOfDays >= 7) this.publishedDateRange = 'last_7days'
 190       else if (numberOfDays >= 0) this.publishedDateRange = 'today'
 191     }
 192   }
 193
 194   private updateModelFromOriginallyPublishedAtYears () {
 195     const baseDate = new Date()
 196     baseDate.setHours(0, 0, 0, 0)
 197     baseDate.setMonth(0, 1)
 198
 199     if (this.originallyPublishedStartYear) {
 200       const year = parseInt(this.originallyPublishedStartYear, 10)
 201       const start = new Date(baseDate)
 202       start.setFullYear(year)
 203
 204       this.advancedSearch.originallyPublishedStartDate = start.toISOString()
 205     } else {
 206       this.advancedSearch.originallyPublishedStartDate = null
 207     }
 208
 209     if (this.originallyPublishedEndYear) {
 210       const year = parseInt(this.originallyPublishedEndYear, 10)
 211       const end = new Date(baseDate)
 212       end.setFullYear(year)
 213
 214       this.advancedSearch.originallyPublishedEndDate = end.toISOString()
 215     } else {
 216       this.advancedSearch.originallyPublishedEndDate = null
 217     }
 218   }
 219
 220   private updateModelFromDurationRange () {
 221     if (!this.durationRange) return
 222
 223     const fourMinutes = 60 * 4
 224     const tenMinutes = 60 * 10
 225
 226     switch (this.durationRange) {
 227       case 'short':
 228         this.advancedSearch.durationMin = undefined
 229         this.advancedSearch.durationMax = fourMinutes
 230         break
 231
 232       case 'medium':
 233         this.advancedSearch.durationMin = fourMinutes
 234         this.advancedSearch.durationMax = tenMinutes
 235         break
 236
 237       case 'long':
 238         this.advancedSearch.durationMin = tenMinutes
 239         this.advancedSearch.durationMax = undefined
 240         break
 241     }
 242   }
 243
 244   private updateModelFromPublishedRange () {
 245     if (!this.publishedDateRange) return
 246
 247     // today
 248     const date = new Date()
 249     date.setHours(0, 0, 0, 0)
 250
 251     switch (this.publishedDateRange) {
 252       case 'last_7days':
 253         date.setDate(date.getDate() - 7)
 254         break
 255
 256       case 'last_30days':
 257         date.setDate(date.getDate() - 30)
 258         break
 259
 260       case 'last_365days':
 261         date.setDate(date.getDate() - 365)
 262         break
 263     }
 264
 265     this.advancedSearch.startDate = date.toISOString()
 266   }
 267 }