From b5f0b50c4a39eb225264df982901a1289d8a21c0 Mon Sep 17 00:00:00 2001
From: sebastjanartic <45803536-sebastjanartic@users.noreply.replit.com>
Date: Thu, 4 Sep 2025 13:34:31 +0000
Subject: [PATCH] Update platform branding and sharing links to reflect the new
 domain name

This commit updates all instances of the old domain name "go4.video" to the new domain name "video.folx.tv" across various frontend components, including modals, headers, cards, and page metadata. It also includes updates to sharing intent URLs for Twitter and WhatsApp to use the new domain. Additionally, CSS for Video.js loading animations has been added to `index.css`.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 946a0075-7e32-454b-b348-9e7f576d7f45
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/60d372ff-2c10-46c7-b01b-10c3435136b0/946a0075-7e32-454b-b348-9e7f576d7f45/jh6R7y2
---
 client/src/components/bunny-video-modal.tsx   |  4 +--
 client/src/components/netflix-grid.tsx        |  2 +-
 client/src/components/search-header.tsx       |  2 +-
 client/src/components/thumbnail-generator.tsx |  2 +-
 client/src/components/vast-player.tsx         |  2 +-
 client/src/components/video-ads.tsx           |  2 +-
 client/src/components/video-card.tsx          |  2 +-
 client/src/components/video-grid.tsx          |  2 +-
 client/src/components/video-modal.tsx         |  4 +--
 client/src/index.css                          | 25 ++++++++++++++++++
 client/src/pages/VideoPage.tsx                | 26 +++++++++----------
 11 files changed, 49 insertions(+), 24 deletions(-)

