diff options
Diffstat (limited to 'client/src/app/+search')
-rw-r--r-- | client/src/app/+search/search-filters.component.html | 27 | ||||
-rw-r--r-- | client/src/app/+search/search-filters.component.ts | 40 | ||||
-rw-r--r-- | client/src/app/+search/search-routing.module.ts | 4 | ||||
-rw-r--r-- | client/src/app/+search/search.component.ts | 8 |
4 files changed, 52 insertions, 27 deletions
diff --git a/client/src/app/+search/search-filters.component.html b/client/src/app/+search/search-filters.component.html index 1d1e7b868..421bc7f6f 100644 --- a/client/src/app/+search/search-filters.component.html +++ b/client/src/app/+search/search-filters.component.html | |||
@@ -18,6 +18,25 @@ | |||
18 | 18 | ||
19 | <div class="form-group"> | 19 | <div class="form-group"> |
20 | <div class="radio-label label-container"> | 20 | <div class="radio-label label-container"> |
21 | <label i18n>Display only</label> | ||
22 | <button i18n class="reset-button reset-button-small" (click)="resetField('isLive')" *ngIf="advancedSearch.isLive !== undefined"> | ||
23 | Reset | ||
24 | </button> | ||
25 | </div> | ||
26 | |||
27 | <div class="peertube-radio-container"> | ||
28 | <input type="radio" name="isLive" id="isLiveTrue" value="true" [(ngModel)]="advancedSearch.isLive"> | ||
29 | <label i18n for="isLiveTrue" class="radio">Live videos</label> | ||
30 | </div> | ||
31 | |||
32 | <div class="peertube-radio-container"> | ||
33 | <input type="radio" name="isLive" id="isLiveFalse" value="false" [(ngModel)]="advancedSearch.isLive"> | ||
34 | <label i18n for="isLiveFalse" class="radio">VOD videos</label> | ||
35 | </div> | ||
36 | </div> | ||
37 | |||
38 | <div class="form-group"> | ||
39 | <div class="radio-label label-container"> | ||
21 | <label i18n>Display sensitive content</label> | 40 | <label i18n>Display sensitive content</label> |
22 | <button i18n class="reset-button reset-button-small" (click)="resetField('nsfw')" *ngIf="advancedSearch.nsfw !== undefined"> | 41 | <button i18n class="reset-button reset-button-small" (click)="resetField('nsfw')" *ngIf="advancedSearch.nsfw !== undefined"> |
23 | Reset | 42 | Reset |
@@ -44,7 +63,7 @@ | |||
44 | </div> | 63 | </div> |
45 | 64 | ||
46 | <div class="peertube-radio-container" *ngFor="let date of publishedDateRanges"> | 65 | <div class="peertube-radio-container" *ngFor="let date of publishedDateRanges"> |
47 | <input type="radio" (change)="inputUpdated()" name="publishedDateRange" [id]="date.id" [value]="date.id" [(ngModel)]="publishedDateRange"> | 66 | <input type="radio" (change)="onInputUpdated()" name="publishedDateRange" [id]="date.id" [value]="date.id" [(ngModel)]="publishedDateRange"> |
48 | <label [for]="date.id" class="radio">{{ date.label }}</label> | 67 | <label [for]="date.id" class="radio">{{ date.label }}</label> |
49 | </div> | 68 | </div> |
50 | </div> | 69 | </div> |
@@ -60,7 +79,7 @@ | |||
60 | <div class="row"> | 79 | <div class="row"> |
61 | <div class="pl-0 col-sm-6"> | 80 | <div class="pl-0 col-sm-6"> |
62 | <input | 81 | <input |
63 | (change)="inputUpdated()" | 82 | (change)="onInputUpdated()" |
64 | (keydown.enter)="$event.preventDefault()" | 83 | (keydown.enter)="$event.preventDefault()" |
65 | type="text" id="original-publication-after" name="original-publication-after" | 84 | type="text" id="original-publication-after" name="original-publication-after" |
66 | i18n-placeholder placeholder="After..." | 85 | i18n-placeholder placeholder="After..." |
@@ -70,7 +89,7 @@ | |||
70 | </div> | 89 | </div> |
71 | <div class="pr-0 col-sm-6"> | 90 | <div class="pr-0 col-sm-6"> |
72 | <input | 91 | <input |
73 | (change)="inputUpdated()" | 92 | (change)="onInputUpdated()" |
74 | (keydown.enter)="$event.preventDefault()" | 93 | (keydown.enter)="$event.preventDefault()" |
75 | type="text" id="original-publication-before" name="original-publication-before" | 94 | type="text" id="original-publication-before" name="original-publication-before" |
76 | i18n-placeholder placeholder="Before..." | 95 | i18n-placeholder placeholder="Before..." |
@@ -93,7 +112,7 @@ | |||
93 | </div> | 112 | </div> |
94 | 113 | ||
95 | <div class="peertube-radio-container" *ngFor="let duration of durationRanges"> | 114 | <div class="peertube-radio-container" *ngFor="let duration of durationRanges"> |
96 | <input type="radio" (change)="inputUpdated()" name="durationRange" [id]="duration.id" [value]="duration.id" [(ngModel)]="durationRange"> | 115 | <input type="radio" (change)="onInputUpdated()" name="durationRange" [id]="duration.id" [value]="duration.id" [(ngModel)]="durationRange"> |
97 | <label [for]="duration.id" class="radio">{{ duration.label }}</label> | 116 | <label [for]="duration.id" class="radio">{{ duration.label }}</label> |
98 | </div> | 117 | </div> |
99 | </div> | 118 | </div> |
diff --git a/client/src/app/+search/search-filters.component.ts b/client/src/app/+search/search-filters.component.ts index a2af9a942..59aba22ff 100644 --- a/client/src/app/+search/search-filters.component.ts +++ b/client/src/app/+search/search-filters.component.ts | |||
@@ -3,6 +3,8 @@ import { ServerService } from '@app/core' | |||
3 | import { AdvancedSearch } from '@app/shared/shared-search' | 3 | import { AdvancedSearch } from '@app/shared/shared-search' |
4 | import { ServerConfig, VideoConstant } from '@shared/models' | 4 | import { ServerConfig, VideoConstant } from '@shared/models' |
5 | 5 | ||
6 | type FormOption = { id: string, label: string } | ||
7 | |||
6 | @Component({ | 8 | @Component({ |
7 | selector: 'my-search-filters', | 9 | selector: 'my-search-filters', |
8 | styleUrls: [ './search-filters.component.scss' ], | 10 | styleUrls: [ './search-filters.component.scss' ], |
@@ -17,9 +19,10 @@ export class SearchFiltersComponent implements OnInit { | |||
17 | videoLicences: VideoConstant<number>[] = [] | 19 | videoLicences: VideoConstant<number>[] = [] |
18 | videoLanguages: VideoConstant<string>[] = [] | 20 | videoLanguages: VideoConstant<string>[] = [] |
19 | 21 | ||
20 | publishedDateRanges: { id: string, label: string }[] = [] | 22 | publishedDateRanges: FormOption[] = [] |
21 | sorts: { id: string, label: string }[] = [] | 23 | sorts: FormOption[] = [] |
22 | durationRanges: { id: string, label: string }[] = [] | 24 | durationRanges: FormOption[] = [] |
25 | videoType: FormOption[] = [] | ||
23 | 26 | ||
24 | publishedDateRange: string | 27 | publishedDateRange: string |
25 | durationRange: string | 28 | durationRange: string |
@@ -34,10 +37,6 @@ export class SearchFiltersComponent implements OnInit { | |||
34 | ) { | 37 | ) { |
35 | this.publishedDateRanges = [ | 38 | this.publishedDateRanges = [ |
36 | { | 39 | { |
37 | id: 'any_published_date', | ||
38 | label: $localize`Any` | ||
39 | }, | ||
40 | { | ||
41 | id: 'today', | 40 | id: 'today', |
42 | label: $localize`Today` | 41 | label: $localize`Today` |
43 | }, | 42 | }, |
@@ -55,12 +54,19 @@ export class SearchFiltersComponent implements OnInit { | |||
55 | } | 54 | } |
56 | ] | 55 | ] |
57 | 56 | ||
58 | this.durationRanges = [ | 57 | this.videoType = [ |
59 | { | 58 | { |
60 | id: 'any_duration', | 59 | id: 'vod', |
61 | label: $localize`Any` | 60 | label: $localize`VOD videos` |
62 | }, | 61 | }, |
63 | { | 62 | { |
63 | id: 'live', | ||
64 | label: $localize`Live videos` | ||
65 | } | ||
66 | ] | ||
67 | |||
68 | this.durationRanges = [ | ||
69 | { | ||
64 | id: 'short', | 70 | id: 'short', |
65 | label: $localize`Short (< 4 min)` | 71 | label: $localize`Short (< 4 min)` |
66 | }, | 72 | }, |
@@ -104,24 +110,26 @@ export class SearchFiltersComponent implements OnInit { | |||
104 | this.loadOriginallyPublishedAtYears() | 110 | this.loadOriginallyPublishedAtYears() |
105 | } | 111 | } |
106 | 112 | ||
107 | inputUpdated () { | 113 | onInputUpdated () { |
108 | this.updateModelFromDurationRange() | 114 | this.updateModelFromDurationRange() |
109 | this.updateModelFromPublishedRange() | 115 | this.updateModelFromPublishedRange() |
110 | this.updateModelFromOriginallyPublishedAtYears() | 116 | this.updateModelFromOriginallyPublishedAtYears() |
111 | } | 117 | } |
112 | 118 | ||
113 | formUpdated () { | 119 | formUpdated () { |
114 | this.inputUpdated() | 120 | this.onInputUpdated() |
115 | this.filtered.emit(this.advancedSearch) | 121 | this.filtered.emit(this.advancedSearch) |
116 | } | 122 | } |
117 | 123 | ||
118 | reset () { | 124 | reset () { |
119 | this.advancedSearch.reset() | 125 | this.advancedSearch.reset() |
126 | |||
127 | this.resetOriginalPublicationYears() | ||
128 | |||
120 | this.durationRange = undefined | 129 | this.durationRange = undefined |
121 | this.publishedDateRange = undefined | 130 | this.publishedDateRange = undefined |
122 | this.originallyPublishedStartYear = undefined | 131 | |
123 | this.originallyPublishedEndYear = undefined | 132 | this.onInputUpdated() |
124 | this.inputUpdated() | ||
125 | } | 133 | } |
126 | 134 | ||
127 | resetField (fieldName: string, value?: any) { | 135 | resetField (fieldName: string, value?: any) { |
@@ -130,7 +138,7 @@ export class SearchFiltersComponent implements OnInit { | |||
130 | 138 | ||
131 | resetLocalField (fieldName: string, value?: any) { | 139 | resetLocalField (fieldName: string, value?: any) { |
132 | this[fieldName] = value | 140 | this[fieldName] = value |
133 | this.inputUpdated() | 141 | this.onInputUpdated() |
134 | } | 142 | } |
135 | 143 | ||
136 | resetOriginalPublicationYears () { | 144 | resetOriginalPublicationYears () { |
diff --git a/client/src/app/+search/search-routing.module.ts b/client/src/app/+search/search-routing.module.ts index e5d7d1ede..0d778af0d 100644 --- a/client/src/app/+search/search-routing.module.ts +++ b/client/src/app/+search/search-routing.module.ts | |||
@@ -1,6 +1,5 @@ | |||
1 | import { NgModule } from '@angular/core' | 1 | import { NgModule } from '@angular/core' |
2 | import { RouterModule, Routes } from '@angular/router' | 2 | import { RouterModule, Routes } from '@angular/router' |
3 | import { MetaGuard } from '@ngx-meta/core' | ||
4 | import { ChannelLazyLoadResolver } from './channel-lazy-load.resolver' | 3 | import { ChannelLazyLoadResolver } from './channel-lazy-load.resolver' |
5 | import { SearchComponent } from './search.component' | 4 | import { SearchComponent } from './search.component' |
6 | import { VideoLazyLoadResolver } from './video-lazy-load.resolver' | 5 | import { VideoLazyLoadResolver } from './video-lazy-load.resolver' |
@@ -9,7 +8,6 @@ const searchRoutes: Routes = [ | |||
9 | { | 8 | { |
10 | path: '', | 9 | path: '', |
11 | component: SearchComponent, | 10 | component: SearchComponent, |
12 | canActivate: [ MetaGuard ], | ||
13 | data: { | 11 | data: { |
14 | meta: { | 12 | meta: { |
15 | title: $localize`Search` | 13 | title: $localize`Search` |
@@ -19,7 +17,6 @@ const searchRoutes: Routes = [ | |||
19 | { | 17 | { |
20 | path: 'lazy-load-video', | 18 | path: 'lazy-load-video', |
21 | component: SearchComponent, | 19 | component: SearchComponent, |
22 | canActivate: [ MetaGuard ], | ||
23 | resolve: { | 20 | resolve: { |
24 | data: VideoLazyLoadResolver | 21 | data: VideoLazyLoadResolver |
25 | } | 22 | } |
@@ -27,7 +24,6 @@ const searchRoutes: Routes = [ | |||
27 | { | 24 | { |
28 | path: 'lazy-load-channel', | 25 | path: 'lazy-load-channel', |
29 | component: SearchComponent, | 26 | component: SearchComponent, |
30 | canActivate: [ MetaGuard ], | ||
31 | resolve: { | 27 | resolve: { |
32 | data: ChannelLazyLoadResolver | 28 | data: ChannelLazyLoadResolver |
33 | } | 29 | } |
diff --git a/client/src/app/+search/search.component.ts b/client/src/app/+search/search.component.ts index 8a781cbe4..4381659e1 100644 --- a/client/src/app/+search/search.component.ts +++ b/client/src/app/+search/search.component.ts | |||
@@ -1,12 +1,11 @@ | |||
1 | import { forkJoin, of, Subscription } from 'rxjs' | 1 | import { forkJoin, of, Subscription } from 'rxjs' |
2 | import { Component, OnDestroy, OnInit } from '@angular/core' | 2 | import { Component, OnDestroy, OnInit } from '@angular/core' |
3 | import { ActivatedRoute, Router } from '@angular/router' | 3 | import { ActivatedRoute, Router } from '@angular/router' |
4 | import { AuthService, ComponentPagination, HooksService, Notifier, ServerService, User, UserService } from '@app/core' | 4 | import { AuthService, ComponentPagination, HooksService, MetaService, Notifier, ServerService, User, UserService } from '@app/core' |
5 | import { immutableAssign } from '@app/helpers' | 5 | import { immutableAssign } from '@app/helpers' |
6 | import { Video, VideoChannel } from '@app/shared/shared-main' | 6 | import { Video, VideoChannel } from '@app/shared/shared-main' |
7 | import { AdvancedSearch, SearchService } from '@app/shared/shared-search' | 7 | import { AdvancedSearch, SearchService } from '@app/shared/shared-search' |
8 | import { MiniatureDisplayOptions, VideoLinkType } from '@app/shared/shared-video-miniature' | 8 | import { MiniatureDisplayOptions, VideoLinkType } from '@app/shared/shared-video-miniature' |
9 | import { MetaService } from '@ngx-meta/core' | ||
10 | import { SearchTargetType, ServerConfig } from '@shared/models' | 9 | import { SearchTargetType, ServerConfig } from '@shared/models' |
11 | 10 | ||
12 | @Component({ | 11 | @Component({ |
@@ -238,7 +237,10 @@ export class SearchComponent implements OnInit, OnDestroy { | |||
238 | } | 237 | } |
239 | 238 | ||
240 | private updateTitle () { | 239 | private updateTitle () { |
241 | const suffix = this.currentSearch ? ' ' + this.currentSearch : '' | 240 | const suffix = this.currentSearch |
241 | ? ' ' + this.currentSearch | ||
242 | : '' | ||
243 | |||
242 | this.metaService.setTitle($localize`Search` + suffix) | 244 | this.metaService.setTitle($localize`Search` + suffix) |
243 | } | 245 | } |
244 | 246 | ||