mirror of
https://github.com/Ombi-app/Ombi.git
synced 2025-08-20 13:23:20 -07:00
Added actor searching for movies. You can also click on the actors image in the details page to get a list of movies that actor has been in
This commit is contained in:
parent
b12282067a
commit
fe23a01081
9 changed files with 146 additions and 8 deletions
|
@ -0,0 +1,11 @@
|
||||||
|
<div class="small-middle-container" *ngIf="actorCredits">
|
||||||
|
|
||||||
|
<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,59 @@
|
||||||
|
import { Component } from "@angular/core";
|
||||||
|
import { ActivatedRoute } from "@angular/router";
|
||||||
|
import { SearchV2Service, RequestService, MessageService } from "../../services";
|
||||||
|
import { IActorCredits } from "../../interfaces/ISearchTvResultV2";
|
||||||
|
import { IDiscoverCardResult } from "../interfaces";
|
||||||
|
import { RequestType } from "../../interfaces";
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
templateUrl: "./discover-actor.component.html",
|
||||||
|
styleUrls: ["./discover-actor.component.scss"],
|
||||||
|
})
|
||||||
|
export class DiscoverActorComponent {
|
||||||
|
public actorId: number;
|
||||||
|
public actorCredits: IActorCredits;
|
||||||
|
public loadingFlag: boolean;
|
||||||
|
|
||||||
|
public discoverResults: IDiscoverCardResult[] = [];
|
||||||
|
|
||||||
|
constructor(private searchService: SearchV2Service,
|
||||||
|
private route: ActivatedRoute,
|
||||||
|
private requestService: RequestService,
|
||||||
|
private messageService: MessageService) {
|
||||||
|
this.route.params.subscribe((params: any) => {
|
||||||
|
this.actorId = params.actorId;
|
||||||
|
this.loading();
|
||||||
|
this.searchService.getMoviesByActor(this.actorId).subscribe(res => {
|
||||||
|
this.actorCredits = res;
|
||||||
|
this.createModel();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
private createModel() {
|
||||||
|
this.finishLoading();
|
||||||
|
this.discoverResults = [];
|
||||||
|
this.actorCredits.cast.forEach(m => {
|
||||||
|
this.discoverResults.push({
|
||||||
|
available: false, // TODO
|
||||||
|
posterPath: `https://image.tmdb.org/t/p/w300/${m.poster_path}`,
|
||||||
|
requested: false, // TODO
|
||||||
|
title: m.title,
|
||||||
|
type: RequestType.movie,
|
||||||
|
id: m.id,
|
||||||
|
url: null, // TODO
|
||||||
|
rating: 0,
|
||||||
|
overview: m.overview,
|
||||||
|
approved: false // TODO
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
private loading() {
|
||||||
|
this.loadingFlag = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
private finishLoading() {
|
||||||
|
this.loadingFlag = false;
|
||||||
|
}
|
||||||
|
}
|
|
@ -12,10 +12,12 @@ import { PipeModule } from "../pipes/pipe.module";
|
||||||
import { DiscoverCardDetailsComponent } from "./card/discover-card-details.component";
|
import { DiscoverCardDetailsComponent } from "./card/discover-card-details.component";
|
||||||
import { MatDialog } from "@angular/material";
|
import { MatDialog } from "@angular/material";
|
||||||
import { DiscoverCollectionsComponent } from "./collections/discover-collections.component";
|
import { DiscoverCollectionsComponent } from "./collections/discover-collections.component";
|
||||||
|
import { DiscoverActorComponent } from "./actor/discover-actor.component";
|
||||||
|
|
||||||
const routes: Routes = [
|
const routes: Routes = [
|
||||||
{ path: "", component: DiscoverComponent, canActivate: [AuthGuard] },
|
{ path: "", component: DiscoverComponent, canActivate: [AuthGuard] },
|
||||||
{ path: "collection/:collectionId", component: DiscoverCollectionsComponent, canActivate: [AuthGuard] }
|
{ path: "collection/:collectionId", component: DiscoverCollectionsComponent, canActivate: [AuthGuard] },
|
||||||
|
{ path: "actor/:actorId", component: DiscoverActorComponent, canActivate: [AuthGuard] }
|
||||||
];
|
];
|
||||||
@NgModule({
|
@NgModule({
|
||||||
imports: [
|
imports: [
|
||||||
|
@ -29,6 +31,7 @@ const routes: Routes = [
|
||||||
DiscoverCardComponent,
|
DiscoverCardComponent,
|
||||||
DiscoverCardDetailsComponent,
|
DiscoverCardDetailsComponent,
|
||||||
DiscoverCollectionsComponent,
|
DiscoverCollectionsComponent,
|
||||||
|
DiscoverActorComponent,
|
||||||
],
|
],
|
||||||
entryComponents: [
|
entryComponents: [
|
||||||
DiscoverCardDetailsComponent
|
DiscoverCardDetailsComponent
|
||||||
|
|
|
@ -107,3 +107,30 @@ export interface ICrew {
|
||||||
type: string;
|
type: string;
|
||||||
person: IPersonViewModel;
|
person: IPersonViewModel;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface IActorCredits {
|
||||||
|
cast: IActorCast[];
|
||||||
|
crew: IActorCrew[];
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface IActorCast {
|
||||||
|
character: string;
|
||||||
|
poster_path: string;
|
||||||
|
id: number;
|
||||||
|
backdrop_path: string;
|
||||||
|
title: string;
|
||||||
|
overview: string;
|
||||||
|
release_date: Date;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface IActorCrew {
|
||||||
|
id: number;
|
||||||
|
department: string;
|
||||||
|
job: string;
|
||||||
|
overview: string;
|
||||||
|
release_date: Date;
|
||||||
|
title: string;
|
||||||
|
backdrop_path: string;
|
||||||
|
poster_path: string;
|
||||||
|
credit_id: number;
|
||||||
|
}
|
||||||
|
|
|
@ -5,9 +5,14 @@
|
||||||
<ng-template let-item pTemplate="item">
|
<ng-template let-item pTemplate="item">
|
||||||
<div class="row justify-content-md-center mat-card mat-card-flat">
|
<div class="row justify-content-md-center mat-card mat-card-flat">
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<img class="cast-profile-img" *ngIf="item.profile_path" src="https://image.tmdb.org/t/p/w300/{{item.profile_path}}">
|
<a *ngIf="item.profile_path" [routerLink]="'/discover/actor/' + item.id">
|
||||||
<img class="cast-profile-img" *ngIf="item.character?.image?.medium" [src]="item.character.image.medium">
|
<img class="cast-profile-img" src="https://image.tmdb.org/t/p/w300/{{item.profile_path}}">
|
||||||
|
</a>
|
||||||
|
<a *ngIf="item.character?.image?.medium" [routerLink]="'/discover/actor/' + item.person.id">
|
||||||
|
<img class="cast-profile-img" [src]="item.character.image.medium">
|
||||||
|
</a>
|
||||||
<!-- TODO get profile image default -->
|
<!-- TODO get profile image default -->
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<span *ngIf="!item.character?.name"><strong>{{'MediaDetails.Casts.Character' | translate}}:</strong> {{item.character}}</span>
|
<span *ngIf="!item.character?.name"><strong>{{'MediaDetails.Casts.Character' | translate}}:</strong> {{item.character}}</span>
|
||||||
|
|
|
@ -18,6 +18,11 @@
|
||||||
</span>
|
</span>
|
||||||
<span *ngIf="!result.release_date">{{result.name}}</span>
|
<span *ngIf="!result.release_date">{{result.name}}</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div *ngIf="result.media_type === 'person'">
|
||||||
|
<i class="fa fa-user"></i>
|
||||||
|
<span *ngIf="result.name">{{result.name}}</span>
|
||||||
|
</div>
|
||||||
<!-- Collection -->
|
<!-- Collection -->
|
||||||
<!-- <i class="fa fa-file-video-o" aria-hidden="true"></i> -->
|
<!-- <i class="fa fa-file-video-o" aria-hidden="true"></i> -->
|
||||||
|
|
||||||
|
|
|
@ -27,12 +27,14 @@ export class NavSearchComponent {
|
||||||
title += ` (${result.release_date.slice(0,4)})`;
|
title += ` (${result.release_date.slice(0,4)})`;
|
||||||
}
|
}
|
||||||
return title;
|
return title;
|
||||||
} else {
|
} else if (result.media_type === "tv") {
|
||||||
let title = result.name;
|
let title = result.name;
|
||||||
if(result.release_date) {
|
if(result.release_date) {
|
||||||
title += ` (${result.release_date.slice(0,4)})`;
|
title += ` (${result.release_date.slice(0,4)})`;
|
||||||
}
|
}
|
||||||
return title;
|
return title;
|
||||||
|
} else if(result.media_type === "person"){
|
||||||
|
return result.name;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -40,8 +42,8 @@ export class NavSearchComponent {
|
||||||
text$.pipe(
|
text$.pipe(
|
||||||
debounceTime(600),
|
debounceTime(600),
|
||||||
distinctUntilChanged(),
|
distinctUntilChanged(),
|
||||||
switchMap(term =>
|
switchMap(term => term.length < 2 ? []
|
||||||
this.searchService.multiSearch(term)
|
: this.searchService.multiSearch(term)
|
||||||
)
|
)
|
||||||
)
|
)
|
||||||
|
|
||||||
|
@ -58,6 +60,9 @@ export class NavSearchComponent {
|
||||||
} else if (event.item.media_type == "tv") {
|
} else if (event.item.media_type == "tv") {
|
||||||
this.router.navigate([`details/tv/${event.item.id}/true`]);
|
this.router.navigate([`details/tv/${event.item.id}/true`]);
|
||||||
return;
|
return;
|
||||||
|
} else if (event.item.media_type == "person") {
|
||||||
|
this.router.navigate([`discover/actor/${event.item.id}`]);
|
||||||
|
return;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -8,7 +8,7 @@ import { IMultiSearchResult, ISearchMovieResult, ISearchTvResult } from "../inte
|
||||||
import { ServiceHelpers } from "./service.helpers";
|
import { ServiceHelpers } from "./service.helpers";
|
||||||
|
|
||||||
import { ISearchMovieResultV2 } from "../interfaces/ISearchMovieResultV2";
|
import { ISearchMovieResultV2 } from "../interfaces/ISearchMovieResultV2";
|
||||||
import { ISearchTvResultV2, IMovieCollectionsViewModel } from "../interfaces/ISearchTvResultV2";
|
import { ISearchTvResultV2, IMovieCollectionsViewModel, IActorCredits } from "../interfaces/ISearchTvResultV2";
|
||||||
|
|
||||||
@Injectable()
|
@Injectable()
|
||||||
export class SearchV2Service extends ServiceHelpers {
|
export class SearchV2Service extends ServiceHelpers {
|
||||||
|
@ -94,4 +94,8 @@ export class SearchV2Service extends ServiceHelpers {
|
||||||
public getMovieCollections(collectionId: number): Promise<IMovieCollectionsViewModel> {
|
public getMovieCollections(collectionId: number): Promise<IMovieCollectionsViewModel> {
|
||||||
return this.http.get<IMovieCollectionsViewModel>(`${this.url}/movie/collection/${collectionId}`, { headers: this.headers }).toPromise();
|
return this.http.get<IMovieCollectionsViewModel>(`${this.url}/movie/collection/${collectionId}`, { headers: this.headers }).toPromise();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public getMoviesByActor(actorId: number): Observable<IActorCredits> {
|
||||||
|
return this.http.get<IActorCredits>(`${this.url}/actor/${actorId}/movie`, { headers: this.headers });
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue