From 23be71d8d9588da0398a172cab2e4609d610a371 Mon Sep 17 00:00:00 2001
From: tidusjar <tidusjar@gmail.com>
Date: Thu, 20 Aug 2020 22:24:40 +0100
Subject: [PATCH] Fixed the issue for larger devices not scrolling, also fixed
 the funny scroll issue on mobile devices

---
 .../discover/discover.component.scss          | 30 +++++++++----------
 .../components/discover/discover.component.ts | 21 ++++++++++---
 2 files changed, 31 insertions(+), 20 deletions(-)

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 dd8879545..5d08d5656 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
@@ -49,9 +49,6 @@
         max-width: 100%;
         min-width: 100%;
     }
-    .small-middle-container{
-        width:100%;
-    }
 
     .btn-group {
         width:100%;
@@ -61,16 +58,16 @@
         width:100%;
     }
 
-    .col{
+    .col {
         padding-right: 10px !important;
         padding-left:10px !important;
     }
 
-    .row{
+    .row {
         margin-left:0px;
     }
 
-    .small-padding{
+    .small-padding {
         padding-left: 5px !important;
         padding-right: 0px !important;
         height: 40em;
@@ -100,7 +97,7 @@
     ::ng-deep .mat-card-image {
         height:75% !important;
     }
-}   
+}
 
 @media (min-width: 660px) {
     .col-xl-2 {
@@ -137,7 +134,7 @@
         width:auto;
     }
 }
-    
+
 @media (min-width: 870px) {
     .col-xl-2 {
         flex: 0 0 33.33333%;
@@ -145,7 +142,7 @@
         min-width: 33.33333%;
     }
 }
-    
+
 @media (min-width: 1100px) {
     .col-xl-2 {
         flex: 0 0 20%;
@@ -153,27 +150,28 @@
         min-width: 25%;
     }
 }
-    
-@media (min-width: 1300px) {  
+
+@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) {
@@ -181,7 +179,7 @@
         flex: 0 0 12.5%;
         max-width: 12.5%;
         min-width: 12.5%;
-    }      
+    }
 }
 
 @media (min-width: 2500px) {
@@ -189,5 +187,5 @@
         flex: 0 0 11.111111%;
         max-width: 11.111111%;
         min-width: 11.111111%;
-    }      
+    }
 }
\ 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 a92d92c5f..5e1f8f640 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
@@ -1,9 +1,10 @@
-import { Component, OnInit } from "@angular/core";
+import { Component, OnInit, Inject } from "@angular/core";
 import { SearchV2Service } from "../../../services";
 import { ISearchMovieResult, ISearchTvResult, RequestType } from "../../../interfaces";
 import { IDiscoverCardResult, DiscoverOption } from "../../interfaces";
 import { trigger, transition, style, animate } from "@angular/animations";
 import { StorageService } from "../../../shared/storage/storage-service";
+import { DOCUMENT } from "@angular/common";
 
 @Component({
     templateUrl: "./discover.component.html",
@@ -42,7 +43,9 @@ export class DiscoverComponent implements OnInit {
     private mediaTypeStorageKey = "DiscoverOptions";
 
     constructor(private searchService: SearchV2Service,
-        private storageService: StorageService) { }
+        private storageService: StorageService,
+        @Inject(DOCUMENT) private container: Document) { }
+
 
     public async ngOnInit() {
         this.loading()
@@ -68,6 +71,9 @@ export class DiscoverComponent implements OnInit {
 
         this.createInitialModel();
         this.scrollDisabled = false;
+        if (!this.containerHasScrollBar()) {
+            await this.onScroll();
+        }
     }
 
     public async onScroll() {
@@ -209,7 +215,7 @@ export class DiscoverComponent implements OnInit {
     public async switchDiscoverMode(newMode: DiscoverOption) {
         this.loading();
         this.clear();
-        this.discoverOptions = newMode;        
+        this.discoverOptions = newMode;
         this.storageService.save(this.mediaTypeStorageKey, newMode.toString());
         await this.ngOnInit();
         this.finishLoading();
@@ -242,7 +248,7 @@ export class DiscoverComponent implements OnInit {
         this.movies.forEach(m => {
             tempResults.push({
                 available: m.available,
-                posterPath: m.posterPath ? `https://image.tmdb.org/t/p/w300/${m.posterPath}` : "../../../images/default_movie_poster.png",
+                posterPath: m.posterPath ? `https://image.tmdb.org/t/p/w500/${m.posterPath}` : "../../../images/default_movie_poster.png",
                 requested: m.requested,
                 title: m.title,
                 type: RequestType.movie,
@@ -301,4 +307,11 @@ export class DiscoverComponent implements OnInit {
     private finishLoading() {
         this.loadingFlag = false;
     }
+
+    private containerHasScrollBar(): boolean {
+        return
+        // div.scrollHeight > div.clientHeight;
+        this.container.documentElement.scrollHeight > this.container.documentElement.clientHeight;
+        // this.container.documentElement.scrollHeight > (window.innerHeight + window.pageYOffset);
+    }
 }