sebastjan/videofolxtv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve scrolling behavior by adjusting speed and removing complex wrap-around logic

Browse Source 
Refactor `CategoryRow` component in `netflix-grid.tsx` to simplify scrolling calculations by directly returning `prev + speed` and removing the previous complex infinite scroll logic.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2eb1084e-b728-4449-9231-f1665924c8d5
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2eb1084e-b728-4449-9231-f1665924c8d5/oSbWwS4
This commit is contained in:
sebastjanartic 2025-08-29 16:32:49 +00:00
parent 67a10a16d4
commit 3b752c93ad
1 changed files with 2 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
client/src/components/netflix-grid.tsx
View File

@ -167,19 +167,7 @@ function CategoryRow({ category, onVideoClick }: CategoryRowProps) {
// Use the NEW speed that was just set // Use the NEW speed that was just set
const currentSpeed = newSpeed === 'fast' ? 3.5 : 2.0; const currentSpeed = newSpeed === 'fast' ? 3.5 : 2.0;
const speed = direction === 'right' ? -currentSpeed : currentSpeed; const speed = direction === 'right' ? -currentSpeed : currentSpeed;
const newX = prev + speed; return prev + speed;
const totalWidth = category.videos.length * videoWidth;
// TRUE INFINITE SCROLL - wrap around seamlessly
if (direction === 'right' && newX <= -totalWidth) {
// When moved one full cycle to the right, wrap back to start
return newX + totalWidth;
} else if (direction === 'left' && newX >= totalWidth) {
// When moved one full cycle to the left, wrap back to end
return newX - totalWidth;
}
return newX;
}); });
}, interval); }, interval);
} }
@ -199,19 +187,7 @@ function CategoryRow({ category, onVideoClick }: CategoryRowProps) {
// Faster speed for better movement // Faster speed for better movement
const baseSpeed = 2.0; // Faster speed on hover const baseSpeed = 2.0; // Faster speed on hover
const speed = direction === 'right' ? -baseSpeed : baseSpeed; const speed = direction === 'right' ? -baseSpeed : baseSpeed;
const newX = prev + speed; return prev + speed;
const totalWidth = category.videos.length * videoWidth;
// TRUE INFINITE SCROLL - wrap around seamlessly
if (direction === 'right' && newX <= -totalWidth) {
// When moved one full cycle to the right, wrap back to start
return newX + totalWidth;
} else if (direction === 'left' && newX >= totalWidth) {
// When moved one full cycle to the left, wrap back to end
return newX - totalWidth;
}
return newX;
}); });
}, 16); // Fixed interval - speed controlled by pixel movement only }, 16); // Fixed interval - speed controlled by pixel movement only
}; };