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']
48 if (this.currentSearch && !querySearch) return this.redirectService.redirectToHomepage()
50 // Search updated, reset filters
51 if (this.currentSearch !== querySearch) {
52 this.resetPagination()
53 this.advancedSearch.reset()
55 this.currentSearch = querySearch
59 this.advancedSearch = new AdvancedSearch(queryParams)
61 // Don't hide filters if we have some of them AND the user just came on the webpage
62 this.isSearchFilterCollapsed = this.isInitialLoad === false || !this.advancedSearch.containsValues()
63 this.isInitialLoad = false
68 err => this.notificationsService.error('Error', err.text)
73 if (this.subActivatedRoute) this.subActivatedRoute.unsubscribe()
77 return this.searchService.searchVideos(this.currentSearch, this.pagination, this.advancedSearch)
79 ({ videos, totalVideos }) => {
80 this.videos = this.videos.concat(videos)
81 this.pagination.totalItems = totalVideos
85 this.notificationsService.error(this.i18n('Error'), error.message)
92 if (this.pagination.totalItems <= (this.pagination.currentPage * this.pagination.itemsPerPage)) return
94 this.pagination.currentPage += 1
99 this.resetPagination()
101 this.updateUrlFromAdvancedSearch()
104 private resetPagination () {
105 this.pagination.currentPage = 1
106 this.pagination.totalItems = null
111 private updateTitle () {
112 this.metaService.setTitle(this.i18n('Search') + ' ' + this.currentSearch)
115 private updateUrlFromAdvancedSearch () {
116 this.router.navigate([], {
117 relativeTo: this.route,
118 queryParams: Object.assign({}, this.advancedSearch.toUrlObject(), { search: this.currentSearch })