Fixed the issue for larger devices not scrolling, also fixed the funny scroll issue on mobile devices

pull/3738/head
tidusjar 4 years ago
parent d1a172758d
commit 23be71d8d9

@ -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%;
}
}
}

@ -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);
}
}

Loading…
Cancel
Save