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

Improve video scrolling speed and smooth continuous movement

Browse Source 
Increase scrolling speed and adjust boundary conditions for smoother, continuous horizontal video playback in category rows.

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/QCN70f2
This commit is contained in:
sebastjanartic 2025-08-29 16:07:51 +00:00
parent 91b03a95bb
commit bca3589142
1 changed files with 11 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -165,15 +165,16 @@ function CategoryRow({ category, onVideoClick }: CategoryRowProps) {
scrollIntervalRef.current = setInterval(() => {
setTranslateX(prev => {
// Use current speed mode for toggle function only
const currentSpeed = speedMode === 'fast' ? 1.5 : 0.8;
const currentSpeed = speedMode === 'fast' ? 3.5 : 2.0;
const speed = direction === 'right' ? -currentSpeed : currentSpeed;
const newX = prev + speed;
const totalWidth = category.videos.length * videoWidth;
// Simple boundary check without complex math
if (newX <= -totalWidth) {
// No resets - let it flow continuously with proper wrapping
// Only wrap when we've gone a full cycle past the boundary
if (newX <= -totalWidth * 1.5) {
return newX + totalWidth;
} else if (newX >= 0) {
} else if (newX >= -totalWidth * 0.5) {
return newX - totalWidth;
}
return newX;
@ -193,16 +194,17 @@ function CategoryRow({ category, onVideoClick }: CategoryRowProps) {
// Start continuous smooth scrolling with variable speed
scrollIntervalRef.current = setInterval(() => {
setTranslateX(prev => {
// Fixed speed for consistent movement - no automatic changes
const baseSpeed = 0.8; // Always same speed on hover
// Faster speed for better movement
const baseSpeed = 2.0; // Faster speed on hover
const speed = direction === 'right' ? -baseSpeed : baseSpeed;
const newX = prev + speed;
const totalWidth = category.videos.length * videoWidth;
// Simple boundary check without complex math
if (newX <= -totalWidth) {
// No resets - let it flow continuously with proper wrapping
// Only wrap when we've gone a full cycle past the boundary
if (newX <= -totalWidth * 1.5) {
return newX + totalWidth;
} else if (newX >= 0) {
} else if (newX >= -totalWidth * 0.5) {
return newX - totalWidth;
}
return newX;