Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-03-11 21:27:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

change the board threshhold to be items count instead of px

Browse source
This commit is contained in:
nklhrstv 2022-06-01 14:44:59 +03:00
parent dd71f9b0ac
commit a33d9db6dc
2 changed files with 9 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/common/getVisibleChildrenRange.js
View file

@ -1,18 +1,18 @@
// Copyright (C) 2017-2022 Smart code 203358507
const isChildVisible = (container, element, threshold) => {
const isChildVisible = (container, element) => {
const elementTop = element.offsetTop;
const elementBottom = element.offsetTop + element.clientHeight;
const containerTop = container.scrollTop - threshold;
const containerBottom = container.scrollTop + container.clientHeight + threshold;
const containerTop = container.scrollTop;
const containerBottom = container.scrollTop + container.clientHeight;
return (elementTop >= containerTop && elementBottom <= containerBottom) ||
(elementTop < containerTop && containerTop < elementBottom) ||
(elementTop < containerBottom && containerBottom < elementBottom);
};
const getVisibleChildrenRange = (container, threshold) => {
const getVisibleChildrenRange = (container) => {
return Array.from(container.children).reduce((result, child, index) => {
if (isChildVisible(container, child, threshold)) {
if (isChildVisible(container, child)) {
if (result === null) {
result = {
start: index,

8
src/routes/Board/Board.js
View file

@ -8,7 +8,7 @@ const useBoard = require('./useBoard');
const useContinueWatchingPreview = require('./useContinueWatchingPreview');
const styles = require('./styles');
const THRESHOLD = 300;
const THRESHOLD = 5;
const Board = () => {
const profile = useProfile();
@ -18,13 +18,13 @@ const Board = () => {
const boardCatalogsOffset = continueWatchingPreview.libraryItems.length > 0 ? 1 : 0;
const scrollContainerRef = React.useRef();
const onVisibleRangeChange = React.useCallback(() => {
const range = getVisibleChildrenRange(scrollContainerRef.current, THRESHOLD);
const range = getVisibleChildrenRange(scrollContainerRef.current);
if (range === null) {
return;
}
const start = Math.max(0, range.start - boardCatalogsOffset);
const end = range.end - boardCatalogsOffset;
const start = Math.max(0, range.start - boardCatalogsOffset - THRESHOLD);
const end = range.end - boardCatalogsOffset + THRESHOLD;
if (end < start) {
return;
}