Added author to search filters.
This commit is contained in:
@ -61,6 +61,12 @@ input:focus {
|
||||
box-shadow: 0 0 4px 3px rgba(31, 128, 255, 0.5);
|
||||
}
|
||||
|
||||
.icon-wrapper>img, .icon-button>img {
|
||||
display: inline;
|
||||
vertical-align: middle;
|
||||
filter: brightness(0) saturate(100%) invert(44%) sepia(0%) saturate(167%) hue-rotate(154deg) brightness(90%) contrast(87%);
|
||||
}
|
||||
|
||||
.icon-button:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
@ -53,6 +53,14 @@
|
||||
<option value="40">40</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="text-wrapper">
|
||||
<label for="authorInput">Author</label>
|
||||
<input #authorInput
|
||||
name="authorInput"
|
||||
type="text"
|
||||
placeholder="J. R. R. Tolkien"
|
||||
[formControl]="author" />
|
||||
</div>
|
||||
<div class="text-wrapper">
|
||||
<label for="isbnInput">ISBN</label>
|
||||
<input #isbnInput
|
||||
|
@ -1,7 +1,7 @@
|
||||
import { AfterViewInit, Component, ElementRef, inject, NgZone, OnDestroy, output, ViewChild } from '@angular/core';
|
||||
import { FormControl, ReactiveFormsModule } from '@angular/forms';
|
||||
import { SearchContextDto } from '../../shared/dto/search-context.dto';
|
||||
import { filter, Subscription } from 'rxjs';
|
||||
import { filter, map, Subscription } from 'rxjs';
|
||||
import { ConfigService } from '../../services/config.service';
|
||||
import { CommonModule } from '@angular/common';
|
||||
|
||||
@ -22,6 +22,7 @@ export class SearchBoxComponent implements AfterViewInit, OnDestroy {
|
||||
@ViewChild('languageSelect') private readonly languageRef: ElementRef<HTMLSelectElement> = {} as ElementRef;
|
||||
@ViewChild('orderBySelect') private readonly orderByRef: ElementRef<HTMLSelectElement> = {} as ElementRef;
|
||||
@ViewChild('resultsSizeSelect') private readonly resultsSizeRef: ElementRef<HTMLSelectElement> = {} as ElementRef;
|
||||
@ViewChild('authorInput') private readonly authorRef: ElementRef<HTMLInputElement> = {} as ElementRef;
|
||||
@ViewChild('isbnInput') private readonly isbnRef: ElementRef<HTMLInputElement> = {} as ElementRef;
|
||||
|
||||
config = inject(ConfigService).config;
|
||||
@ -31,31 +32,47 @@ export class SearchBoxComponent implements AfterViewInit, OnDestroy {
|
||||
filters = new SearchContextDto();
|
||||
filtersOutput = output<SearchContextDto>();
|
||||
isbn = new FormControl<string>('');
|
||||
author = new FormControl<string>('');
|
||||
|
||||
constructor() {
|
||||
this._zone.runOutsideAngular(() => {
|
||||
this._subscriptions.push(
|
||||
this.search.valueChanges.pipe(
|
||||
filter(value => value != null),
|
||||
map(value => value!.trim()),
|
||||
filter(value => value.length > 0),
|
||||
).subscribe((value) => this.searchOutput.emit(value!))
|
||||
);
|
||||
|
||||
this._subscriptions.push(
|
||||
this.author.valueChanges.pipe(
|
||||
filter(value => value != null),
|
||||
map(value => value!.trim()),
|
||||
filter(value => value.length > 0),
|
||||
).subscribe((value) => this.updateFilters('inauthor', { value: value }))
|
||||
);
|
||||
|
||||
this._subscriptions.push(
|
||||
this.isbn.valueChanges.pipe(
|
||||
filter(value => value != null),
|
||||
map(value => value!.trim()),
|
||||
map(value => value.length == 10 || value.length >= 13 && value.length <= 15 ? value : ''),
|
||||
filter(value => value.length > 0),
|
||||
).subscribe((value) => this.updateFilters('isbn', { value: value }))
|
||||
)
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
if (this.languageRef)
|
||||
if (this.languageRef && this.languageRef.nativeElement.value)
|
||||
this.updateFilters('langRestrict', this.languageRef.nativeElement);
|
||||
if (this.orderByRef)
|
||||
if (this.orderByRef && this.orderByRef.nativeElement.value)
|
||||
this.updateFilters('orderBy', this.orderByRef.nativeElement);
|
||||
if (this.resultsSizeRef)
|
||||
if (this.resultsSizeRef && this.resultsSizeRef.nativeElement.value)
|
||||
this.updateFilters('maxResults', this.resultsSizeRef.nativeElement);
|
||||
if (this.isbnRef)
|
||||
if (this.authorRef && this.authorRef.nativeElement.value)
|
||||
this.updateFilters('inauthor', this.authorRef.nativeElement);
|
||||
if (this.isbnRef && this.isbnRef.nativeElement.value)
|
||||
this.updateFilters('isbn', this.isbnRef.nativeElement);
|
||||
}
|
||||
|
||||
@ -71,7 +88,7 @@ export class SearchBoxComponent implements AfterViewInit, OnDestroy {
|
||||
}
|
||||
|
||||
updateFilters(key: string, value: any) {
|
||||
if (key == 'langRestrict' && value == '') {
|
||||
if (!value) {
|
||||
delete this.filters.values[key];
|
||||
} else {
|
||||
this.filters.values[key] = value.value;
|
||||
|
Reference in New Issue
Block a user