poc

src/Ombi.Core/Engine/RecentlyAddedEngine.cs

@@ -24,6 +24,8 @@ namespace Ombi.Core.Engine
         private readonly IEmbyContentRepository _emby;
         private readonly IRepository<RecentlyAddedLog> _recentlyAddedLog;
 
+        
+
         public IEnumerable<RecentlyAddedMovieModel> GetRecentlyAddedMovies(DateTime from, DateTime to)
         {
             var plexMovies = _plex.GetAll().Where(x => x.Type == PlexMediaTypeEntity.Movie && x.AddedAt > from && x.AddedAt < to);

src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.html

@@ -1,5 +1,5 @@
 <div class="small-middle-container">
-    <div class="row justify-content-end">
+    <!-- <div class="row justify-content-end">
         <div class="btn-group col-12 col-md-3 small-space discover-layout"role="group">
             <mat-button-toggle-group *ngIf="displayOption">
                 <mat-button-toggle [ngClass]="displayOption === DisplayOption.Card ? 'mat-button-toggle-checked' : ''" (click)="changeView(DisplayOption.Card)"><mat-icon>dashboard</mat-icon></mat-button-toggle>
@@ -24,9 +24,9 @@
             <button type="button" (click)="trending()" [attr.color]="trendingActive ? 'accent' : 'primary'" [ngClass]="trendingActive ? 'mat-accent' : 'mat-primary'" mat-raised-button class="btn grow" color="primary">{{'Discovery.TrendingTab' | translate}}</button>
             <button type="button" (click)="upcoming()" [attr.color]="upcomingActive ? 'accent' : 'primary'" [ngClass]="upcomingActive ? 'mat-accent' : 'mat-primary'" mat-raised-button class="btn grow" color="primary">{{'Discovery.UpcomingTab' | translate}}</button>
         </div>
-    </div>
+    </div> -->
 
-    <div *ngIf="discoverResults && displayOption === DisplayOption.Card" class="row full-height discoverResults col" infiniteScroll [fromRoot]="false" [infiniteScrollDistance]="0.5" [infiniteScrollDisabled]="scrollDisabled" (scrolled)="onScroll()">
+    <!-- <div *ngIf="discoverResults && displayOption === DisplayOption.Card" class="row full-height discoverResults col" infiniteScroll [fromRoot]="false" [infiniteScrollDistance]="0.5" [infiniteScrollDisabled]="scrollDisabled" (scrolled)="onScroll()">
         <div class="col-xl-2 col-lg-3 col-md-4 col-12 col-sm-6 small-padding" *ngFor="let result of discoverResults">
             <discover-card [result]="result"></discover-card>
         </div>
@@ -38,5 +38,15 @@
     </div>
     <div *ngIf="loadingFlag" class="row justify-content-md-center top-spacing loading-spinner">
         <mat-spinner [color]="'accent'"></mat-spinner>
+    </div> -->
+
+    <h2>Upcoming Movies <i class="fa fa-arrow-circle-o-right" aria-hidden="true"></i></h2>
+    <div *ngIf="!loadingFlag">
+        <movie-list [result]="upcomingMovies"></movie-list>
     </div>
-</div>
+
+    <h2>Trending Movies <i class="fa fa-arrow-circle-o-right" aria-hidden="true"></i></h2>
+    <div *ngIf="!loadingFlag">
+        <movie-list [result]="trendingMovies"></movie-list>
+    </div>
+</div>

src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.scss

@@ -5,6 +5,7 @@
 .small-middle-container {
     margin: auto;
     width: 85%;
+    padding-left:2%;
 }
 
 .small-padding {
@@ -35,6 +36,8 @@
 
 ::ng-deep .mat-card-image {
     height: 75%;
+    border-radius: 10px;
+    width: 100%;
     object-fit: cover;
     display: block;
 }
@@ -207,4 +210,4 @@
     .discover-layout{
         display: none;
     }
-}
+}

src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.ts

