mirror of
https://github.com/Ombi-app/Ombi.git
synced 2025-08-20 21:33:15 -07:00
Added the new search, when searching it now will display the results similar to the discover page
* Also made minor improvements to the banners displayed for TV shows
This commit is contained in:
parent
74db3cd573
commit
39680792e9
16 changed files with 245 additions and 25 deletions
|
@ -42,6 +42,7 @@
|
|||
"font-awesome": "^4.7.0",
|
||||
"fullcalendar": "^4.0.0-alpha.4",
|
||||
"jquery": "3.3.1",
|
||||
"lodash": "^4.17.20",
|
||||
"moment": "^2.23.0",
|
||||
"ng2-cookies": "^1.0.12",
|
||||
"ngx-clipboard": "^12.1.0",
|
||||
|
|
|
@ -67,6 +67,7 @@ import { SignalRNotificationService } from "./services/signlarnotification.servi
|
|||
import { MatMenuModule } from "@angular/material/menu";
|
||||
import { RemainingRequestsComponent } from "./shared/remaining-requests/remaining-requests.component";
|
||||
import { UnauthorizedInterceptor } from "./auth/unauthorized.interceptor";
|
||||
import { FilterService } from "./discover/services/filter-service";
|
||||
|
||||
const routes: Routes = [
|
||||
{ path: "*", component: PageNotFoundComponent },
|
||||
|
@ -193,6 +194,7 @@ export function JwtTokenGetter() {
|
|||
MessageService,
|
||||
StorageService,
|
||||
RequestService,
|
||||
FilterService,
|
||||
SignalRNotificationService,
|
||||
{
|
||||
provide: APP_BASE_HREF,
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<div class="card-spacing box" *ngIf="result">
|
||||
<mat-card class="mat-elevation-z8 dark-card grow">
|
||||
<div class="card-spacing box" *ngIf="result" [style.display]="hide ? 'none' : 'block'">
|
||||
<mat-card class="mat-elevation-z8 dark-card">
|
||||
<div class="ribbon {{getStatusClass()}} ribbon-top-right"><span>
|
||||
{{getAvailbilityStatus()}}
|
||||
</span></div>
|
||||
|
|
|
@ -73,7 +73,6 @@ small {
|
|||
.box {
|
||||
position: relative;
|
||||
max-width: 600px;
|
||||
box-shadow: 0 0 15px rgba(0,0,0,.1);
|
||||
}
|
||||
|
||||
/* common */
|
||||
|
|
|
@ -16,6 +16,7 @@ export class DiscoverCardComponent implements OnInit {
|
|||
|
||||
@Input() public result: IDiscoverCardResult;
|
||||
public RequestType = RequestType;
|
||||
public hide: boolean;
|
||||
|
||||
constructor(private searchService: SearchV2Service, private dialog: MatDialog) { }
|
||||
|
||||
|
@ -33,7 +34,15 @@ export class DiscoverCardComponent implements OnInit {
|
|||
}
|
||||
|
||||
public async getExtraTvInfo() {
|
||||
var result = await this.searchService.getTvInfo(this.result.id);
|
||||
if (this.result.tvMovieDb) {
|
||||
var result = await this.searchService.getTvInfoWithMovieDbId(this.result.id);
|
||||
} else {
|
||||
var result = await this.searchService.getTvInfo(this.result.id);
|
||||
}
|
||||
if(result.status === "404") {
|
||||
this.hide = true;
|
||||
return;
|
||||
}
|
||||
this.setTvDefaults(result);
|
||||
this.updateTvItem(result);
|
||||
|
||||
|
@ -80,14 +89,16 @@ export class DiscoverCardComponent implements OnInit {
|
|||
this.result.requested = updated.requested;
|
||||
this.result.requested = updated.requestProcessing;
|
||||
this.result.rating = updated.voteAverage;
|
||||
this.result.overview = updated.overview;
|
||||
this.result.imdbid = updated.imdbId;
|
||||
}
|
||||
|
||||
|
||||
private setTvDefaults(x: ISearchTvResultV2) {
|
||||
if (!x.imdbId) {
|
||||
x.imdbId = "https://www.tvmaze.com/shows/" + x.seriesId;
|
||||
} else {
|
||||
if (x.imdbId) {
|
||||
x.imdbId = "http://www.imdb.com/title/" + x.imdbId + "/";
|
||||
} else {
|
||||
x.imdbId = "https://www.tvmaze.com/shows/" + x.seriesId;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -98,6 +109,8 @@ export class DiscoverCardComponent implements OnInit {
|
|||
this.result.posterPath = updated.banner;
|
||||
this.result.requested = updated.requested;
|
||||
this.result.url = updated.imdbId;
|
||||
this.result.overview = updated.overview;
|
||||
this.result.approved = updated.approved;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -8,6 +8,7 @@ import { AuthGuard } from "../../auth/auth.guard";
|
|||
import { SearchService, RequestService } from "../../services";
|
||||
import { MatDialog } from "@angular/material/dialog";
|
||||
import { DiscoverGridComponent } from "./grid/discover-grid.component";
|
||||
import { DiscoverSearchResultsComponent } from "./search-results/search-results.component";
|
||||
|
||||
|
||||
export const components: any[] = [
|
||||
|
@ -17,6 +18,7 @@ export const components: any[] = [
|
|||
DiscoverCollectionsComponent,
|
||||
DiscoverActorComponent,
|
||||
DiscoverGridComponent,
|
||||
DiscoverSearchResultsComponent,
|
||||
];
|
||||
|
||||
|
||||
|
@ -33,5 +35,6 @@ export const providers: any[] = [
|
|||
export const routes: Routes = [
|
||||
{ path: "", component: DiscoverComponent, canActivate: [AuthGuard] },
|
||||
{ path: "collection/:collectionId", component: DiscoverCollectionsComponent, canActivate: [AuthGuard] },
|
||||
{ path: "actor/:actorId", component: DiscoverActorComponent, canActivate: [AuthGuard] }
|
||||
{ path: "actor/:actorId", component: DiscoverActorComponent, canActivate: [AuthGuard] },
|
||||
{ path: ":searchTerm", component: DiscoverSearchResultsComponent, canActivate: [AuthGuard] },
|
||||
];
|
|
@ -0,0 +1,10 @@
|
|||
<div class="small-middle-container" >
|
||||
<div *ngIf="loadingFlag" class="row justify-content-md-center top-spacing loading-spinner">
|
||||
<mat-spinner [color]="'accent'"></mat-spinner>
|
||||
</div>
|
||||
<div *ngIf="discoverResults" class="row full-height">
|
||||
<div class="col-xl-2 col-lg-3 col-md-3 col-6 col-sm-4 small-padding" *ngFor="let result of discoverResults">
|
||||
<discover-card [result]="result"></discover-card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
|
@ -0,0 +1,19 @@
|
|||
.full-height {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.small-padding {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
margin-bottom: 28px;
|
||||
}
|
||||
|
||||
.loading-spinner {
|
||||
margin: 10%;
|
||||
}
|
|
@ -0,0 +1,143 @@
|
|||
import { Component, OnInit } from "@angular/core";
|
||||
import { ActivatedRoute } from "@angular/router";
|
||||
import { SearchV2Service } from "../../../services";
|
||||
import { IDiscoverCardResult } from "../../interfaces";
|
||||
import { IMultiSearchResult, RequestType } from "../../../interfaces";
|
||||
import { FilterService } from "../../services/filter-service";
|
||||
import { SearchFilter } from "../../../my-nav/SearchFilter";
|
||||
import { StorageService } from "../../../shared/storage/storage-service";
|
||||
|
||||
import { isEqual } from "lodash";
|
||||
|
||||
@Component({
|
||||
templateUrl: "./search-results.component.html",
|
||||
styleUrls: ["./search-results.component.scss"],
|
||||
})
|
||||
export class DiscoverSearchResultsComponent implements OnInit {
|
||||
|
||||
public loadingFlag: boolean;
|
||||
public searchTerm: string;
|
||||
public results: IMultiSearchResult[];
|
||||
|
||||
public discoverResults: IDiscoverCardResult[] = [];
|
||||
|
||||
public filter: SearchFilter;
|
||||
|
||||
constructor(private searchService: SearchV2Service,
|
||||
private route: ActivatedRoute,
|
||||
private filterService: FilterService,
|
||||
private store: StorageService) {
|
||||
this.route.params.subscribe((params: any) => {
|
||||
this.searchTerm = params.searchTerm;
|
||||
this.clear();
|
||||
this.init();
|
||||
});
|
||||
}
|
||||
|
||||
public async ngOnInit() {
|
||||
this.loadingFlag = true;
|
||||
|
||||
this.filterService.onFilterChange.subscribe(async x => {
|
||||
if (!isEqual(this.filter, x)) {
|
||||
this.filter = { ...x };
|
||||
await this.search();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
public async init() {
|
||||
var filter = this.store.get("searchFilter");
|
||||
if (filter) {
|
||||
this.filter = Object.assign(new SearchFilter(), JSON.parse(filter));
|
||||
}
|
||||
this.loading();
|
||||
await this.search();
|
||||
}
|
||||
|
||||
public createInitalModel() {
|
||||
this.finishLoading();
|
||||
this.results.forEach(m => {
|
||||
|
||||
let mediaType = RequestType.movie;
|
||||
if (m.mediaType == "movie") {
|
||||
mediaType = RequestType.movie;
|
||||
} else if (m.mediaType == "tv") {
|
||||
mediaType = RequestType.tvShow;
|
||||
} else if (m.mediaType == "Artist") {
|
||||
mediaType = RequestType.album;
|
||||
}
|
||||
|
||||
this.discoverResults.push({
|
||||
posterPath: `https://image.tmdb.org/t/p/w300/${m.poster}`,
|
||||
requested: false,
|
||||
title: m.title,
|
||||
type: mediaType,
|
||||
id: +m.id,
|
||||
url: "",
|
||||
rating: 0,
|
||||
overview: "",
|
||||
approved: false,
|
||||
imdbid: "",
|
||||
denied: false,
|
||||
background: "",
|
||||
available: false,
|
||||
tvMovieDb: mediaType === RequestType.tvShow ? true : false
|
||||
});
|
||||
|
||||
// switch (mediaType) {
|
||||
// case RequestType.movie:
|
||||
// this.searchService.getFullMovieDetails(+m.id)
|
||||
// .subscribe(x => {
|
||||
// const index = this.discoverResults.findIndex((obj => obj.id === +m.id));
|
||||
// this.discoverResults[index].available = x.available;
|
||||
// this.discoverResults[index].requested = x.requested;
|
||||
// this.discoverResults[index].requested = x.requested;
|
||||
// this.discoverResults[index].requested = x.requested;
|
||||
// this.discoverResults[index].requested = x.requested;
|
||||
// this.discoverResults[index].requested = x.requested;
|
||||
// });
|
||||
// }
|
||||
});
|
||||
}
|
||||
|
||||
// private createModel() {
|
||||
// this.finishLoading();
|
||||
// this.collection.collection.forEach(m => {
|
||||
// this.discoverResults.push({
|
||||
// available: m.available,
|
||||
// posterPath: `https://image.tmdb.org/t/p/w300/${m.posterPath}`,
|
||||
// requested: m.requested,
|
||||
// title: m.title,
|
||||
// type: RequestType.movie,
|
||||
// id: m.id,
|
||||
// url: `http://www.imdb.com/title/${m.imdbId}/`,
|
||||
// rating: 0,
|
||||
// overview: m.overview,
|
||||
// approved: m.approved,
|
||||
// imdbid: m.imdbId,
|
||||
// denied:false,
|
||||
// background: ""
|
||||
// });
|
||||
// });
|
||||
// }
|
||||
|
||||
private loading() {
|
||||
this.loadingFlag = true;
|
||||
}
|
||||
|
||||
private finishLoading() {
|
||||
this.loadingFlag = false;
|
||||
}
|
||||
|
||||
private clear() {
|
||||
this.results = [];
|
||||
this.discoverResults = [];
|
||||
}
|
||||
|
||||
private async search() {
|
||||
this.clear();
|
||||
this.results = await this.searchService
|
||||
.multiSearch(this.searchTerm, this.filter).toPromise();
|
||||
this.createInitalModel();
|
||||
}
|
||||
}
|
|
@ -14,6 +14,8 @@ export interface IDiscoverCardResult {
|
|||
overview: string;
|
||||
imdbid: string;
|
||||
background: string|any;
|
||||
|
||||
tvMovieDb?: boolean;
|
||||
}
|
||||
|
||||
export enum DiscoverOption {
|
||||
|
|
|
@ -0,0 +1,14 @@
|
|||
import { EventEmitter, Injectable, Output } from "@angular/core";
|
||||
import { SearchFilter } from "../../my-nav/SearchFilter";
|
||||
|
||||
@Injectable()
|
||||
export class FilterService {
|
||||
|
||||
@Output() public onFilterChange = new EventEmitter<SearchFilter>();
|
||||
public filter: SearchFilter;
|
||||
|
||||
public changeFilter(filter: SearchFilter) {
|
||||
this.filter = filter;
|
||||
this.onFilterChange.emit(this.filter);
|
||||
}
|
||||
}
|
|
@ -68,10 +68,7 @@ export class MovieDetailsComponent implements OnInit {
|
|||
this.hasRequest = true;
|
||||
this.movieRequest = await this.requestService.getMovieRequest(this.movie.requestId);
|
||||
}
|
||||
this.imageService.getMovieBanner(this.theMovidDbId.toString()).subscribe(x => {
|
||||
this.movie.background = this.sanitizer.bypassSecurityTrustStyle
|
||||
("url(" + x + ")");
|
||||
});
|
||||
this.loadBanner();
|
||||
});
|
||||
} else {
|
||||
this.searchService.getFullMovieDetails(this.theMovidDbId).subscribe(async x => {
|
||||
|
@ -81,10 +78,7 @@ export class MovieDetailsComponent implements OnInit {
|
|||
this.hasRequest = true;
|
||||
this.movieRequest = await this.requestService.getMovieRequest(this.movie.requestId);
|
||||
}
|
||||
this.imageService.getMovieBanner(this.theMovidDbId.toString()).subscribe(x => {
|
||||
this.movie.background = this.sanitizer.bypassSecurityTrustStyle
|
||||
("url(" + x + ")");
|
||||
});
|
||||
this.loadBanner();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
@ -178,4 +172,16 @@ export class MovieDetailsComponent implements OnInit {
|
|||
}
|
||||
});
|
||||
}
|
||||
|
||||
private loadBanner() {
|
||||
this.imageService.getMovieBanner(this.theMovidDbId.toString()).subscribe(x => {
|
||||
if (!this.movie.backdropPath) {
|
||||
this.movie.background = this.sanitizer.bypassSecurityTrustStyle
|
||||
("url(" + x + ")");
|
||||
} else {
|
||||
this.movie.background = this.sanitizer.bypassSecurityTrustStyle
|
||||
("url(https://image.tmdb.org/t/p/original/" + this.movie.backdropPath + ")");
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -76,7 +76,7 @@
|
|||
<span class="justify-content-center align-items-center">
|
||||
<!-- Search Bar -->
|
||||
<div>
|
||||
<app-nav-search [filter]="searchFilter"></app-nav-search>
|
||||
<app-nav-search></app-nav-search>
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
|
|
|
@ -9,6 +9,7 @@ import { MatSlideToggleChange } from '@angular/material/slide-toggle';
|
|||
import { SearchFilter } from './SearchFilter';
|
||||
import { Md5 } from 'ts-md5/dist/md5';
|
||||
import { RequestType } from '../interfaces';
|
||||
import { FilterService } from '../discover/services/filter-service';
|
||||
|
||||
export enum SearchFilterType {
|
||||
Movie = 1,
|
||||
|
@ -48,7 +49,8 @@ export class MyNavComponent implements OnInit {
|
|||
|
||||
constructor(private breakpointObserver: BreakpointObserver,
|
||||
private settingsService: SettingsService,
|
||||
private store: StorageService) {
|
||||
private store: StorageService,
|
||||
private filterService: FilterService) {
|
||||
}
|
||||
|
||||
public async ngOnInit() {
|
||||
|
@ -76,6 +78,7 @@ export class MyNavComponent implements OnInit {
|
|||
var filter = this.store.get("searchFilter");
|
||||
if (filter) {
|
||||
this.searchFilter = Object.assign(new SearchFilter(), JSON.parse(filter));
|
||||
this.filterService.changeFilter(this.searchFilter);
|
||||
}
|
||||
this.navItems = [
|
||||
{ name: "NavigationBar.Discover", icon: "find_replace", link: "/discover", requiresAdmin: false, enabled: true, faIcon: null },
|
||||
|
@ -124,6 +127,7 @@ export class MyNavComponent implements OnInit {
|
|||
this.searchFilter.people = event.checked;
|
||||
break;
|
||||
}
|
||||
this.filterService.changeFilter(this.searchFilter);
|
||||
this.store.save("searchFilter", JSON.stringify(this.searchFilter));
|
||||
}
|
||||
|
||||
|
|
|
@ -7,12 +7,12 @@ import {
|
|||
} from "rxjs/operators";
|
||||
|
||||
import { empty} from "rxjs";
|
||||
import { SearchV2Service } from "../services/searchV2.service";
|
||||
import { IMultiSearchResult } from "../interfaces";
|
||||
import { Router } from "@angular/router";
|
||||
import { FormGroup, FormBuilder } from "@angular/forms";
|
||||
import { MatAutocompleteSelectedEvent } from "@angular/material/autocomplete";
|
||||
import { SearchFilter } from "./SearchFilter";
|
||||
import { FilterService } from "../discover/services/filter-service";
|
||||
|
||||
@Component({
|
||||
selector: "app-nav-search",
|
||||
|
@ -20,7 +20,6 @@ import { SearchFilter } from "./SearchFilter";
|
|||
styleUrls: ["./nav-search.component.scss"],
|
||||
})
|
||||
export class NavSearchComponent implements OnInit {
|
||||
@Input() public filter: SearchFilter;
|
||||
public selectedItem: string;
|
||||
public results: IMultiSearchResult[];
|
||||
public searching = false;
|
||||
|
@ -28,7 +27,6 @@ export class NavSearchComponent implements OnInit {
|
|||
public searchForm: FormGroup;
|
||||
|
||||
constructor(
|
||||
private searchService: SearchV2Service,
|
||||
private router: Router,
|
||||
private fb: FormBuilder
|
||||
) {}
|
||||
|
@ -41,13 +39,14 @@ export class NavSearchComponent implements OnInit {
|
|||
this.searchForm
|
||||
.get("input")
|
||||
.valueChanges.pipe(
|
||||
debounceTime(600),
|
||||
debounceTime(1300),
|
||||
tap(() => (this.searching = true)),
|
||||
switchMap((value: string) => {
|
||||
if (value) {
|
||||
return this.searchService
|
||||
.multiSearch(value, this.filter)
|
||||
.pipe(finalize(() => (this.searching = false)));
|
||||
this.router.navigate([`discover`, value]);
|
||||
// return this.searchService
|
||||
// .multiSearch(value, this.filter)
|
||||
// .pipe(finalize(() => (this.searching = false)));
|
||||
}
|
||||
return empty().pipe(finalize(() => (this.searching = false)));
|
||||
})
|
||||
|
|
|
@ -5242,6 +5242,11 @@ lodash@^4.17.10, lodash@^4.17.11:
|
|||
version "4.17.11"
|
||||
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d"
|
||||
|
||||
lodash@^4.17.20:
|
||||
version "4.17.20"
|
||||
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.20.tgz#b44a9b6297bcb698f1c51a3545a2b3b368d59c52"
|
||||
integrity sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA==
|
||||
|
||||
log-symbols@^3.0.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.yarnpkg.com/log-symbols/-/log-symbols-3.0.0.tgz#f3a08516a5dea893336a7dee14d18a1cfdab77c4"
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue