Improved the details

This commit is contained in:
TidusJar 2019-02-27 09:58:12 +00:00
commit 585d870250
6 changed files with 81 additions and 41 deletions

View file

@ -33,7 +33,7 @@
background-size: cover; background-size: cover;
background-position: 50% 10%; background-position: 50% 10%;
transition: all .5s; transition: all .5s;
height: 550px; height: 450px;
color: #fff; color: #fff;
position: relative; position: relative;
} }
@ -49,11 +49,10 @@
#summary-wrapper .shadow-base, #summary-wrapper .shadow-base,
.summary-wrapper .shadow-base { .summary-wrapper .shadow-base {
height: 120px;
bottom: 0; bottom: 0;
background-image: -webkit-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.8) 100%); background-image: -webkit-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.5) 100%);
background-image: -o-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.8) 100%); background-image: -o-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.5) 100%);
background-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.8) 100%); background-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.5) 100%);
background-repeat: repeat-x; background-repeat: repeat-x;
} }
@ -101,7 +100,7 @@
#summary-wrapper .summary .container h1, #summary-wrapper .summary .container h1,
.summary-wrapper .summary .container h1 { .summary-wrapper .summary .container h1 {
margin: 0; margin: 0;
text-shadow: 0 0 20px #000; text-shadow: 1px 1px 5px #000;
line-height: 1.2; line-height: 1.2;
} }
@ -115,7 +114,8 @@
} }
#info-wrapper .sidebar-poster { #info-wrapper .sidebar-poster {
margin-top: -180px; margin-top: -300px;
width: 250px;
} }
#info-wrapper .sidebar .poster { #info-wrapper .sidebar .poster {
@ -163,6 +163,7 @@
.tagline { .tagline {
margin-top: 10px; margin-top: 10px;
margin-left: 10px; margin-left: 10px;
text-shadow: 1px 1px 5px #000;
} }
.preview-poster { .preview-poster {
@ -193,7 +194,7 @@
.small-middle-container{ .small-middle-container{
margin: auto; margin: auto;
width: 86%; width: 95%;
} }
.keywords-panel { .keywords-panel {

View file

@ -14,6 +14,7 @@ import { YoutubeTrailerComponent } from "./youtube-trailer.component";
const routes: Routes = [ const routes: Routes = [
{ path: "movie/:movieDbId", component: MovieDetailsComponent }, { path: "movie/:movieDbId", component: MovieDetailsComponent },
{ path: "tv/:tvdbId/:search", component: TvDetailsComponent }, { path: "tv/:tvdbId/:search", component: TvDetailsComponent },
{ path: "tv/:tvdbId", component: TvDetailsComponent },
]; ];
@NgModule({ @NgModule({
imports: [ imports: [

View file

@ -23,9 +23,10 @@
<section id="info-wrapper"> <section id="info-wrapper">
<div class="small-middle-container"> <div class="small-middle-container">
<div class="row"> <div class="row">
<div class="col-md-2 col-sm-3 hidden-xs"> <div class="col-md-2 col-sm-3 hidden-xs">
<div class="sidebar sidebar-poster affixable affix-top" style="width: 173px;"> <div class="sidebar sidebar-poster affixable affix-top">
<div class="poster"> <div class="poster">
<img class="real" src="https://image.tmdb.org/t/p/w300/{{movie.posterPath}}" alt="Poster" <img class="real" src="https://image.tmdb.org/t/p/w300/{{movie.posterPath}}" alt="Poster"
style="display: block;"> style="display: block;">
@ -88,7 +89,8 @@
'Common.Request' | translate }}</button> 'Common.Request' | translate }}</button>
</ng-template> </ng-template>
</span> </span>
<span *ngIf="isAdmin"><button mat-raised-button class="btn-spacing" color="warn" (click)="deny()">Deny</button></span> <span *ngIf="isAdmin"><button mat-raised-button class="btn-spacing" color="warn"
(click)="deny()">Deny</button></span>
<span *ngIf="movie.available"> <span *ngIf="movie.available">
<a *ngIf="movie.plexUrl" mat-raised-button style="text-align: right" <a *ngIf="movie.plexUrl" mat-raised-button style="text-align: right"
class="btn-spacing btn-greem" href="{{movie.plexUrl}}" target="_blank"><i class="btn-spacing btn-greem" href="{{movie.plexUrl}}" target="_blank"><i
@ -139,12 +141,13 @@
{{movie.budget | currency: 'USD'}}</span> {{movie.budget | currency: 'USD'}}</span>
</div> </div>
<div> <div *ngIf="movie.genres">
<span *ngIf="movie.genres"><strong>Genres:</strong> <strong>Genres:</strong>
<span *ngFor="let genre of movie.genres"> <mat-chip-list>
{{genre.name}} | <mat-chip *ngFor="let genre of movie.genres">
</span> {{genre.name}}
</span> </mat-chip>
</mat-chip-list>
</div> </div>
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>

View file

@ -25,7 +25,7 @@
<div class="small-middle-container"> <div class="small-middle-container">
<div class="row"> <div class="row">
<div class="col-md-2 col-sm-3 hidden-xs"> <div class="col-md-2 col-sm-3 hidden-xs">
<div class="sidebar sidebar-poster affixable affix-top" style="width: 173px;"> <div class="sidebar sidebar-poster affixable affix-top">
<div class="poster"> <div class="poster">
<img class="real" [src]="tv.images.medium" alt="Poster" style="display: block;"> <img class="real" [src]="tv.images.medium" alt="Poster" style="display: block;">
</div> </div>
@ -59,8 +59,8 @@
<div class="col-12 col-lg-7 col-xl-7 media-row"> <div class="col-12 col-lg-7 col-xl-7 media-row">
<button *ngIf="!tv.fullyAvailable" mat-raised-button class="btn-spacing mat-warn" (click)="request()" <button *ngIf="!tv.fullyAvailable" mat-raised-button class="btn-spacing mat-warn"
><i class="fa fa-plus"></i> (click)="request()"><i class="fa fa-plus"></i>
{{ 'Common.Request' | translate }}</button> {{ 'Common.Request' | translate }}</button>
<button *ngIf="tv.fullyAvailable" mat-raised-button class="btn-spacing mat-primary" [disabled]> <button *ngIf="tv.fullyAvailable" mat-raised-button class="btn-spacing mat-primary" [disabled]>
@ -68,9 +68,8 @@
<span *ngIf="tv.available"> <span *ngIf="tv.available">
<a *ngIf="tv.plexUrl" mat-raised-button style="text-align: right" <a *ngIf="tv.plexUrl" mat-raised-button style="text-align: right" class="btn-spacing btn-greem"
class="btn-spacing btn-greem" href="{{tv.plexUrl}}" target="_blank"><i href="{{tv.plexUrl}}" target="_blank"><i class="fa fa-eye"></i> {{'Search.ViewOnPlex' |
class="fa fa-eye"></i> {{'Search.ViewOnPlex' |
translate}}</a> translate}}</a>
<a *ngIf="tv.embyUrl" mat-raised-button class="mat-accent btn-spacing" href="{{tv.embyUrl}}" <a *ngIf="tv.embyUrl" mat-raised-button class="mat-accent btn-spacing" href="{{tv.embyUrl}}"
target="_blank"><i class="fa fa-eye"></i> {{'Search.ViewOnEmby' | target="_blank"><i class="fa fa-eye"></i> {{'Search.ViewOnEmby' |
@ -81,8 +80,6 @@
<div class="row"> <div class="row">
<div class="col-12 col-md-3"> <div class="col-12 col-md-3">
<!-- <button *ngIf="tv.belongsToCollection" mat-raised-button
class="btn-spacing-below full-width mat-elevation-z8">{{tv.belongsToCollection.name}}</button> -->
<mat-card class="card-full mat-elevation-z8"> <mat-card class="card-full mat-elevation-z8">
<mat-card-content> <mat-card-content>
@ -102,6 +99,9 @@
<div> <div>
<span *ngIf="tv.status"><strong>Status:</strong> {{tv.status}}</span> <span *ngIf="tv.status"><strong>Status:</strong> {{tv.status}}</span>
</div> </div>
<div>
<span *ngIf="tv.network"><strong>Network:</strong> {{tv.network.name}}</span>
</div>
<div> <div>
<span *ngIf="tv.genre"><strong>Genres:</strong> <span *ngIf="tv.genre"><strong>Genres:</strong>
@ -110,6 +110,14 @@
</span> </span>
</span> </span>
</div> </div>
<div>
<span *ngIf="seasonCount"><strong>Seasons:</strong> {{seasonCount}}</span>
</div>
<div>
<span *ngIf="totalEpisodes"><strong>Episodes:</strong> {{totalEpisodes}}</span>
</div>
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>
@ -145,6 +153,14 @@
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>
</div> --> </div> -->
<div class="col-12 col-md-3">
<mat-card class="mat-elevation-z8">
<mat-card-content>
</mat-card-content>
</mat-card>
</div>
<div class="col-12 col-md-9"> <div class="col-12 col-md-9">
<mat-card class="card-full mat-elevation-z8"> <mat-card class="card-full mat-elevation-z8">

View file

@ -15,6 +15,11 @@ import { EpisodeRequestComponent } from "../../shared/episode-request/episode-re
export class TvDetailsComponent { export class TvDetailsComponent {
public tv: ISearchTvResultV2; public tv: ISearchTvResultV2;
public fromSearch: boolean; public fromSearch: boolean;
public seasonCount: number;
public totalEpisodes: number = 0;
public nextEpisode: any;
private tvdbId: number; private tvdbId: number;
constructor(private searchService: SearchV2Service, private route: ActivatedRoute, constructor(private searchService: SearchV2Service, private route: ActivatedRoute,
@ -35,6 +40,12 @@ export class TvDetailsComponent {
} else { } else {
this.tv = await this.searchService.getTvInfo(this.tvdbId); this.tv = await this.searchService.getTvInfo(this.tvdbId);
} }
this.tv.seasonRequests.forEach(season => {
this.totalEpisodes = this.totalEpisodes + season.episodes.length;
});
this.seasonCount = this.tv.seasonRequests.length;
const tvBanner = await this.imageService.getTvBanner(this.tvdbId).toPromise(); const tvBanner = await this.imageService.getTvBanner(this.tvdbId).toPromise();
this.tv.background = this.sanitizer.bypassSecurityTrustStyle("url(" + tvBanner + ")"); this.tv.background = this.sanitizer.bypassSecurityTrustStyle("url(" + tvBanner + ")");
} }

View file

@ -1,11 +1,13 @@
using System.Threading.Tasks; using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc; using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Http;
using System.Threading.Tasks;
using System.Collections.Generic;
using Ombi.Core;
using Ombi.Api.TheMovieDb.Models; using Ombi.Api.TheMovieDb.Models;
using Ombi.Core.Engine.V2; using Ombi.Core.Engine.V2;
using System.Collections.Generic;
using Microsoft.AspNetCore.Http;
using Ombi.Core;
using Ombi.Core.Engine.Interfaces; using Ombi.Core.Engine.Interfaces;
using Ombi.Core.Models.Search; using Ombi.Core.Models.Search;
using Ombi.Core.Models.Search.V2; using Ombi.Core.Models.Search.V2;
@ -18,8 +20,8 @@ namespace Ombi.Controllers.V2
[ApiController] [ApiController]
public class SearchController : ControllerBase public class SearchController : ControllerBase
{ {
public SearchController(IMultiSearchEngine multiSearchEngine, public SearchController(IMultiSearchEngine multiSearchEngine, ITvSearchEngine tvSearchEngine,
ITvSearchEngine tvSearchEngine, IMovieEngineV2 v2Movie, ITVSearchEngineV2 v2Tv) IMovieEngineV2 v2Movie, ITVSearchEngineV2 v2Tv)
{ {
_multiSearchEngine = multiSearchEngine; _multiSearchEngine = multiSearchEngine;
_tvSearchEngine = tvSearchEngine; _tvSearchEngine = tvSearchEngine;
@ -37,6 +39,10 @@ namespace Ombi.Controllers.V2
/// <summary> /// <summary>
/// Returns search results for both TV and Movies /// Returns search results for both TV and Movies
/// </summary> /// </summary>
/// <remarks>The ID's returned by this are all TheMovieDbID's even for the TV Shows. You can call <see cref="GetTvInfoByMovieId"/> to get TV
/// Show information using the MovieDbId.</remarks>
/// <param name="searchTerm">The search you want, this can be for a movie or TV show e.g. Star Wars will return
/// all Star Wars movies and Star Wars Rebels the TV Sho</param>
/// <returns></returns> /// <returns></returns>
[HttpGet("multi/{searchTerm}")] [HttpGet("multi/{searchTerm}")]
public async Task<List<MultiSearch>> MultiSearch(string searchTerm) public async Task<List<MultiSearch>> MultiSearch(string searchTerm)
@ -47,6 +53,7 @@ namespace Ombi.Controllers.V2
/// <summary> /// <summary>
/// Returns details for a single movie /// Returns details for a single movie
/// </summary> /// </summary>
/// <param name="movieDbId">The MovieDB Id</param>
[HttpGet("movie/{movieDbId}")] [HttpGet("movie/{movieDbId}")]
public async Task<MovieFullInfoViewModel> GetMovieInfo(int movieDbId) public async Task<MovieFullInfoViewModel> GetMovieInfo(int movieDbId)
{ {
@ -57,7 +64,8 @@ namespace Ombi.Controllers.V2
/// <summary> /// <summary>
/// Returns details for a single show /// Returns details for a single show
/// </summary> /// </summary>
/// <returns></returns> /// <remarks>TVMaze is the TV Show Provider</remarks>
/// <param name="tvdbid">The TVDB Id</param>
[HttpGet("tv/{tvdbId}")] [HttpGet("tv/{tvdbId}")]
public async Task<SearchFullInfoTvShowViewModel> GetTvInfo(int tvdbid) public async Task<SearchFullInfoTvShowViewModel> GetTvInfo(int tvdbid)
{ {