1 import { Component, OnDestroy, OnInit } from '@angular/core'
2 import { ActivatedRoute, Router } from '@angular/router'
3 import { RedirectService } from '@app/core'
4 import { NotificationsService } from 'angular2-notifications'
5 import { Subscription } from 'rxjs'
6 import { SearchService } from '@app/search/search.service'
7 import { ComponentPagination } from '@app/shared/rest/component-pagination.model'
8 import { I18n } from '@ngx-translate/i18n-polyfill'
9 import { Video } from '../../../../shared'
10 import { MetaService } from '@ngx-meta/core'
11 import { AdvancedSearch } from '@app/search/advanced-search.model'
14 selector: 'my-search',
15 styleUrls: [ './search.component.scss' ],
16 templateUrl: './search.component.html'
18 export class SearchComponent implements OnInit, OnDestroy {
20 pagination: ComponentPagination = {
22 itemsPerPage: 10, // It's per object type (so 10 videos, 10 video channels etc)
25 advancedSearch: AdvancedSearch = new AdvancedSearch()
26 isSearchFilterCollapsed = true
28 private subActivatedRoute: Subscription
29 private currentSearch: string
30 private isInitialLoad = true
34 private route: ActivatedRoute,
35 private router: Router,
36 private metaService: MetaService,
37 private redirectService: RedirectService,
38 private notificationsService: NotificationsService,
39 private searchService: SearchService
43 this.subActivatedRoute = this.route.queryParams.subscribe(
45 const querySearch = queryParams['search']
47 if (!querySearch) return this.redirectService.redirectToHomepage()
49 // Search updated, reset filters
50 if (this.currentSearch !== querySearch) {
51 this.resetPagination()
52 this.advancedSearch.reset()
54 this.currentSearch = querySearch
58 this.advancedSearch = new AdvancedSearch(queryParams)
60 // Don't hide filters if we have some of them AND the user just came on the webpage
61 this.isSearchFilterCollapsed = this.isInitialLoad === false || !this.advancedSearch.containsValues()
62 this.isInitialLoad = false
67 err => this.notificationsService.error('Error', err.text)
72 if (this.subActivatedRoute) this.subActivatedRoute.unsubscribe()
76 return this.searchService.searchVideos(this.currentSearch, this.pagination, this.advancedSearch)
78 ({ videos, totalVideos }) => {
79 this.videos = this.videos.concat(videos)
80 this.pagination.totalItems = totalVideos
84 this.notificationsService.error(this.i18n('Error'), error.message)
91 if (this.pagination.totalItems <= (this.pagination.currentPage * this.pagination.itemsPerPage)) return
93 this.pagination.currentPage += 1
98 this.resetPagination()
100 this.updateUrlFromAdvancedSearch()
103 private resetPagination () {
104 this.pagination.currentPage = 1
105 this.pagination.totalItems = null
110 private updateTitle () {
111 this.metaService.setTitle(this.i18n('Search') + ' ' + this.currentSearch)
114 private updateUrlFromAdvancedSearch () {
115 this.router.navigate([], {
116 relativeTo: this.route,
117 queryParams: Object.assign({}, this.advancedSearch.toUrlObject(), { search: this.currentSearch })