github/Ombi
1
0
Fork 0
mirror of https://github.com/Ombi-app/Ombi.git synced 2025-08-19 21:03:17 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

Got the search properly working !wip

Browse source
This commit is contained in:
tidusjar 2019-01-26 13:43:39 +00:00
commit ce33a4212d
3 changed files with 17 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/Ombi/ClientApp/src/app/my-nav/nav-search.component.html
View file

@ -1,15 +1,14 @@
<mat-form-field class="quater-width">
<input [(ngModel)]="searchText" (keyup)="search($event)" matInput [matAutocomplete]="auto">
<mat-autocomplete #auto="matAutocomplete">
<mat-option *ngFor="let option of searchResult" [value]="option">
<img src="https://image.tmdb.org/t/p/w92/{{option.poster_path}}" class="autocomplete-img" aria-hidden/>
<span *ngIf="option.media_type == 'tv'">
{{option.name}}
<mat-autocomplete #auto="matAutocomplete" (optionSelected)="selected($event)">
<mat-option *ngFor="let result of searchResult" [value]="result">
<img src="https://image.tmdb.org/t/p/w92/{{result.poster_path}}" class="autocomplete-img" aria-hidden/>
<span *ngIf="result.media_type == 'tv'">
{{result.name}}
</span>
<span *ngIf="option.media_type == 'movie'">
{{option.title}}
<span *ngIf="result.media_type == 'movie'">
{{result.title}}
</span>
</mat-option>
</mat-autocomplete>
</mat-form-field>
</mat-toolbar>
</mat-form-field>

2
src/Ombi/ClientApp/src/app/my-nav/nav-search.component.scss
View file

@ -1,5 +1,5 @@
.quater-width {
width: 25%;
width: 25em;
}
.autocomplete-img {

12
src/Ombi/ClientApp/src/app/my-nav/nav-search.component.ts
View file

@ -1,10 +1,10 @@
import { Component, Input } from '@angular/core';
import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
import { Observable, Subject } from 'rxjs';
import { map, debounceTime, distinctUntilChanged } from 'rxjs/operators';
import { Subject } from 'rxjs';
import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
import { SearchV2Service } from '../services/searchV2.service';
import { IMultiSearchResult } from '../interfaces';
import { MatAutocompleteSelectedEvent } from '@angular/material';
@Component({
selector: 'app-nav-search',
@ -16,7 +16,6 @@ export class NavSearchComponent {
public searchChanged: Subject<string> = new Subject<string>();
public searchText: string;
public searchResult: IMultiSearchResult[];
public option: IMultiSearchResult;
constructor(private searchService: SearchV2Service) {
this.searchChanged.pipe(
@ -31,4 +30,9 @@ export class NavSearchComponent {
public search(text: any) {
this.searchChanged.next(text.target.value);
}
public selected(option: MatAutocompleteSelectedEvent) {
var selected = option.option.value as IMultiSearchResult;
}
}