diff --git a/client/src/app/search/advanced-search.model.ts b/client/src/app/search/advanced-search.model.ts
index 48616a9ae..033fa9bba 100644
--- a/client/src/app/search/advanced-search.model.ts
+++ b/client/src/app/search/advanced-search.model.ts
@@ -110,6 +110,19 @@ export class AdvancedSearch {
}
}
+ size () {
+ let acc = 0
+
+ const obj = this.toUrlObject()
+ for (const k of Object.keys(obj)) {
+ if (k === 'sort') continue // Exception
+
+ if (obj[k] !== undefined) acc++
+ }
+
+ return acc
+ }
+
private intoArray (value: any) {
if (!value) return undefined
diff --git a/client/src/app/search/search.component.html b/client/src/app/search/search.component.html
index 61a05895e..3a87ea1de 100644
--- a/client/src/app/search/search.component.html
+++ b/client/src/app/search/search.component.html
@@ -13,7 +13,10 @@
[attr.aria-expanded]="!isSearchFilterCollapsed" aria-controls="collapseBasic"
>
- Filters
+
+ Filters
+ 0" class="badge badge-secondary">{{ numberOfFilters() }}
+
diff --git a/client/src/app/search/search.component.ts b/client/src/app/search/search.component.ts
index 475fdd277..b86b5083a 100644
--- a/client/src/app/search/search.component.ts
+++ b/client/src/app/search/search.component.ts
@@ -30,7 +30,7 @@ export class SearchComponent implements OnInit, OnDestroy {
currentSearch: string
private subActivatedRoute: Subscription
- private isInitialLoad = true
+ private isInitialLoad = false // set to false to show the search filters on first arrival
private firstSearch = true
private channelsPerPage = 2
@@ -137,6 +137,10 @@ export class SearchComponent implements OnInit, OnDestroy {
this.updateUrlFromAdvancedSearch()
}
+ numberOfFilters () {
+ return this.advancedSearch.size()
+ }
+
private resetPagination () {
this.pagination.currentPage = 1
this.pagination.totalItems = null
@@ -150,9 +154,11 @@ export class SearchComponent implements OnInit, OnDestroy {
}
private updateUrlFromAdvancedSearch () {
+ const search = (this.currentSearch && this.currentSearch !== '') ? this.currentSearch : undefined
+
this.router.navigate([], {
relativeTo: this.route,
- queryParams: Object.assign({}, this.advancedSearch.toUrlObject(), { search: this.currentSearch })
+ queryParams: Object.assign({}, this.advancedSearch.toUrlObject(), { search })
})
}
}
diff --git a/client/src/sass/include/_bootstrap.scss b/client/src/sass/include/_bootstrap.scss
index 9c7464873..0a9c9a903 100644
--- a/client/src/sass/include/_bootstrap.scss
+++ b/client/src/sass/include/_bootstrap.scss
@@ -23,7 +23,7 @@
//@import '~bootstrap/scss/card';
//@import '~bootstrap/scss/breadcrumb';
//@import '~bootstrap/scss/pagination';
-//@import '~bootstrap/scss/badge';
+@import '~bootstrap/scss/badge';
//@import '~bootstrap/scss/jumbotron';
@import '~bootstrap/scss/alert';
//@import '~bootstrap/scss/progress';