@@ -20,6 +20,10 @@ import { DOCUMENT } from "@angular/common";
 })
 export class DiscoverComponent implements OnInit {
 
+    public upcomingMovies: IDiscoverCardResult[] = [];
+    public trendingMovies: IDiscoverCardResult[] = [];
+
+
     public discoverResults: IDiscoverCardResult[] = [];
     public movies: ISearchMovieResult[] = [];
     public tvShows: ISearchTvResult[] = [];
@@ -45,6 +49,8 @@ export class DiscoverComponent implements OnInit {
     private mediaTypeStorageKey = "DiscoverOptions";
     private displayOptionsKey = "DiscoverDisplayOptions";
 
+
+
     constructor(private searchService: SearchV2Service,
         private storageService: StorageService,
         @Inject(DOCUMENT) private container: Document) { }
@@ -52,35 +58,38 @@ export class DiscoverComponent implements OnInit {
 
     public async ngOnInit() {
         this.loading()
-        const localDiscoverOptions = +this.storageService.get(this.mediaTypeStorageKey);
+        this.upcomingMovies = this.mapMovieModel(await this.searchService.upcomingMoviesByPage(0, 14));
-        if (localDiscoverOptions) {
+        this.trendingMovies = this.mapMovieModel(await this.searchService.popularMoviesByPage(0, 14));
-            this.discoverOptions = DiscoverOption[DiscoverOption[localDiscoverOptions]];
+this.finishLoading();
-        }
+        // const localDiscoverOptions = +this.storageService.get(this.mediaTypeStorageKey);
-        const localDisplayOptions = +this.storageService.get(this.displayOptionsKey);
+        // if (localDiscoverOptions) {
-        if (localDisplayOptions) {
+        //     this.discoverOptions = DiscoverOption[DiscoverOption[localDiscoverOptions]];
-            this.displayOption = DisplayOption[DisplayOption[localDisplayOptions]];
+        // }
-        }
+        // const localDisplayOptions = +this.storageService.get(this.displayOptionsKey);
-        this.scrollDisabled = true;
+        // if (localDisplayOptions) {
-        switch (this.discoverOptions) {
+        //     this.displayOption = DisplayOption[DisplayOption[localDisplayOptions]];
-            case DiscoverOption.Combined:
+        // }
-                this.movies = await this.searchService.popularMoviesByPage(0, this.amountToLoad);
+        // this.scrollDisabled = true;
-                this.tvShows = await this.searchService.popularTvByPage(0, this.amountToLoad);
+        // switch (this.discoverOptions) {
-                break;
+        //     case DiscoverOption.Combined:
-            case DiscoverOption.Movie:
+        //         this.movies = await this.searchService.popularMoviesByPage(0, this.amountToLoad);
-                this.movies = await this.searchService.popularMoviesByPage(0, this.amountToLoad);
+        //         this.tvShows = await this.searchService.popularTvByPage(0, this.amountToLoad);
-                break;
+        //         break;
-            case DiscoverOption.Tv:
+        //     case DiscoverOption.Movie:
-                this.tvShows = await this.searchService.popularTvByPage(0, this.amountToLoad);
+        //         this.movies = await this.searchService.popularMoviesByPage(0, this.amountToLoad);
-                break;
+        //         break;
-        }
+        //     case DiscoverOption.Tv:
+        //         this.tvShows = await this.searchService.popularTvByPage(0, this.amountToLoad);
+        //         break;
+        // }
 
-        this.contentLoaded = this.amountToLoad;
+        // this.contentLoaded = this.amountToLoad;
 
-        this.createInitialModel();
+        // this.createInitialModel();
-        this.scrollDisabled = false;
+        // this.scrollDisabled = false;
-        if (!this.containerHasScrollBar()) {
+        // if (!this.containerHasScrollBar()) {
-            await this.onScroll();
+        //     await this.onScroll();
-        }
+        // }
     }
 
     public async onScroll() {
@@ -236,18 +245,18 @@ export class DiscoverComponent implements OnInit {
     private createModel() {
         const tempResults = <IDiscoverCardResult[]>[];
 
-        switch (this.discoverOptions) {
+        // switch (this.discoverOptions) {
-            case DiscoverOption.Combined:
+        //     case DiscoverOption.Combined:
-                tempResults.push(...this.mapMovieModel());
+        //         tempResults.push(...this.mapMovieModel());
-                tempResults.push(...this.mapTvModel());
+        //         tempResults.push(...this.mapTvModel());
-                break;
+        //         break;
-            case DiscoverOption.Movie:
+        //     case DiscoverOption.Movie:
-                tempResults.push(...this.mapMovieModel());
+        //         tempResults.push(...this.mapMovieModel());
-                break;
+        //         break;
-            case DiscoverOption.Tv:
+        //     case DiscoverOption.Tv:
-                tempResults.push(...this.mapTvModel());
+        //         tempResults.push(...this.mapTvModel());
-                break;
+        //         break;
-        }
+        // }
 
         this.shuffle(tempResults);
         this.discoverResults.push(...tempResults);
@@ -255,9 +264,9 @@ export class DiscoverComponent implements OnInit {
         this.finishLoading();
     }
 
-    private mapMovieModel(): IDiscoverCardResult[] {
+    private mapMovieModel(movies: ISearchMovieResult[]): IDiscoverCardResult[] {
         const tempResults = <IDiscoverCardResult[]>[];
-        this.movies.forEach(m => {
+        movies.forEach(m => {
             tempResults.push({
                 available: m.available,
                 posterPath: m.posterPath ? `https://image.tmdb.org/t/p/w500/${m.posterPath}` : "../../../images/default_movie_poster.png",

src/Ombi/ClientApp/src/app/discover/components/index.ts

@@ -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 { MovieListComponent } from "./movie-list/movie-list.component";
 
 
 export const components: any[] = [
@@ -17,6 +18,7 @@ export const components: any[] = [
     DiscoverCollectionsComponent,
     DiscoverActorComponent,
     DiscoverGridComponent,
+    MovieListComponent,
 ];
 
 

src/Ombi/ClientApp/src/app/discover/components/movie-list/movie-list.component.html

@@ -0,0 +1,23 @@
+<p-carousel [numVisible]="7" [numScroll]="7" [page]="0" [value]="result">
+    <ng-template let-result pTemplate="item">
+        <div class="ombi-card dark-card c">
+            <div [routerLink]="result.type === 1 ? '/details/movie/' + result.id : '/details/tv/' + result.id">
+                <img id="cardImage" src="{{result.posterPath}}" class="image"
+                    alt="{{result.title}}">
+                    <div class="top-left">{{RequestType[result.type] | humanize}}</div>
+                <div class="middle">
+                    <div class="title">{{result.title}}</div>
+                    <div class="small-text">{{result.overview | truncate: 80}}</div>
+                    <div class="row">
+                        <div class="col-6">
+                            <button mat-raised-button class="btn-blue"><mat-icon>remove_red_eye</mat-icon></button>
+                        </div>
+                        <div class="col-6">
+                            <button mat-raised-button class="btn-green"><mat-icon>cloud_download</mat-icon></button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </ng-template>
+</p-carousel>

src/Ombi/ClientApp/src/app/discover/components/movie-list/movie-list.component.scss

@@ -0,0 +1,58 @@
+
+
+.ombi-card {
+    padding: 5px;
+}
+::ng-deep .p-carousel-indicators {
+    display: none !important;
+    }
+
+    
+.image {
+    border-radius: 10px;
+    opacity: 1;
+    display: block;
+    width: 100%;
+    height: auto;
+    transition: .5s ease;
+    backface-visibility: hidden;
+  }
+
+  
+.middle {
+    transition: .5s ease;
+    opacity: 0;
+    position: absolute;
+    top: 75%;
+    width: 90%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    -ms-transform: translate(-50%, -50%);
+  }
+
+  
+  .c {
+    position: relative;
+  }
+  
+.c:hover .image {
+    opacity: 0.3;
+  }
+  
+  .c:hover .middle {
+    opacity: 1;
+  }
+  
+.small-text {
+    font-size: 11px;
+  }
+  .title {
+      font-size: 16px;
+    }
+    .top-left {
+        font-size: 14px;
+        position: absolute;
+        top: 8px;
+        left: 16px;
+        
+      }

src/Ombi/ClientApp/src/app/discover/components/movie-list/movie-list.component.ts

@@ -0,0 +1,85 @@
+import { Component, OnInit, Input } from "@angular/core";
+import { IDiscoverCardResult } from "../../interfaces";
+import { RequestType} from "../../../interfaces";
+import { SearchV2Service } from "../../../services";
+import { ISearchTvResultV2 } from "../../../interfaces/ISearchTvResultV2";
+import { ISearchMovieResultV2 } from "../../../interfaces/ISearchMovieResultV2";
+
+@Component({
+    selector: "movie-list",
+    templateUrl: "./movie-list.component.html",
+    styleUrls: ["./movie-list.component.scss"],
+})
+export class MovieListComponent implements OnInit {
+
+    public RequestType = RequestType;
+    @Input() public result: IDiscoverCardResult;
+    
+    constructor(private searchService: SearchV2Service) { }
+
+    public ngOnInit() {
+        if (this.result.type == RequestType.tvShow) {
+            this.getExtraTvInfo();
+        }
+        if (this.result.type == RequestType.movie) {
+            this.getExtraMovieInfo();
+        }
+    }
+
+
+    public async getExtraTvInfo() {
+        var result = await this.searchService.getTvInfo(this.result.id);
+        this.setTvDefaults(result);
+        this.updateTvItem(result);
+
+    }
+
+    public getStatusClass(): string {
+        if (this.result.available) {
+            return "available";
+        }
+        if (this.result.approved) {
+            return "approved";
+        }
+        if (this.result.requested) {
+            return "requested";
+        }
+        return "notrequested";
+    }
+
+    private getExtraMovieInfo() {
+        if (!this.result.imdbid) {
+            this.searchService.getFullMovieDetails(this.result.id)
+                .subscribe(m => {
+                    this.updateMovieItem(m);
+                });
+        }
+    }
+
+    private updateMovieItem(updated: ISearchMovieResultV2) {
+        this.result.url = "http://www.imdb.com/title/" + updated.imdbId + "/";
+        this.result.available = updated.available;
+        this.result.requested = updated.requested;
+        this.result.requested = updated.requestProcessing;
+        this.result.rating = updated.voteAverage;
+    }
+
+
+    private setTvDefaults(x: ISearchTvResultV2) {
+        if (!x.imdbId) {
+            x.imdbId = "https://www.tvmaze.com/shows/" + x.seriesId;
+        } else {
+            x.imdbId = "http://www.imdb.com/title/" + x.imdbId + "/";
+        }
+    }
+
+    private updateTvItem(updated: ISearchTvResultV2) {
+        this.result.title = updated.title;
+        this.result.id = updated.id;
+        this.result.available = updated.fullyAvailable;
+        this.result.posterPath = updated.banner;
+        this.result.requested = updated.requested;
+        this.result.url = updated.imdbId;
+    }
+
+}

src/Ombi/ClientApp/src/app/discover/discover.module.ts

@@ -5,6 +5,7 @@ import {MatButtonToggleModule} from '@angular/material/button-toggle';
 
 import { SharedModule } from "../shared/shared.module";
 import { PipeModule } from "../pipes/pipe.module";
+import {CarouselModule} from 'primeng/carousel';
 
 import * as fromComponents from './components';
 
@@ -14,6 +15,7 @@ import * as fromComponents from './components';
         RouterModule.forChild(fromComponents.routes),
         SharedModule,
         PipeModule,
+        CarouselModule,
         MatButtonToggleModule,
         InfiniteScrollModule,
     ],

src/Ombi/ClientApp/src/app/media-details/components/tv/panels/tv-requests/tv-requests-panel.component.html

@@ -50,7 +50,7 @@
               <span *ngIf="request.denied" id="deniedLabel" [translate]="'Common.Denied'">
               </span>
               <span *ngIf="!request.denied && ep.available" id="availableLabel" [translate]="'Common.Available'"></span>
-              <span *ngIf="!request.denied &&ep.approved && !ep.available" class="label label-info" id="processingRequestLabel"
+              <span *ngIf="!request.denied && ep.approved && !ep.available" class="label label-info" id="processingRequestLabel"
                 [translate]="'Common.ProcessingRequest'"></span>
               <div *ngIf="!request.denied && !ep.approved">
                 <div *ngIf="!ep.available"><span class="label label-warning" id="pendingApprovalLabel" [translate]="'Common.PendingApproval'"></span></div>

src/Ombi/ClientApp/src/styles/buttons.scss

@@ -5,17 +5,17 @@ $green:#1DE9B6;
 $orange:#F57C00;
 
 .btn-blue {
-    background-color: $blue;
+    background-color: $blue !important;
 }
 
 .btn-pink {
-    background-color: $pink;
+    background-color: $pink !important;
 }
 
 .btn-green {
-    background-color: $green;
+    background-color: $green !important;
 }
 
 .btn-orange {
-    background-color: $orange;
+    background-color: $orange !important;
 }