diff --git a/client/src/components/netflix-grid.tsx b/client/src/components/netflix-grid.tsx index 60cde6d..a8cc308 100644 --- a/client/src/components/netflix-grid.tsx +++ b/client/src/components/netflix-grid.tsx @@ -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;