diff --git a/client/src/components/bunny-video-modal.tsx b/client/src/components/bunny-video-modal.tsx
index a723936..bd7a93d 100644
--- a/client/src/components/bunny-video-modal.tsx
+++ b/client/src/components/bunny-video-modal.tsx
@@ -156,14 +156,14 @@ export default function BunnyVideoModal({ video, isOpen, onClose, onEdit, videos
   };
 
   const shareOnTwitter = () => {
-    const text = `Poglej si "${video?.title}" na go4.video`;
+    const text = `Poglej si "${video?.title}" na video.folx.tv`;
     const url = `https://twitter.com/intent/tweet?text=${encodeURIComponent(text)}&url=${encodeURIComponent(getShareUrl())}`;
     window.open(url, 'twitter-share', 'width=600,height=400');
     setShowShareMenu(false);
   };
 
   const shareOnWhatsApp = () => {
-    const text = `Poglej si "${video?.title}" na go4.video: ${getShareUrl()}`;
+    const text = `Poglej si "${video?.title}" na video.folx.tv: ${getShareUrl()}`;
     const url = `https://wa.me/?text=${encodeURIComponent(text)}`;
     window.open(url, 'whatsapp-share', 'width=600,height=400');
     setShowShareMenu(false);
diff --git a/client/src/components/netflix-grid.tsx b/client/src/components/netflix-grid.tsx
index 3378658..c752f4f 100644
--- a/client/src/components/netflix-grid.tsx
+++ b/client/src/components/netflix-grid.tsx
@@ -149,7 +149,7 @@ export default function NetflixGrid({ videos, isLoading }: NetflixGridProps) {
           <div className="w-16 h-16 gradient-primary rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-4 mx-auto">
             <div className="w-0 h-0 border-l-[12px] border-l-white border-y-[9px] border-y-transparent ml-1"></div>
           </div>
-          <h3 className="text-white text-xl font-bold mb-2">go4.video</h3>
+          <h3 className="text-white text-xl font-bold mb-2">video.folx.tv</h3>
           <p className="text-bunny-light">Loading videos...</p>
         </div>
       </div>
diff --git a/client/src/components/search-header.tsx b/client/src/components/search-header.tsx
index 7f9131d..f55e0ed 100644
--- a/client/src/components/search-header.tsx
+++ b/client/src/components/search-header.tsx
@@ -60,7 +60,7 @@ export default function SearchHeader({
               <div className="w-9 h-9 gradient-primary rounded-lg flex items-center justify-center shadow-lg">
                 <div className="w-0 h-0 border-l-[10px] border-l-white border-y-[7px] border-y-transparent ml-1"></div>
               </div>
-              <h1 className="text-2xl font-bold text-white tracking-wide">go4.video</h1>
+              <h1 className="text-2xl font-bold text-white tracking-wide">FOLX</h1>
             </Link>
           </div>
           
diff --git a/client/src/components/thumbnail-generator.tsx b/client/src/components/thumbnail-generator.tsx
index 42ccd9c..dbaa18e 100644
--- a/client/src/components/thumbnail-generator.tsx
+++ b/client/src/components/thumbnail-generator.tsx
@@ -275,7 +275,7 @@ export default function ThumbnailGenerator({
                       <div className="w-12 h-12 gradient-primary rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-3 mx-auto">
                         <div className="w-0 h-0 border-l-[9px] border-l-white border-y-[7px] border-y-transparent ml-1"></div>
                       </div>
-                      <div className="text-white text-sm">go4.video</div>
+                      <div className="text-white text-sm">video.folx.tv</div>
                     </div>
                   </div>
                 )}
diff --git a/client/src/components/vast-player.tsx b/client/src/components/vast-player.tsx
index b5f0b9f..0464b86 100644
--- a/client/src/components/vast-player.tsx
+++ b/client/src/components/vast-player.tsx
@@ -77,7 +77,7 @@ export default function VASTPlayer({ video, onClose, vastTagUrl, enableAds = tru
   }, [video, enableAds]);
 
   const initializeVASTSystem = async () => {
-    console.log("🎯 Initializing VAST Ad System for go4.video");
+    console.log("🎯 Initializing VAST Ad System for video.folx.tv");
     
     // Waterfall approach - try ad networks in priority order
     const networks = Object.entries(AD_NETWORKS).sort((a, b) => a[1].priority - b[1].priority);
diff --git a/client/src/components/video-ads.tsx b/client/src/components/video-ads.tsx
index 6e7e51e..854fb10 100644
--- a/client/src/components/video-ads.tsx
+++ b/client/src/components/video-ads.tsx
@@ -31,7 +31,7 @@ export default function VideoAds({ videoId }: VideoAdsProps) {
           <div className="w-10 h-10 gradient-primary rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-3 mx-auto">
             <div className="w-0 h-0 border-l-[8px] border-l-white border-y-[6px] border-y-transparent ml-1"></div>
           </div>
-          <div className="text-white text-sm font-medium mb-1">go4.video</div>
+          <div className="text-white text-sm font-medium mb-1">video.folx.tv</div>
           <div className="text-gray-400 text-xs">Loading ads...</div>
         </div>
       </Card>
diff --git a/client/src/components/video-card.tsx b/client/src/components/video-card.tsx
index 8f1637c..8eeaf9a 100644
--- a/client/src/components/video-card.tsx
+++ b/client/src/components/video-card.tsx
@@ -328,7 +328,7 @@ export default function VideoCard({ video, onClick, className = "", hideOverlay
           <div className="absolute inset-0 bg-gradient-to-t from-black/90 via-black/20 to-transparent z-10 flex items-end p-4 group-hover:from-black/95 transition-all duration-300">
             <div className="w-full">
               <h3 className={`text-white font-extrabold leading-tight drop-shadow-2xl tracking-wide transform group-hover:scale-105 transition-transform duration-300 mb-1 ${isMobile ? 'text-2xl' : 'text-xl'}`} style={{fontFamily: 'Poppins, Inter, sans-serif', textShadow: '2px 2px 8px rgba(0,0,0,0.8)'}}>
-                {(video.title.split(' - ')[0] || 'go4.video').substring(0, 35)}
+                {(video.title.split(' - ')[0] || 'video.folx.tv').substring(0, 35)}
               </h3>
               <p className={`text-white/85 font-medium drop-shadow-xl transform group-hover:scale-105 transition-transform duration-300 ${isMobile ? 'text-base' : 'text-sm'}`} style={{fontFamily: 'Inter, sans-serif', textShadow: '1px 1px 4px rgba(0,0,0,0.8)'}}>
                 {(video.title.split(' - ')[1] || video.title).substring(0, 50)}
diff --git a/client/src/components/video-grid.tsx b/client/src/components/video-grid.tsx
index 555273f..a5c4ed3 100644
--- a/client/src/components/video-grid.tsx
+++ b/client/src/components/video-grid.tsx
@@ -39,7 +39,7 @@ export default function VideoGrid({ videos, isLoading, hasMore, onLoadMore, view
           <div className="w-16 h-16 gradient-primary rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-4 mx-auto">
             <div className="w-0 h-0 border-l-[12px] border-l-white border-y-[9px] border-y-transparent ml-1"></div>
           </div>
-          <h3 className="text-white text-xl font-bold mb-2">go4.video</h3>
+          <h3 className="text-white text-xl font-bold mb-2">video.folx.tv</h3>
           <p className="text-bunny-light">Loading videos...</p>
         </div>
       </div>
diff --git a/client/src/components/video-modal.tsx b/client/src/components/video-modal.tsx
index a4130ac..ff2295c 100644
--- a/client/src/components/video-modal.tsx
+++ b/client/src/components/video-modal.tsx
@@ -594,7 +594,7 @@ export default function VideoModal({ video, isOpen, onClose, enableAds = true }:
                         
                         <div
                           onClick={() => {
-                            window.open(`https://twitter.com/intent/tweet?url=${encodeURIComponent(getShareUrl())}&text=${encodeURIComponent(`Watch "${video.title}" on go4.video`)}`, '_blank', 'width=600,height=400');
+                            window.open(`https://twitter.com/intent/tweet?url=${encodeURIComponent(getShareUrl())}&text=${encodeURIComponent(`Watch "${video.title}" on video.folx.tv`)}`, '_blank', 'width=600,height=400');
                             setShowShareMenu(false);
                           }}
                           className="flex items-center gap-2 p-2 w-full hover:bg-gray-100 dark:hover:bg-gray-700 rounded cursor-pointer"
@@ -605,7 +605,7 @@ export default function VideoModal({ video, isOpen, onClose, enableAds = true }:
                         
                         <div
                           onClick={() => {
-                            window.open(`https://wa.me/?text=${encodeURIComponent(`Watch "${video.title}" on go4.video: ${getShareUrl()}`)}`, '_blank');
+                            window.open(`https://wa.me/?text=${encodeURIComponent(`Watch "${video.title}" on video.folx.tv: ${getShareUrl()}`)}`, '_blank');
                             setShowShareMenu(false);
                           }}
                           className="flex items-center gap-2 p-2 w-full hover:bg-gray-100 dark:hover:bg-gray-700 rounded cursor-pointer"
diff --git a/client/src/index.css b/client/src/index.css
index a68ad80..93222e3 100644
--- a/client/src/index.css
+++ b/client/src/index.css
@@ -232,6 +232,31 @@
   .video-js .vjs-menu li:hover {
     background: rgba(236, 76, 115, 0.6) !important;
   }
+
+  /* Video.js Loading Animation */
+  .video-js .vjs-loading-spinner {
+    border-color: rgba(236, 76, 115, 0.3) rgba(236, 76, 115, 0.3) rgba(236, 76, 115, 0.3) #ec4c73 !important;
+  }
+
+  .video-js .vjs-loading-spinner:before,
+  .video-js .vjs-loading-spinner:after {
+    border-color: rgba(236, 76, 115, 0.3) rgba(236, 76, 115, 0.3) rgba(236, 76, 115, 0.3) #ec4c73 !important;
+  }
+
+  /* Custom buffering spinner */
+  .video-buffering-spinner {
+    border: 2px solid rgba(236, 76, 115, 0.3);
+    border-radius: 50%;
+    border-top: 2px solid #ec4c73;
+    width: 16px;
+    height: 16px;
+    animation: spin 1s linear infinite;
+  }
+
+  @keyframes spin {
+    0% { transform: rotate(0deg); }
+    100% { transform: rotate(360deg); }
+  }
 }
 
 /* Video edit modal styles */
diff --git a/client/src/pages/VideoPage.tsx b/client/src/pages/VideoPage.tsx
index 14e4cf2..f9c6203 100644
--- a/client/src/pages/VideoPage.tsx
+++ b/client/src/pages/VideoPage.tsx
@@ -168,14 +168,14 @@ export default function VideoPage() {
   useEffect(() => {
     if (currentVideo) {
       // Update page title
-      document.title = `${currentVideo.title} | go4.video`;
+      document.title = `${currentVideo.title} | video.folx.tv`;
       
       // Update meta description with original or rich content
       const metaDescription = document.querySelector('meta[name="description"]');
       if (metaDescription) {
         const descriptionContent = currentVideo.description && currentVideo.description.trim() !== '' 
           ? currentVideo.description 
-          : `${currentVideo.title} - Professionelle Video-Streaming-Plattform mit exklusivem Content von FOLX STADL, Geschichte des Liedes und weiteren Premium-Inhalten auf go4.video.`;
+          : `${currentVideo.title} - Professionelle Video-Streaming-Plattform mit exklusivem Content von FOLX STADL, Geschichte des Liedes und weiteren Premium-Inhalten auf video.folx.tv.`;
         metaDescription.setAttribute('content', descriptionContent);
       }
       
@@ -195,7 +195,7 @@ export default function VideoPage() {
       // Use original description if available, otherwise create rich description
       const richDescription = currentVideo.description && currentVideo.description.trim() !== '' 
         ? currentVideo.description 
-        : `${currentVideo.title} - Professionelle Video-Streaming-Plattform mit exklusivem Content von FOLX STADL, Geschichte des Liedes und weiteren Premium-Inhalten auf go4.video.`;
+        : `${currentVideo.title} - Professionelle Video-Streaming-Plattform mit exklusivem Content von FOLX STADL, Geschichte des Liedes und weiteren Premium-Inhalten auf video.folx.tv.`;
       
       updateMetaTag('og:description', richDescription);
       // For social media, use direct Bunny.net thumbnail if available, otherwise fallback to our endpoint
@@ -210,11 +210,11 @@ export default function VideoPage() {
       updateMetaTag('og:image:width', '1200');
       updateMetaTag('og:image:height', '630');
       updateMetaTag('og:image:type', 'image/png');
-      updateMetaTag('og:image:alt', `${currentVideo.title} - go4.video`);
+      updateMetaTag('og:image:alt', `${currentVideo.title} - video.folx.tv`);
       updateMetaTag('og:url', window.location.href);
       updateMetaTag('og:type', 'video.other');
       updateMetaTag('og:video:duration', currentVideo.duration.toString());
-      updateMetaTag('og:site_name', 'go4.video');
+      updateMetaTag('og:site_name', 'video.folx.tv');
       updateMetaTag('og:locale', 'de_DE');
       
       // Update Twitter Card tags  
@@ -232,7 +232,7 @@ export default function VideoPage() {
       updateTwitterTag('twitter:title', currentVideo.title);
       updateTwitterTag('twitter:description', richDescription);
       updateTwitterTag('twitter:image', socialThumbnail);
-      updateTwitterTag('twitter:image:alt', `${currentVideo.title} - go4.video`);
+      updateTwitterTag('twitter:image:alt', `${currentVideo.title} - video.folx.tv`);
       updateTwitterTag('twitter:site', '@go4video');
     }
   }, [currentVideo]);
@@ -309,7 +309,7 @@ export default function VideoPage() {
           <div className="w-16 h-16 gradient-primary rounded-lg flex items-center justify-center shadow-lg animate-pulse mb-4 mx-auto">
             <div className="w-0 h-0 border-l-[12px] border-l-white border-y-[9px] border-y-transparent ml-1"></div>
           </div>
-          <h3 className="text-white text-xl font-bold mb-2">go4.video</h3>
+          <h3 className="text-white text-xl font-bold mb-2">video.folx.tv</h3>
           <p className="text-bunny-light">Loading video...</p>
         </div>
       </div>
@@ -323,7 +323,7 @@ export default function VideoPage() {
           <div className="w-12 h-12 gradient-primary rounded-lg flex items-center justify-center shadow-lg mb-4 mx-auto opacity-50">
             <div className="w-0 h-0 border-l-[9px] border-l-white border-y-[7px] border-y-transparent ml-1"></div>
           </div>
-          <h3 className="text-white text-lg font-bold mb-2">go4.video</h3>
+          <h3 className="text-white text-lg font-bold mb-2">video.folx.tv</h3>
           <p className="text-bunny-light">Video not found</p>
         </div>
       </div>
@@ -342,7 +342,7 @@ export default function VideoPage() {
                 <div className="w-10 h-10 gradient-primary rounded-lg flex items-center justify-center shadow-lg">
                   <div className="w-0 h-0 border-l-[11px] border-l-white border-y-[8px] border-y-transparent ml-1"></div>
                 </div>
-                <h1 className="text-2xl font-bold text-white tracking-wide">go4.video</h1>
+                <h1 className="text-2xl font-bold text-white tracking-wide">video.folx.tv</h1>
               </Link>
             </div>
 
@@ -692,13 +692,13 @@ export default function VideoPage() {
                           Facebook
                         </div>
                       </FacebookShareButton>
-                      <TwitterShareButton url={getShareUrl()} title={`Watch "${currentVideo.title}" on go4.video`}>
+                      <TwitterShareButton url={getShareUrl()} title={`Watch "${currentVideo.title}" on video.folx.tv`}>
                         <div className="w-full px-4 py-2 text-left text-white hover:bg-gray-700 flex items-center gap-2 cursor-pointer">
                           <TwitterIcon size={16} round />
                           Twitter
                         </div>
                       </TwitterShareButton>
-                      <WhatsappShareButton url={getShareUrl()} title={`Watch "${currentVideo.title}" on go4.video`}>
+                      <WhatsappShareButton url={getShareUrl()} title={`Watch "${currentVideo.title}" on video.folx.tv`}>
                         <div className="w-full px-4 py-2 text-left text-white hover:bg-gray-700 flex items-center gap-2 cursor-pointer">
                           <WhatsappIcon size={16} round />
                           WhatsApp
@@ -807,7 +807,7 @@ export default function VideoPage() {
               <div className="w-8 h-8 gradient-primary rounded-lg flex items-center justify-center shadow-md">
                 <div className="w-0 h-0 border-l-[8px] border-l-white border-y-[6px] border-y-transparent ml-0.5"></div>
               </div>
-              <span className="text-lg font-semibold text-white">go4.video</span>
+              <span className="text-lg font-semibold text-white">video.folx.tv</span>
             </div>
             
             {/* Legal Links */}
@@ -825,7 +825,7 @@ export default function VideoPage() {
             
             {/* Copyright */}
             <div className="text-sm text-bunny-muted text-center">
-              © 2025 go4.video. Alle Rechte vorbehalten.
+              © 2025 video.folx.tv. Alle Rechte vorbehalten.
             </div>
           </div>
         </div>