-
Notifications
You must be signed in to change notification settings - Fork 388
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
44 changed files
with
652 additions
and
425 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
19 changes: 2 additions & 17 deletions
19
...e/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
9 changes: 9 additions & 0 deletions
9
...filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
<script src="search-facet-option.component.ts"></script><a *ngIf="isVisible | async" class="d-flex flex-row" | ||
[routerLink]="[getSearchLink()]" | ||
[queryParams]="addQueryParams" queryParamsHandling="merge"> | ||
<input type="checkbox" [checked]="false" class="my-1 align-self-stretch"/> | ||
<span class="filter-value px-1">{{filterValue.value}}</span> | ||
<span class="float-right filter-value-count ml-auto"> | ||
<span class="badge badge-secondary badge-pill">{{filterValue.count}}</span> | ||
</span> | ||
</a> |
81 changes: 81 additions & 0 deletions
81
...h-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,81 @@ | ||
import { combineLatest as observableCombineLatest, Observable, Subscription } from 'rxjs'; | ||
import { map, take } from 'rxjs/operators'; | ||
import { Component, Input, OnDestroy, OnInit } from '@angular/core'; | ||
import { Router } from '@angular/router'; | ||
import { FacetValue } from '../../../../search-service/facet-value.model'; | ||
import { SearchFilterConfig } from '../../../../search-service/search-filter-config.model'; | ||
import { SearchService } from '../../../../search-service/search.service'; | ||
import { SearchFilterService } from '../../search-filter.service'; | ||
import { SearchConfigurationService } from '../../../../search-service/search-configuration.service'; | ||
import { hasValue } from '../../../../../shared/empty.util'; | ||
|
||
@Component({ | ||
selector: 'ds-search-facet-option', | ||
templateUrl: './search-facet-option.component.html', | ||
}) | ||
|
||
/** | ||
* Represents a single option in a filter facet | ||
*/ | ||
export class SearchFacetOptionComponent implements OnInit, OnDestroy { | ||
/** | ||
* A single value for this component | ||
*/ | ||
@Input() filterValue: FacetValue; | ||
@Input() filterConfig: SearchFilterConfig; | ||
@Input() selectedValues$: Observable<string[]>; | ||
|
||
isVisible: Observable<boolean>; | ||
|
||
addQueryParams; | ||
sub: Subscription; | ||
|
||
constructor(protected searchService: SearchService, | ||
protected filterService: SearchFilterService, | ||
protected searchConfigService: SearchConfigurationService, | ||
protected router: Router | ||
) { | ||
} | ||
|
||
/** | ||
* Initializes all observable instance variables and starts listening to them | ||
*/ | ||
ngOnInit(): void { | ||
this.isVisible = this.isChecked().pipe(map((checked: boolean) => !checked)); | ||
this.sub = observableCombineLatest(this.selectedValues$, this.searchConfigService.searchOptions) | ||
.subscribe(([selectedValues, searchOptions]) => { | ||
this.updateAddParams(selectedValues) | ||
}); | ||
} | ||
|
||
/** | ||
* Checks if a value for this filter is currently active | ||
*/ | ||
private isChecked(): Observable<boolean> { | ||
return this.filterService.isFilterActiveWithValue(this.filterConfig.paramName, this.filterValue.value); | ||
} | ||
|
||
/** | ||
* @returns {string} The base path to the search page | ||
*/ | ||
getSearchLink() { | ||
return this.searchService.getSearchLink(); | ||
} | ||
|
||
/** | ||
* Calculates the parameters that should change if a given value for this filter would be added to the active filters | ||
* @param {string} value The value that is added for this filter | ||
*/ | ||
private updateAddParams(selectedValues: string[]): void { | ||
this.addQueryParams = { | ||
[this.filterConfig.paramName]: [...selectedValues, this.filterValue.value], | ||
page: 1 | ||
}; | ||
} | ||
|
||
ngOnDestroy(): void { | ||
if (hasValue(this.sub)) { | ||
this.sub.unsubscribe(); | ||
} | ||
} | ||
} |
8 changes: 8 additions & 0 deletions
8
...h-facet-filter-options/search-facet-range-option/search-facet-range-option.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
<a *ngIf="isVisible | async" class="d-flex flex-row" | ||
[routerLink]="[getSearchLink()]" | ||
[queryParams]="changeQueryParams" queryParamsHandling="merge"> | ||
<span class="filter-value px-1">{{filterValue.value}}</span> | ||
<span class="float-right filter-value-count ml-auto"> | ||
<span class="badge badge-secondary badge-pill">{{filterValue.count}}</span> | ||
</span> | ||
</a> |
89 changes: 89 additions & 0 deletions
89
...rch-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,89 @@ | ||
import { Observable, Subscription } from 'rxjs'; | ||
import { map } from 'rxjs/operators'; | ||
import { Component, Input, OnDestroy, OnInit } from '@angular/core'; | ||
import { Router } from '@angular/router'; | ||
import { FacetValue } from '../../../../search-service/facet-value.model'; | ||
import { SearchFilterConfig } from '../../../../search-service/search-filter-config.model'; | ||
import { SearchService } from '../../../../search-service/search.service'; | ||
import { SearchFilterService } from '../../search-filter.service'; | ||
import { | ||
RANGE_FILTER_MAX_SUFFIX, | ||
RANGE_FILTER_MIN_SUFFIX | ||
} from '../../search-range-filter/search-range-filter.component'; | ||
import { SearchConfigurationService } from '../../../../search-service/search-configuration.service'; | ||
import { hasValue } from '../../../../../shared/empty.util'; | ||
|
||
const rangeDelimiter = '-'; | ||
|
||
@Component({ | ||
selector: 'ds-search-facet-range-option', | ||
templateUrl: './search-facet-range-option.component.html', | ||
}) | ||
|
||
/** | ||
* Represents a single option in a filter facet | ||
*/ | ||
export class SearchFacetRangeOptionComponent implements OnInit, OnDestroy { | ||
/** | ||
* A single value for this component | ||
*/ | ||
@Input() filterValue: FacetValue; | ||
@Input() filterConfig: SearchFilterConfig; | ||
|
||
isVisible: Observable<boolean>; | ||
|
||
changeQueryParams; | ||
sub: Subscription; | ||
|
||
constructor(protected searchService: SearchService, | ||
protected filterService: SearchFilterService, | ||
protected searchConfigService: SearchConfigurationService, | ||
protected router: Router | ||
) { | ||
} | ||
|
||
/** | ||
* Initializes all observable instance variables and starts listening to them | ||
*/ | ||
ngOnInit(): void { | ||
this.isVisible = this.isChecked().pipe(map((checked: boolean) => !checked)); | ||
this.sub = this.searchConfigService.searchOptions.subscribe(() => { | ||
this.updateChangeParams() | ||
}); | ||
} | ||
|
||
/** | ||
* Checks if a value for this filter is currently active | ||
*/ | ||
private isChecked(): Observable<boolean> { | ||
return this.filterService.isFilterActiveWithValue(this.filterConfig.paramName, this.filterValue.value); | ||
} | ||
|
||
/** | ||
* @returns {string} The base path to the search page | ||
*/ | ||
getSearchLink() { | ||
return this.searchService.getSearchLink(); | ||
} | ||
|
||
/** | ||
* Calculates the parameters that should change if a given values for this range filter would be changed | ||
* @param {string} value The values that are changed for this filter | ||
*/ | ||
updateChangeParams(): void { | ||
const parts = this.filterValue.value.split(rangeDelimiter); | ||
const min = parts.length > 1 ? parts[0].trim() : this.filterValue.value; | ||
const max = parts.length > 1 ? parts[1].trim() : this.filterValue.value; | ||
this.changeQueryParams = { | ||
[this.filterConfig.paramName + RANGE_FILTER_MIN_SUFFIX]: [min], | ||
[this.filterConfig.paramName + RANGE_FILTER_MAX_SUFFIX]: [max], | ||
page: 1 | ||
}; | ||
} | ||
|
||
ngOnDestroy(): void { | ||
if (hasValue(this.sub)) { | ||
this.sub.unsubscribe(); | ||
} | ||
} | ||
} |
6 changes: 6 additions & 0 deletions
6
...t-filter-options/search-facet-selected-option/search-facet-selected-option.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
<a class="d-flex flex-row" | ||
[routerLink]="[getSearchLink()]" | ||
[queryParams]="removeQueryParams" queryParamsHandling="merge"> | ||
<input type="checkbox" [checked]="true" class="my-1 align-self-stretch"/> | ||
<span class="filter-value pl-1">{{selectedValue}}</span> | ||
</a> |
82 changes: 82 additions & 0 deletions
82
...cet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,82 @@ | ||
import { | ||
combineLatest as observableCombineLatest, | ||
Observable, | ||
of as observableOf, | ||
Subscription | ||
} from 'rxjs'; | ||
import { delay, map } from 'rxjs/operators'; | ||
import { Component, Input, OnChanges, OnDestroy, OnInit, SimpleChanges } from '@angular/core'; | ||
import { Router } from '@angular/router'; | ||
import { FacetValue } from '../../../../search-service/facet-value.model'; | ||
import { SearchFilterConfig } from '../../../../search-service/search-filter-config.model'; | ||
import { SearchService } from '../../../../search-service/search.service'; | ||
import { SearchFilterService } from '../../search-filter.service'; | ||
import { hasValue } from '../../../../../shared/empty.util'; | ||
import { SearchOptions } from '../../../../search-options.model'; | ||
import { SearchConfigurationService } from '../../../../search-service/search-configuration.service'; | ||
|
||
@Component({ | ||
selector: 'ds-search-facet-selected-option', | ||
templateUrl: './search-facet-selected-option.component.html', | ||
}) | ||
|
||
/** | ||
* Represents a single option in a filter facet | ||
*/ | ||
export class SearchFacetSelectedOptionComponent implements OnInit, OnDestroy { | ||
/** | ||
* A single value for this component | ||
*/ | ||
@Input() selectedValue: string; | ||
@Input() filterConfig: SearchFilterConfig; | ||
|
||
/** | ||
* Emits the active values for this filter | ||
*/ | ||
@Input() selectedValues$: Observable<string[]>; | ||
|
||
removeQueryParams; | ||
sub: Subscription; | ||
|
||
constructor(protected searchService: SearchService, | ||
protected filterService: SearchFilterService, | ||
protected searchConfigService: SearchConfigurationService, | ||
protected router: Router | ||
) { | ||
} | ||
|
||
/** | ||
* Initializes all observable instance variables and starts listening to them | ||
*/ | ||
ngOnInit(): void { | ||
this.sub = observableCombineLatest(this.selectedValues$, this.searchConfigService.searchOptions) | ||
.subscribe(([selectedValues, searchOptions]) => { | ||
this.updateRemoveParams(selectedValues) | ||
}); | ||
} | ||
|
||
/** | ||
* @returns {string} The base path to the search page | ||
*/ | ||
getSearchLink() { | ||
return this.searchService.getSearchLink(); | ||
} | ||
|
||
/** | ||
* Calculates the parameters that should change if a given value for this filter would be removed from the active filters | ||
* @param {string} value The value that is removed for this filter | ||
* @returns {Observable<any>} The changed filter parameters | ||
*/ | ||
private updateRemoveParams(selectedValues: string[]): void { | ||
this.removeQueryParams = { | ||
[this.filterConfig.paramName]: selectedValues.filter((v) => v !== this.selectedValue), | ||
page: 1 | ||
}; | ||
} | ||
|
||
ngOnDestroy(): void { | ||
if (hasValue(this.sub)) { | ||
this.sub.unsubscribe(); | ||
} | ||
} | ||
} |
2 changes: 1 addition & 1 deletion
2
...ters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1 +1 @@ | ||
<ng-container *ngComponentOutlet="getSearchFilter(); injector: objectInjector;"></ng-container> | ||
<ng-container *ngComponentOutlet="searchFilter injector: objectInjector;"></ng-container> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.