diff --git a/client/src/components/netflix-grid.tsx b/client/src/components/netflix-grid.tsx index 7dd170e..fb975fb 100644 --- a/client/src/components/netflix-grid.tsx +++ b/client/src/components/netflix-grid.tsx @@ -170,13 +170,8 @@ function CategoryRow({ category, onVideoClick }: CategoryRowProps) { const newX = prev + speed; const totalWidth = category.videos.length * videoWidth; - // 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 >= -totalWidth * 0.5) { - return newX - totalWidth; - } + // Pure continuous flow - NO RESETS AT ALL + // Let it move freely, browser will handle infinite scroll return newX; }); }, interval); @@ -200,13 +195,8 @@ function CategoryRow({ category, onVideoClick }: CategoryRowProps) { const newX = prev + speed; const totalWidth = category.videos.length * videoWidth; - // 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 >= -totalWidth * 0.5) { - return newX - totalWidth; - } + // Pure continuous flow - NO RESETS AT ALL + // Let it move freely, browser will handle infinite scroll return newX; }); }, 16); // Fixed interval - speed controlled by pixel movement only @@ -343,8 +333,8 @@ function CategoryRow({ category, onVideoClick }: CategoryRowProps) { transition: isScrolling ? 'none' : 'transform 0.3s ease' }} > - {/* Triple the videos for seamless infinite flow */} - {[...category.videos, ...category.videos, ...category.videos].map((video, index) => { + {/* Many copies for true infinite scroll */} + {[...Array(10)].flatMap(() => category.videos).map((video, index) => { const actualIndex = index % category.videos.length; return (
diff --git a/server/bunny.ts b/server/bunny.ts index 0f831b2..a1205bc 100644 --- a/server/bunny.ts +++ b/server/bunny.ts @@ -73,9 +73,11 @@ export class BunnyService { private bunnyVideoToVideo(bunnyVideo: BunnyVideo | BunnyVideoDetails): Video { // Generate optimized thumbnail URL from Bunny CDN with WebP format for better performance + // Add cache busting timestamp to ensure fresh thumbnails + const timestamp = Date.now(); const thumbnailUrl = bunnyVideo.thumbnailFileName - ? `https://${this.hostname}/${bunnyVideo.guid}/${bunnyVideo.thumbnailFileName}?width=400&height=225&format=webp` - : `https://${this.hostname}/${bunnyVideo.guid}/thumbnail.jpg?width=400&height=225&format=webp`; + ? `https://${this.hostname}/${bunnyVideo.guid}/${bunnyVideo.thumbnailFileName}?width=400&height=225&format=webp&t=${timestamp}` + : `https://${this.hostname}/${bunnyVideo.guid}/thumbnail.jpg?width=400&height=225&format=webp&t=${timestamp}`; // Generate signed HLS URL for private video access const hlsUrl = this.generateSignedUrl(bunnyVideo.guid);