diff options
author | Chocobozzz <me@florianbigard.com> | 2021-05-03 11:06:19 +0200 |
---|---|---|
committer | Chocobozzz <me@florianbigard.com> | 2021-05-03 16:42:15 +0200 |
commit | 1fd61899eaea245a5844e33e21f04b2562f16e5e (patch) | |
tree | 2a1d51b37b12219cade35e189d62686cd0fec105 /client/src/app/core/rest | |
parent | dfcb6f50a607b6b402b4f8fa3d43792d61c912a5 (diff) | |
download | PeerTube-1fd61899eaea245a5844e33e21f04b2562f16e5e.tar.gz PeerTube-1fd61899eaea245a5844e33e21f04b2562f16e5e.tar.zst PeerTube-1fd61899eaea245a5844e33e21f04b2562f16e5e.zip |
Add ability to filter my videos by live
Diffstat (limited to 'client/src/app/core/rest')
-rw-r--r-- | client/src/app/core/rest/rest-table.ts | 72 |
1 files changed, 3 insertions, 69 deletions
diff --git a/client/src/app/core/rest/rest-table.ts b/client/src/app/core/rest/rest-table.ts index 32c1db446..9baab8a39 100644 --- a/client/src/app/core/rest/rest-table.ts +++ b/client/src/app/core/rest/rest-table.ts | |||
@@ -1,14 +1,14 @@ | |||
1 | import * as debug from 'debug' | 1 | import * as debug from 'debug' |
2 | import { LazyLoadEvent, SortMeta } from 'primeng/api' | 2 | import { LazyLoadEvent, SortMeta } from 'primeng/api' |
3 | import { Subject } from 'rxjs' | 3 | import { Subject } from 'rxjs' |
4 | import { debounceTime, distinctUntilChanged } from 'rxjs/operators' | 4 | import { ActivatedRoute, Router } from '@angular/router' |
5 | import { ActivatedRoute, Params, Router } from '@angular/router' | ||
6 | import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage' | 5 | import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage' |
6 | import { RouteFilter } from '../routing' | ||
7 | import { RestPagination } from './rest-pagination' | 7 | import { RestPagination } from './rest-pagination' |
8 | 8 | ||
9 | const logger = debug('peertube:tables:RestTable') | 9 | const logger = debug('peertube:tables:RestTable') |
10 | 10 | ||
11 | export abstract class RestTable { | 11 | export abstract class RestTable extends RouteFilter { |
12 | 12 | ||
13 | abstract totalRecords: number | 13 | abstract totalRecords: number |
14 | abstract sort: SortMeta | 14 | abstract sort: SortMeta |
@@ -19,8 +19,6 @@ export abstract class RestTable { | |||
19 | rowsPerPage = this.rowsPerPageOptions[0] | 19 | rowsPerPage = this.rowsPerPageOptions[0] |
20 | expandedRows = {} | 20 | expandedRows = {} |
21 | 21 | ||
22 | baseRoute: string | ||
23 | |||
24 | protected searchStream: Subject<string> | 22 | protected searchStream: Subject<string> |
25 | 23 | ||
26 | protected route: ActivatedRoute | 24 | protected route: ActivatedRoute |
@@ -66,55 +64,6 @@ export abstract class RestTable { | |||
66 | peertubeLocalStorage.setItem(this.getSortLocalStorageKey(), JSON.stringify(this.sort)) | 64 | peertubeLocalStorage.setItem(this.getSortLocalStorageKey(), JSON.stringify(this.sort)) |
67 | } | 65 | } |
68 | 66 | ||
69 | initSearch () { | ||
70 | this.searchStream = new Subject() | ||
71 | |||
72 | this.searchStream | ||
73 | .pipe( | ||
74 | debounceTime(400), | ||
75 | distinctUntilChanged() | ||
76 | ) | ||
77 | .subscribe(search => { | ||
78 | this.search = search | ||
79 | |||
80 | logger('On search %s.', this.search) | ||
81 | |||
82 | this.loadData() | ||
83 | }) | ||
84 | } | ||
85 | |||
86 | onSearch (event: Event) { | ||
87 | const target = event.target as HTMLInputElement | ||
88 | this.searchStream.next(target.value) | ||
89 | |||
90 | this.setQueryParams((event.target as HTMLInputElement).value) | ||
91 | } | ||
92 | |||
93 | setQueryParams (search: string) { | ||
94 | if (!this.baseRoute) return | ||
95 | |||
96 | const queryParams: Params = {} | ||
97 | |||
98 | if (search) Object.assign(queryParams, { search }) | ||
99 | this.router.navigate([ this.baseRoute ], { queryParams }) | ||
100 | } | ||
101 | |||
102 | resetTableFilter () { | ||
103 | this.setTableFilter('') | ||
104 | this.setQueryParams('') | ||
105 | this.resetSearch() | ||
106 | } | ||
107 | |||
108 | listenToSearchChange () { | ||
109 | this.route.queryParams | ||
110 | .subscribe(params => { | ||
111 | this.search = params.search || '' | ||
112 | |||
113 | // Primeng table will run an event to load data | ||
114 | this.setTableFilter(this.search) | ||
115 | }) | ||
116 | } | ||
117 | |||
118 | onPage (event: { first: number, rows: number }) { | 67 | onPage (event: { first: number, rows: number }) { |
119 | logger('On page %o.', event) | 68 | logger('On page %o.', event) |
120 | 69 | ||
@@ -131,21 +80,6 @@ export abstract class RestTable { | |||
131 | this.expandedRows = {} | 80 | this.expandedRows = {} |
132 | } | 81 | } |
133 | 82 | ||
134 | setTableFilter (filter: string, triggerEvent = true) { | ||
135 | // FIXME: cannot use ViewChild, so create a component for the filter input | ||
136 | const filterInput = document.getElementById('table-filter') as HTMLInputElement | ||
137 | if (!filterInput) return | ||
138 | |||
139 | filterInput.value = filter | ||
140 | |||
141 | if (triggerEvent) filterInput.dispatchEvent(new Event('keyup')) | ||
142 | } | ||
143 | |||
144 | resetSearch () { | ||
145 | this.searchStream.next('') | ||
146 | this.setTableFilter('') | ||
147 | } | ||
148 | |||
149 | protected abstract loadData (): void | 83 | protected abstract loadData (): void |
150 | 84 | ||
151 | private getSortLocalStorageKey () { | 85 | private getSortLocalStorageKey () { |