From e7e8cc3e8509b791176302e6bcbe4a807125bf7a Mon Sep 17 00:00:00 2001 From: TidusJar Date: Fri, 22 Feb 2019 16:17:03 +0000 Subject: [PATCH] Made a start to the TV Detail page --- .../src/app/interfaces/ISearchTvResultV2.ts | 3 +- ...nent.scss => media-details.component.scss} | 0 .../app/media-details/media-details.module.ts | 11 +- .../movie-details-trailer.component.ts | 15 - .../{ => movie}/movie-details.component.html | 2 +- .../{ => movie}/movie-details.component.ts | 22 +- .../tv/tv-details.component.html | 272 ++++++++++++++++++ .../media-details/tv/tv-details.component.ts | 53 ++++ ...nt.html => youtube-trailer.component.html} | 2 +- .../youtube-trailer.component.ts | 14 + src/Ombi/ClientApp/tslint.json | 2 + src/Ombi/Ombi.csproj | 2 +- 12 files changed, 366 insertions(+), 32 deletions(-) rename src/Ombi/ClientApp/src/app/media-details/{movie-details.component.scss => media-details.component.scss} (100%) delete mode 100644 src/Ombi/ClientApp/src/app/media-details/movie-details-trailer.component.ts rename src/Ombi/ClientApp/src/app/media-details/{ => movie}/movie-details.component.html (99%) rename src/Ombi/ClientApp/src/app/media-details/{ => movie}/movie-details.component.ts (67%) create mode 100644 src/Ombi/ClientApp/src/app/media-details/tv/tv-details.component.html create mode 100644 src/Ombi/ClientApp/src/app/media-details/tv/tv-details.component.ts rename src/Ombi/ClientApp/src/app/media-details/{movie-details-trailer.component.html => youtube-trailer.component.html} (54%) create mode 100644 src/Ombi/ClientApp/src/app/media-details/youtube-trailer.component.ts diff --git a/src/Ombi/ClientApp/src/app/interfaces/ISearchTvResultV2.ts b/src/Ombi/ClientApp/src/app/interfaces/ISearchTvResultV2.ts index ee2281bea..7cba0d6ec 100644 --- a/src/Ombi/ClientApp/src/app/interfaces/ISearchTvResultV2.ts +++ b/src/Ombi/ClientApp/src/app/interfaces/ISearchTvResultV2.ts @@ -4,6 +4,7 @@ export interface ISearchTvResultV2 { id: number; title: string; // used in the request aliases: string[]; + background: any; banner: string; seriesId: number; status: string; @@ -20,7 +21,7 @@ export interface ISearchTvResultV2 { siteRating: number; trailer: string; homepage: string; - certifcation: string; + certification: string; seasonRequests: INewSeasonRequests[]; requestAll: boolean; approved: boolean; diff --git a/src/Ombi/ClientApp/src/app/media-details/movie-details.component.scss b/src/Ombi/ClientApp/src/app/media-details/media-details.component.scss similarity index 100% rename from src/Ombi/ClientApp/src/app/media-details/movie-details.component.scss rename to src/Ombi/ClientApp/src/app/media-details/media-details.component.scss 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 index 64fc132fe..d850e4480 100644 --- a/src/Ombi/ClientApp/src/app/media-details/media-details.module.ts +++ b/src/Ombi/ClientApp/src/app/media-details/media-details.module.ts @@ -6,12 +6,14 @@ import { SearchService, RequestService } from "../services"; import {CarouselModule} from 'primeng/carousel'; import { SharedModule } from "../shared/shared.module"; -import { MovieDetailsComponent } from "./movie-details.component"; +import { MovieDetailsComponent } from "./movie/movie-details.component"; +import { TvDetailsComponent } from "./tv/tv-details.component"; import { PipeModule } from "../pipes/pipe.module"; -import { MovieDetailsTrailerComponent } from "./movie-details-trailer.component"; +import { YoutubeTrailerComponent } from "./youtube-trailer.component"; const routes: Routes = [ { path: "movie/:movieDbId", component: MovieDetailsComponent }, + { path: "tv/:tvdbId", component: TvDetailsComponent }, ]; @NgModule({ imports: [ @@ -22,13 +24,14 @@ const routes: Routes = [ ], declarations: [ MovieDetailsComponent, - MovieDetailsTrailerComponent + YoutubeTrailerComponent, + TvDetailsComponent ], exports: [ RouterModule, ], entryComponents: [ - MovieDetailsTrailerComponent + YoutubeTrailerComponent ], providers: [ SearchService, diff --git a/src/Ombi/ClientApp/src/app/media-details/movie-details-trailer.component.ts b/src/Ombi/ClientApp/src/app/media-details/movie-details-trailer.component.ts deleted file mode 100644 index bcebd3816..000000000 --- a/src/Ombi/ClientApp/src/app/media-details/movie-details-trailer.component.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { Component, Inject } from "@angular/core"; -import { MatDialogRef, MAT_DIALOG_DATA } from "@angular/material"; -import { ISearchMovieResultV2 } from "../interfaces/ISearchMovieResultV2"; - -@Component({ - selector: "movie-trailer", - templateUrl: "./movie-details-trailer.component.html", -}) -export class MovieDetailsTrailerComponent { - - constructor( - public dialogRef: MatDialogRef, - @Inject(MAT_DIALOG_DATA) public data: ISearchMovieResultV2) {} - -} diff --git a/src/Ombi/ClientApp/src/app/media-details/movie-details.component.html b/src/Ombi/ClientApp/src/app/media-details/movie/movie-details.component.html similarity index 99% rename from src/Ombi/ClientApp/src/app/media-details/movie-details.component.html rename to src/Ombi/ClientApp/src/app/media-details/movie/movie-details.component.html index e6854c6c6..56dae7336 100644 --- a/src/Ombi/ClientApp/src/app/media-details/movie-details.component.html +++ b/src/Ombi/ClientApp/src/app/media-details/movie/movie-details.component.html @@ -88,7 +88,7 @@ 'Common.Request' | translate }} - + { this.theMovidDbId = params.movieDbId; this.load(); @@ -25,6 +27,8 @@ export class MovieDetailsComponent { } public load() { + + this.isAdmin = this.auth.hasRole("admin") || this.auth.hasRole("poweruser"); this.searchService.getFullMovieDetails(this.theMovidDbId).subscribe(x => { this.movie = x; this.imageService.getMovieBanner(this.theMovidDbId.toString()).subscribe(x => { @@ -46,9 +50,9 @@ export class MovieDetailsComponent { } public openDialog() { - this.dialog.open(MovieDetailsTrailerComponent, { + this.dialog.open(YoutubeTrailerComponent, { width: '560px', - data: this.movie + data: this.movie.videos.results[0].key }); } } diff --git a/src/Ombi/ClientApp/src/app/media-details/tv/tv-details.component.html b/src/Ombi/ClientApp/src/app/media-details/tv/tv-details.component.html new file mode 100644 index 000000000..434953410 --- /dev/null +++ b/src/Ombi/ClientApp/src/app/media-details/tv/tv-details.component.html @@ -0,0 +1,272 @@ +
+ + +
+
+
+ +
+
+
+
+

{{tv.title}} ({{tv.firstAired | amLocal | amDateFormat: 'YYYY'}}) +

+ +
{{tv.certification}}
+
+
+
+
+
+ +
+
+
+ + + +
+ + + + + + + + + + + + + + + + + +
+ +
+ + + + + + + + + + + + + + {{'Search.ViewOnPlex' | + translate}} + {{'Search.ViewOnEmby' | + translate}} + +
+
+ +
+
+ + + + +
+ First Aired: + {{tv.firstAired | date: 'mediumDate'}}
+ +
+ Rating: {{tv.rating}}/10 +
+
+ Status: {{tv.status}} +
+
+ Runtime: {{tv.runtime}} Minutes +
+
+ Status: {{tv.status}} +
+ +
+ Genres: + + {{genre}} | + + +
+ + + + + +
+
+ + + {{tv.overview}} + + +
+ + +
+ + +
+ + +
+ + Cast + + + +
+
+ + +
+
+ Character: {{item.character.name}} +
+
+ Actor: {{item.person.name}} +
+
+ + + + +
+
+
+
+ + +
+
+ + + + +
+
+
+ + + + + + + + +
\ No newline at end of file diff --git a/src/Ombi/ClientApp/src/app/media-details/tv/tv-details.component.ts b/src/Ombi/ClientApp/src/app/media-details/tv/tv-details.component.ts new file mode 100644 index 000000000..7bdd78244 --- /dev/null +++ b/src/Ombi/ClientApp/src/app/media-details/tv/tv-details.component.ts @@ -0,0 +1,53 @@ +import { Component } from "@angular/core"; +import { ImageService, SearchV2Service, RequestService, MessageService } from "../../services"; +import { ActivatedRoute } from "@angular/router"; +import { DomSanitizer } from "@angular/platform-browser"; +import { ISearchTvResultV2 } from "../../interfaces/ISearchTvResultV2"; +import { MatDialog } from "@angular/material"; +import { YoutubeTrailerComponent } from "../youtube-trailer.component"; + +@Component({ + templateUrl: "./tv-details.component.html", + styleUrls: ["../media-details.component.scss"], +}) +export class TvDetailsComponent { + public tv: ISearchTvResultV2; + private tvdbId: number; + + constructor(private searchService: SearchV2Service, private route: ActivatedRoute, + private sanitizer: DomSanitizer, private imageService: ImageService, + public dialog: MatDialog, private requestService: RequestService, + public messageService: MessageService) { + this.route.params.subscribe((params: any) => { + this.tvdbId = params.tvdbId; + this.load(); + }); + } + + public async load() { + this.tv = await this.searchService.getTvInfo(this.tvdbId); + const tvBanner = await this.imageService.getTvBanner(this.tvdbId).toPromise(); + this.tv.background = this.sanitizer.bypassSecurityTrustStyle("url(" + tvBanner + ")"); + } + + public async request() { + // var result = await this.requestService.requestTv({}).toPromise(); + // if (result.result) { + // this.movie.requested = true; + // this.messageService.send(result.message, "Ok"); + // } else { + // this.messageService.send(result.errorMessage, "Ok"); + // } + } + + public openDialog() { + debugger; + let trailerLink = this.tv.trailer; + trailerLink = trailerLink.split('?v=')[1]; + + this.dialog.open(YoutubeTrailerComponent, { + width: '560px', + data: trailerLink + }); + } +} diff --git a/src/Ombi/ClientApp/src/app/media-details/movie-details-trailer.component.html b/src/Ombi/ClientApp/src/app/media-details/youtube-trailer.component.html similarity index 54% rename from src/Ombi/ClientApp/src/app/media-details/movie-details-trailer.component.html rename to src/Ombi/ClientApp/src/app/media-details/youtube-trailer.component.html index 925ebc906..630e64748 100644 --- a/src/Ombi/ClientApp/src/app/media-details/movie-details-trailer.component.html +++ b/src/Ombi/ClientApp/src/app/media-details/youtube-trailer.component.html @@ -1,2 +1,2 @@ - \ No newline at end of file diff --git a/src/Ombi/ClientApp/src/app/media-details/youtube-trailer.component.ts b/src/Ombi/ClientApp/src/app/media-details/youtube-trailer.component.ts new file mode 100644 index 000000000..3456759cf --- /dev/null +++ b/src/Ombi/ClientApp/src/app/media-details/youtube-trailer.component.ts @@ -0,0 +1,14 @@ +import { Component, Inject } from "@angular/core"; +import { MatDialogRef, MAT_DIALOG_DATA } from "@angular/material"; + +@Component({ + selector: "youtube-trailer", + templateUrl: "./youtube-trailer.component.html", +}) +export class YoutubeTrailerComponent { + + constructor( + public dialogRef: MatDialogRef, + @Inject(MAT_DIALOG_DATA) public youtubeLink: string) {} + +} diff --git a/src/Ombi/ClientApp/tslint.json b/src/Ombi/ClientApp/tslint.json index 2af1fd722..e17c7ec04 100644 --- a/src/Ombi/ClientApp/tslint.json +++ b/src/Ombi/ClientApp/tslint.json @@ -24,6 +24,8 @@ "quotemark": [ true, "double", "avoid-template" ], "no-console": false, "no-non-null-assertion": false, + }, + "compilerOptions": { "experimentalDecorators":true, } } diff --git a/src/Ombi/Ombi.csproj b/src/Ombi/Ombi.csproj index d02a2698a..3a4fbad5d 100644 --- a/src/Ombi/Ombi.csproj +++ b/src/Ombi/Ombi.csproj @@ -57,7 +57,7 @@ - +