diff --git a/src/Ombi/ClientApp/src/app/app.module.ts b/src/Ombi/ClientApp/src/app/app.module.ts index 740c5dbac..ae167c9c5 100644 --- a/src/Ombi/ClientApp/src/app/app.module.ts +++ b/src/Ombi/ClientApp/src/app/app.module.ts @@ -69,6 +69,7 @@ const routes: Routes = [ { loadChildren: "./search/search.module#SearchModule", path: "search" }, { loadChildren: "./recentlyAdded/recentlyAdded.module#RecentlyAddedModule", path: "recentlyadded" }, { loadChildren: "./vote/vote.module#VoteModule", path: "vote" }, + { loadChildren: "./media-details/media-details.module#MediaDetailsModule", path: "details" }, ]; // AoT requires an exported function for factories diff --git a/src/Ombi/ClientApp/src/app/media-details/media-details.module.ts b/src/Ombi/ClientApp/src/app/media-details/media-details.module.ts new file mode 100644 index 000000000..6453a2277 --- /dev/null +++ b/src/Ombi/ClientApp/src/app/media-details/media-details.module.ts @@ -0,0 +1,28 @@ +import { NgModule } from "@angular/core"; +import { RouterModule, Routes } from "@angular/router"; + +import { SearchService } from "../services"; + +import { SharedModule } from "../shared/shared.module"; +import { MovieDetailsComponent } from "./movie-details.component"; + +const routes: Routes = [ + { path: "movie/:movieDbId", component: MovieDetailsComponent }, +]; +@NgModule({ + imports: [ + RouterModule.forChild(routes), + SharedModule, + ], + declarations: [ + MovieDetailsComponent, + ], + exports: [ + RouterModule, + ], + providers: [ + SearchService + ], + +}) +export class MediaDetailsModule { } diff --git a/src/Ombi/ClientApp/src/app/media-details/movie-details.component.html b/src/Ombi/ClientApp/src/app/media-details/movie-details.component.html new file mode 100644 index 000000000..d11504ee6 --- /dev/null +++ b/src/Ombi/ClientApp/src/app/media-details/movie-details.component.html @@ -0,0 +1,12 @@ +
+
+ +
+ + +
+
+ {{movie.title}} +
+
+
\ No newline at end of file diff --git a/src/Ombi/ClientApp/src/app/media-details/movie-details.component.scss b/src/Ombi/ClientApp/src/app/media-details/movie-details.component.scss new file mode 100644 index 000000000..da924d82d --- /dev/null +++ b/src/Ombi/ClientApp/src/app/media-details/movie-details.component.scss @@ -0,0 +1,7 @@ +.banner { +position: absolute; +top: 0px; +left: 0px; +right: 0px; +width: 100%; +} \ No newline at end of file diff --git a/src/Ombi/ClientApp/src/app/media-details/movie-details.component.ts b/src/Ombi/ClientApp/src/app/media-details/movie-details.component.ts new file mode 100644 index 000000000..ef8566311 --- /dev/null +++ b/src/Ombi/ClientApp/src/app/media-details/movie-details.component.ts @@ -0,0 +1,31 @@ +import { Component } from "@angular/core"; +import { SearchService, ImageService } from "../services"; +import { ActivatedRoute } from "@angular/router"; +import { ISearchMovieResult } from "../interfaces"; +import { DomSanitizer } from "@angular/platform-browser"; + +@Component({ + templateUrl: "./movie-details.component.html", + styleUrls: ["./movie-details.component.scss"], +}) +export class MovieDetailsComponent { + public movie: ISearchMovieResult; + private theMovidDbId: number; + + constructor(private searchService: SearchService, private route: ActivatedRoute, + private sanitizer: DomSanitizer, private imageService: ImageService) { + this.route.params.subscribe((params: any) => { + this.theMovidDbId = params.movieDbId; + this.load(); + }); + } + + public load() { + this.searchService.getMovieInformation(this.theMovidDbId).subscribe(x => { + this.movie = x; + + this.imageService.getMovieBanner(this.theMovidDbId.toString()).subscribe(x => this.movie.background = x); + }); + + } +} diff --git a/src/Ombi/ClientApp/src/app/my-nav/nav-search.component.ts b/src/Ombi/ClientApp/src/app/my-nav/nav-search.component.ts index b48f02189..b1450e993 100644 --- a/src/Ombi/ClientApp/src/app/my-nav/nav-search.component.ts +++ b/src/Ombi/ClientApp/src/app/my-nav/nav-search.component.ts @@ -5,34 +5,38 @@ import { debounceTime, distinctUntilChanged } from 'rxjs/operators'; import { SearchV2Service } from '../services/searchV2.service'; import { IMultiSearchResult } from '../interfaces'; import { MatAutocompleteSelectedEvent } from '@angular/material'; +import { Router } from '@angular/router'; @Component({ - selector: 'app-nav-search', - templateUrl: './nav-search.component.html', - styleUrls: ['./nav-search.component.scss'] + selector: 'app-nav-search', + templateUrl: './nav-search.component.html', + styleUrls: ['./nav-search.component.scss'] }) export class NavSearchComponent { - public searchChanged: Subject = new Subject(); - public searchText: string; - public searchResult: IMultiSearchResult[]; + public searchChanged: Subject = new Subject(); + public searchText: string; + public searchResult: IMultiSearchResult[]; - constructor(private searchService: SearchV2Service) { - this.searchChanged.pipe( - debounceTime(600), // Wait Xms after the last event before emitting last event - distinctUntilChanged(), // only emit if value is different from previous value - ).subscribe(x => { - this.searchText = x as string; - this.searchService.multiSearch(this.searchText).subscribe(x => this.searchResult = x) - }); - } + constructor(private searchService: SearchV2Service, private router: Router) { + this.searchChanged.pipe( + debounceTime(600), // Wait Xms after the last event before emitting last event + distinctUntilChanged(), // only emit if value is different from previous value + ).subscribe(x => { + this.searchText = x as string; + this.searchService.multiSearch(this.searchText).subscribe(x => this.searchResult = x) + }); + } - public search(text: any) { - this.searchChanged.next(text.target.value); - } + public search(text: any) { + this.searchChanged.next(text.target.value); + } - public selected(option: MatAutocompleteSelectedEvent) { - var selected = option.option.value as IMultiSearchResult; - - } + public selected(option: MatAutocompleteSelectedEvent) { + var selected = option.option.value as IMultiSearchResult; + if (selected.media_type == "movie") { + this.router.navigate([`details/movie/${selected.id}`]); + return; + } + } } diff --git a/src/Ombi/ClientApp/src/app/services/image.service.ts b/src/Ombi/ClientApp/src/app/services/image.service.ts index 6307e7e3d..92119f0a0 100644 --- a/src/Ombi/ClientApp/src/app/services/image.service.ts +++ b/src/Ombi/ClientApp/src/app/services/image.service.ts @@ -31,6 +31,9 @@ export class ImageService extends ServiceHelpers { public getMovieBackground(movieDbId: string): Observable { return this.http.get(`${this.url}background/movie/${movieDbId}`, { headers: this.headers }); + } + public getMovieBanner(movieDbId: string): Observable { + return this.http.get(`${this.url}banner/movie/${movieDbId}`, { headers: this.headers }); } public getTvBackground(tvdbid: number): Observable { diff --git a/src/Ombi/Controllers/V1/ImagesController.cs b/src/Ombi/Controllers/V1/ImagesController.cs index f6861ba69..32599533f 100644 --- a/src/Ombi/Controllers/V1/ImagesController.cs +++ b/src/Ombi/Controllers/V1/ImagesController.cs @@ -147,6 +147,31 @@ namespace Ombi.Controllers.V1 return string.Empty; } + [HttpGet("banner/movie/{movieDbId}")] + public async Task GetMovieBanner(string movieDbId) + { + var key = await _cache.GetOrAdd(CacheKeys.FanartTv, async () => await Config.GetAsync(Store.Entities.ConfigurationTypes.FanartTv), DateTime.Now.AddDays(1)); + + var images = await FanartTvApi.GetMovieImages(movieDbId, key.Value); + + if (images == null) + { + return string.Empty; + } + + if (images.moviebanner?.Any() ?? false) + { + var enImage = images.moviebanner.Where(x => x.lang == "en").OrderByDescending(x => x.likes).Select(x => x.url).FirstOrDefault(); + if (enImage == null) + { + return images.moviebanner.OrderByDescending(x => x.likes).Select(x => x.url).FirstOrDefault(); + } + return enImage; + } + + return string.Empty; + } + [HttpGet("background/tv/{tvdbid}")] public async Task GetTvBackground(int tvdbid) {