+
+
+
+
+
+
+
+
+
{{RequestType[result.type] | humanize}}
+
+
{{result.title}}
+
{{result.overview}}
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.scss b/src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.scss
index 5f232a48e..18da6486b 100644
--- a/src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.scss
+++ b/src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.scss
@@ -2,7 +2,7 @@ $ombi-primary:#3f3f3f;
$card-background: #2b2b2b;
#cardImage {
- border-radius: 5px 5px 0px 0px;
+ border-radius: 5px;
height: 75%;
}
@@ -166,4 +166,76 @@ small {
}
.ribbon-icon {
transform: translateX(0%) translateY(0%) rotate(-45deg);
- }
\ No newline at end of file
+ }
+
+
+
+
+.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: 67%;
+ 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: 18px;
+ }
+ .top-left {
+ font-size: 14px;
+ position: absolute;
+ text-transform: uppercase;
+ top: 8px;
+ left: 16px;
+
+ }
+ .full-width {
+ width: 100%;
+ }
+
+ .ellipsis {
+ display: -webkit-box;
+ -webkit-line-clamp: 6;
+ -webkit-box-orient: vertical;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
diff --git a/src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.ts b/src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.ts
index 6512ca3a8..4dd357a89 100644
--- a/src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.ts
+++ b/src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.ts
@@ -1,11 +1,12 @@
import { Component, OnInit, Input } from "@angular/core";
import { IDiscoverCardResult } from "../../interfaces";
import { RequestType } from "../../../interfaces";
-import { SearchService, SearchV2Service } from "../../../services";
+import { MessageService, RequestService, SearchV2Service } from "../../../services";
import { MatDialog } from "@angular/material/dialog";
import { DiscoverCardDetailsComponent } from "./discover-card-details.component";
import { ISearchTvResultV2 } from "../../../interfaces/ISearchTvResultV2";
import { ISearchMovieResultV2 } from "../../../interfaces/ISearchMovieResultV2";
+import { EpisodeRequestComponent } from "../../../shared/episode-request/episode-request.component";
@Component({
selector: "discover-card",
@@ -17,8 +18,14 @@ export class DiscoverCardComponent implements OnInit {
@Input() public result: IDiscoverCardResult;
public RequestType = RequestType;
public hide: boolean;
+ public fullyLoaded = false;
+ public loading: boolean;
- constructor(private searchService: SearchV2Service, private v1Search: SearchService, private dialog: MatDialog) { }
+ // This data is needed to open the dialog
+ private tvSearchResult: ISearchTvResultV2;
+
+ constructor(private searchService: SearchV2Service, private dialog: MatDialog, private requestService: RequestService,
+ public messageService: MessageService) { }
public ngOnInit() {
if (this.result.type == RequestType.tvShow) {
@@ -38,16 +45,16 @@ export class DiscoverCardComponent implements OnInit {
public async getExtraTvInfo() {
if (this.result.tvMovieDb) {
- var result = await this.searchService.getTvInfoWithMovieDbId(+this.result.id);
+ this.tvSearchResult = await this.searchService.getTvInfoWithMovieDbId(+this.result.id);
} else {
- var result = await this.searchService.getTvInfo(+this.result.id);
+ this.tvSearchResult = await this.searchService.getTvInfo(+this.result.id);
}
- if(result.status === "404") {
+ if (this.tvSearchResult.status === "404") {
this.hide = true;
return;
}
- this.setTvDefaults(result);
- this.updateTvItem(result);
+ this.setTvDefaults(this.tvSearchResult);
+ this.updateTvItem(this.tvSearchResult);
}
@@ -55,10 +62,13 @@ export class DiscoverCardComponent implements OnInit {
this.searchService.getArtistInformation(this.result.id.toString()).subscribe(x => {
if (x.poster) {
this.result.posterPath = x.poster;
+ this.fullyLoaded = true;
} else {
this.searchService.getReleaseGroupArt(this.result.id.toString()).subscribe(art => {
- if(art.image) {
+ if (art.image) {
this.result.posterPath = art.image;
+
+ this.fullyLoaded = true;
}
})
}
@@ -68,8 +78,7 @@ export class DiscoverCardComponent implements OnInit {
}
public generateDetailsLink(): string {
- let link = "";
- switch(this.result.type){
+ switch (this.result.type) {
case RequestType.movie:
return `/details/movie/${this.result.id}`;
case RequestType.tvShow:
@@ -105,12 +114,36 @@ export class DiscoverCardComponent implements OnInit {
return "";
}
+ public request(event: any) {
+ event.preventDefault();
+ this.loading = true;
+ switch (this.result.type) {
+ case RequestType.tvShow:
+ const dia = this.dialog.open(EpisodeRequestComponent, { width: "700px", data: { series: this.tvSearchResult }, panelClass: 'modal-panel' });
+ dia.afterClosed().subscribe(x => this.loading = false);
+ return;
+ case RequestType.movie:
+ this.requestService.requestMovie({ theMovieDbId: +this.result.id, languageCode: null, requestOnBehalf: null }).subscribe(x => {
+ if (x.result) {
+ this.result.requested = true;
+ this.messageService.send(x.message, "Ok");
+ } else {
+ this.messageService.send(x.errorMessage, "Ok");
+ }
+ this.loading = false;
+ });
+ return;
+ }
+ }
+
private getExtraMovieInfo() {
if (!this.result.imdbid) {
this.searchService.getFullMovieDetails(+this.result.id)
.subscribe(m => {
this.updateMovieItem(m);
});
+ } else {
+ this.fullyLoaded = true;
}
}
@@ -122,6 +155,8 @@ export class DiscoverCardComponent implements OnInit {
this.result.rating = updated.voteAverage;
this.result.overview = updated.overview;
this.result.imdbid = updated.imdbId;
+
+ this.fullyLoaded = true;
}
@@ -142,6 +177,8 @@ export class DiscoverCardComponent implements OnInit {
this.result.url = updated.imdbId;
this.result.overview = updated.overview;
this.result.approved = updated.approved;
+
+ this.fullyLoaded = true;
}
}
diff --git a/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.html b/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.html
index f51f73ede..22be3d83a 100644
--- a/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.html
+++ b/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.html
@@ -40,13 +40,17 @@
-
+
-
Trending Movies
-
\ No newline at end of file
diff --git a/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.scss b/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.scss
index 9c11beab7..76e1ce26c 100644
--- a/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.scss
+++ b/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.scss
@@ -1,213 +1,3 @@
-.full-height {
- height: 100%;
-}
-
-.small-middle-container {
- margin: auto;
- width: 85%;
- padding-left:2%;
-}
-
-.small-padding {
- padding-left: 20px;
- padding-right: 20px;
- margin-bottom: 28px;
-}
-
-.loading-spinner {
- margin: 10%;
-}
-
-#scroller {
- height: 100vh;
- overflow: scroll;
-}
-
-.small-space {
- padding-top: 1%;
-}
-
-.discover-layout {
- position: absolute;
- float: right;
- margin-right: 36px;
- z-index: 1;
-}
-
-::ng-deep .mat-card-image {
- height: 75%;
- border-radius: 10px;
- width: 100%;
- object-fit: cover;
- display: block;
-}
-
-.card-spacing {
- height: 100%;
-}
-
-.mat-card-content h6 {
- overflow: hidden;
- white-space: nowrap;
- font-weight: 500;
- font-size: 1.1rem;
-}
-
-@media (min-width: 300px) {
-
- .small-middle-container {
- margin: inherit;
- }
-
- .col-xl-2 {
- flex: 0 0 100%;
- max-width: 100%;
- min-width: 100%;
- }
-
- .btn-group {
- width: 100%;
- }
-
- mat-button-base {
- width: 100%;
- }
-
- .col {
- padding-right: 10px !important;
- padding-left: 10px !important;
- }
-
- .row {
- margin-left: 0px;
- }
-
- .small-padding {
- padding-left: 5px !important;
- padding-right: 0px !important;
- height: 40em;
- }
-
- ::ng-deep .mat-card-image {
- height: 85% !important;
- }
-}
-
-@media (min-width: 600px) {
- .justify-content-md-center {
- justify-content: center !important;
- }
-
- .small-middle-container {
- width: auto;
- }
-
- .btn-group {
- width: auto;
- }
-
- mat-button-base {
- width: auto;
- }
-
- ::ng-deep .mat-card-image {
- height: 75% !important;
- }
-}
-
-@media (min-width: 660px) {
- .col-xl-2 {
- flex: 0 0 50%;
- max-width: 50%;
- min-width: 50%;
- }
-
- .col {
- padding-right: 15px !important;
- padding-left: 15px !important;
- }
-
- .small-padding {
- padding-left: 20px !important;
- padding-right: 20px !important;
- height: auto;
- }
-
- .row {
- margin-left: 0px;
- }
-
- .small-middle-container {
- width: auto;
- overflow: hidden;
- }
-
- .btn-group {
- width: auto;
- }
-
- mat-button-base {
- width: auto;
- }
-}
-
-@media (min-width: 870px) {
- .col-xl-2 {
- flex: 0 0 33.33333%;
- max-width: 33.33333%;
- min-width: 33.33333%;
- }
-}
-
-@media (min-width: 1100px) {
- .col-xl-2 {
- flex: 0 0 20%;
- max-width: 25%;
- min-width: 25%;
- }
-}
-
-@media (min-width: 1300px) {
- .col-xl-2 {
- flex: 0 0 18%;
- max-width: 20%;
- min-width: 20%;
- }
-}
-
-@media (min-width: 1600px) {
- .col-xl-2 {
- flex: 0 0 16.66666667%;
- max-width: 16.66666667%;
- min-width: 16.66666667%;
- }
-}
-
-@media (min-width: 1900px) {
- .col-xl-2 {
- flex: 0 0 14.285713%;
- max-width: 14.285713%;
- min-width: 14.285713%;
- }
-}
-
-@media (min-width: 2200px) {
- .col-xl-2 {
- flex: 0 0 12.5%;
- max-width: 12.5%;
- min-width: 12.5%;
- }
-}
-
-@media (min-width: 2500px) {
- .col-xl-2 {
- flex: 0 0 11.111111%;
- max-width: 11.111111%;
- min-width: 11.111111%;
- }
-}
-@media (max-width: 420px) {
- .discover-layout{
- display: none;
- }
-}
+.section {
+ margin: 20px;
+}
\ No newline at end of file
diff --git a/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.ts b/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.ts
index 6939c51ee..519126715 100644
--- a/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.ts
+++ b/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.ts
@@ -5,6 +5,7 @@ import { IDiscoverCardResult, DiscoverOption, DisplayOption } from "../../interf
import { trigger, transition, style, animate } from "@angular/animations";
import { StorageService } from "../../../shared/storage/storage-service";
import { DOCUMENT } from "@angular/common";
+import { ISearchTvResultV2 } from "../../../interfaces/ISearchTvResultV2";
@Component({
templateUrl: "./discover.component.html",
@@ -58,7 +59,7 @@ export class DiscoverComponent implements OnInit {
public async ngOnInit() {
this.loading()
- this.upcomingMovies = this.mapMovieModel(await this.searchService.upcomingMoviesByPage(0, 14));
+ this.upcomingMovies = this.mapTvModel(await this.searchService.popularTvByPage(0, 14));
this.trendingMovies = this.mapMovieModel(await this.searchService.popularMoviesByPage(0, 14));
this.finishLoading();
// const localDiscoverOptions = +this.storageService.get(this.mediaTypeStorageKey);
@@ -286,9 +287,9 @@ this.finishLoading();
return tempResults;
}
- private mapTvModel(): IDiscoverCardResult[] {
+ private mapTvModel(tv: ISearchTvResult[]): IDiscoverCardResult[] {
const tempResults =
[];
- this.tvShows.forEach(m => {
+ tv.forEach(m => {
tempResults.push({
available: m.available,
posterPath: "../../../images/default_tv_poster.png",
diff --git a/src/Ombi/ClientApp/src/app/discover/components/movie-list/movie-list.component.html b/src/Ombi/ClientApp/src/app/discover/components/movie-list/movie-list.component.html
index d37f21d0a..908fc941b 100644
--- a/src/Ombi/ClientApp/src/app/discover/components/movie-list/movie-list.component.html
+++ b/src/Ombi/ClientApp/src/app/discover/components/movie-list/movie-list.component.html
@@ -1,23 +1,5 @@
-
+
-
-
-
-
{{RequestType[result.type] | humanize}}
-
-
{{result.title}}
-
{{result.overview | truncate: 80}}
-
-
-
-
-
-
-
-
-
-
-