mirror of https://github.com/Ombi-app/Ombi
commit
a003095540
@ -0,0 +1,29 @@
|
|||||||
|
export interface IRecentlyAddedMovies {
|
||||||
|
id: number;
|
||||||
|
title: string;
|
||||||
|
overview: string;
|
||||||
|
imdbId: string;
|
||||||
|
theMovieDbId: string;
|
||||||
|
releaseYear: string;
|
||||||
|
addedAt: Date;
|
||||||
|
quality: string;
|
||||||
|
|
||||||
|
// For UI only
|
||||||
|
posterPath: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface IRecentlyAddedTvShows extends IRecentlyAddedMovies {
|
||||||
|
seasonNumber: number;
|
||||||
|
episodeNumber: number;
|
||||||
|
tvDbId: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface IRecentlyAddedRangeModel {
|
||||||
|
from: Date;
|
||||||
|
to: Date;
|
||||||
|
}
|
||||||
|
|
||||||
|
export enum RecentlyAddedType {
|
||||||
|
Plex,
|
||||||
|
Emby,
|
||||||
|
}
|
@ -0,0 +1,51 @@
|
|||||||
|
<h1>Recently Added</h1>
|
||||||
|
<input type="checkbox" [(ngModel)]="groupTv" (click)="change()" />
|
||||||
|
<hr />
|
||||||
|
<p-calendar [(ngModel)]="range" showButtonBar="true" selectionMode="range" (onClose)="close()"></p-calendar>
|
||||||
|
<hr />
|
||||||
|
<style>
|
||||||
|
.img-conatiner {
|
||||||
|
position: relative;
|
||||||
|
text-align: center;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Bottom left text */
|
||||||
|
.bottom-left {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 8px;
|
||||||
|
left: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
<ngu-carousel [inputs]="carouselTile">
|
||||||
|
<ngu-tile NguCarouselItem *ngFor="let movie of movies">
|
||||||
|
<div class="img-container">
|
||||||
|
<img class="img-responsive poster" src="{{movie.posterPath}}" style="width: 300px" alt="poster">
|
||||||
|
<div class="bottom-left"> {{movie.title}}</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</ngu-tile>
|
||||||
|
|
||||||
|
<button NguCarouselPrev class='leftRs'><i class="fa fa-arrow-left"></i></button>
|
||||||
|
<button NguCarouselNext class='rightRs'><i class="fa fa-arrow-right"></i></button>
|
||||||
|
</ngu-carousel>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<hr/>
|
||||||
|
|
||||||
|
<ngu-carousel [inputs]="carouselTile">
|
||||||
|
<ngu-tile NguCarouselItem *ngFor="let t of tv">
|
||||||
|
<img class="img-responsive poster" src="{{t.posterPath}}" style="width: 300px" alt="poster">
|
||||||
|
<b>{{t.title}}</b>
|
||||||
|
<br>
|
||||||
|
<b>Season: {{t.seasonNumber}}</b>
|
||||||
|
<br>
|
||||||
|
<b>Episode: {{t.episodeNumber}}</b>
|
||||||
|
</ngu-tile>
|
||||||
|
|
||||||
|
<button NguCarouselPrev class='leftRs'><i class="fa fa-arrow-left"></i></button>
|
||||||
|
<button NguCarouselNext class='rightRs'><i class="fa fa-arrow-right"></i></button>
|
||||||
|
</ngu-carousel>
|
@ -0,0 +1,127 @@
|
|||||||
|
import { Component, OnInit } from "@angular/core";
|
||||||
|
import { NguCarousel } from "@ngu/carousel";
|
||||||
|
|
||||||
|
import { ImageService, RecentlyAddedService } from "../services";
|
||||||
|
import { IRecentlyAddedMovies, IRecentlyAddedTvShows } from "./../interfaces";
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
templateUrl: "recentlyAdded.component.html",
|
||||||
|
styles: [`
|
||||||
|
.leftRs {
|
||||||
|
position: absolute;
|
||||||
|
margin: auto;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
box-shadow: 1px 2px 10px -1px rgba(0, 0, 0, .3);
|
||||||
|
border-radius: 100%;
|
||||||
|
left: 0;
|
||||||
|
background: #df691a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rightRs {
|
||||||
|
position: absolute;
|
||||||
|
margin: auto;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
box-shadow: 1px 2px 10px -1px rgba(0, 0, 0, .3);
|
||||||
|
border-radius: 100%;
|
||||||
|
right: 0;
|
||||||
|
background: #df691a;
|
||||||
|
}
|
||||||
|
`],
|
||||||
|
})
|
||||||
|
|
||||||
|
export class RecentlyAddedComponent implements OnInit {
|
||||||
|
public movies: IRecentlyAddedMovies[];
|
||||||
|
public tv: IRecentlyAddedTvShows[];
|
||||||
|
public range: Date[];
|
||||||
|
|
||||||
|
public groupTv: boolean = false;
|
||||||
|
|
||||||
|
// https://github.com/sheikalthaf/ngu-carousel
|
||||||
|
public carouselTile: NguCarousel;
|
||||||
|
|
||||||
|
constructor(private recentlyAddedService: RecentlyAddedService,
|
||||||
|
private imageService: ImageService) {}
|
||||||
|
|
||||||
|
public ngOnInit() {
|
||||||
|
this.getMovies();
|
||||||
|
this.getShows();
|
||||||
|
|
||||||
|
this.carouselTile = {
|
||||||
|
grid: {xs: 2, sm: 3, md: 3, lg: 5, all: 0},
|
||||||
|
slide: 2,
|
||||||
|
speed: 400,
|
||||||
|
animation: "lazy",
|
||||||
|
point: {
|
||||||
|
visible: true,
|
||||||
|
},
|
||||||
|
load: 2,
|
||||||
|
touch: true,
|
||||||
|
easing: "ease",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
public close() {
|
||||||
|
if(this.range.length < 2) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if(!this.range[1]) {
|
||||||
|
// If we do not have a second date then just set it to now
|
||||||
|
this.range[1] = new Date();
|
||||||
|
}
|
||||||
|
this.getMovies();
|
||||||
|
}
|
||||||
|
|
||||||
|
public change() {
|
||||||
|
this.getShows();
|
||||||
|
}
|
||||||
|
|
||||||
|
private getShows() {
|
||||||
|
if(this.groupTv) {
|
||||||
|
this.recentlyAddedService.getRecentlyAddedTvGrouped().subscribe(x => {
|
||||||
|
this.tv = x;
|
||||||
|
|
||||||
|
this.tv.forEach((t) => {
|
||||||
|
this.imageService.getTvPoster(t.tvDbId).subscribe(p => {
|
||||||
|
t.posterPath = p;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
this.recentlyAddedService.getRecentlyAddedTv().subscribe(x => {
|
||||||
|
this.tv = x;
|
||||||
|
|
||||||
|
this.tv.forEach((t) => {
|
||||||
|
this.imageService.getTvPoster(t.tvDbId).subscribe(p => {
|
||||||
|
t.posterPath = p;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private getMovies() {
|
||||||
|
this.recentlyAddedService.getRecentlyAddedMovies().subscribe(x => {
|
||||||
|
this.movies = x;
|
||||||
|
|
||||||
|
this.movies.forEach((movie) => {
|
||||||
|
if(movie.theMovieDbId) {
|
||||||
|
this.imageService.getMoviePoster(movie.theMovieDbId).subscribe(p => {
|
||||||
|
movie.posterPath = p;
|
||||||
|
});
|
||||||
|
} else if(movie.imdbId) {
|
||||||
|
this.imageService.getMoviePoster(movie.imdbId).subscribe(p => {
|
||||||
|
movie.posterPath = p;
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
movie.posterPath = "";
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue