diff --git a/.replit b/.replit index 9eb5d4c..2d8a3dc 100644 --- a/.replit +++ b/.replit @@ -40,4 +40,4 @@ args = "npm run dev" waitForPort = 5000 [agent] -integrations = ["javascript_google_analytics==1.0.0", "javascript_database==1.0.0"] +integrations = ["javascript_database==1.0.0", "javascript_google_analytics==1.0.0"] diff --git a/attached_assets/image_1756931997437.png b/attached_assets/image_1756931997437.png new file mode 100644 index 0000000..f1855c8 Binary files /dev/null and b/attached_assets/image_1756931997437.png differ diff --git a/client/index.html b/client/index.html index 14cae20..eba3569 100644 --- a/client/index.html +++ b/client/index.html @@ -4,6 +4,20 @@ go4.video – Top-Inhalte von Folx TV + + + + + diff --git a/client/src/App.tsx b/client/src/App.tsx index b8fa942..bb71947 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -3,6 +3,7 @@ import { queryClient } from "./lib/queryClient"; import { QueryClientProvider } from "@tanstack/react-query"; import { Toaster } from "@/components/ui/toaster"; import { TooltipProvider } from "@/components/ui/tooltip"; +import CookieConsent from "@/components/CookieConsent"; import Home from "@/pages/home"; import VideoPage from "@/pages/VideoPage"; import FolxStadlPage from "@/pages/FolxStadlPage"; @@ -36,6 +37,7 @@ function App() { + diff --git a/client/src/components/CookieConsent.tsx b/client/src/components/CookieConsent.tsx new file mode 100644 index 0000000..9ac9165 --- /dev/null +++ b/client/src/components/CookieConsent.tsx @@ -0,0 +1,242 @@ +import { useState, useEffect } from 'react'; +import { Button } from '@/components/ui/button'; +import { X } from 'lucide-react'; + +interface ConsentState { + necessary: boolean; + analytics: boolean; + advertising: boolean; +} + +export default function CookieConsent() { + const [showBanner, setShowBanner] = useState(false); + const [showDetails, setShowDetails] = useState(false); + const [consent, setConsent] = useState({ + necessary: true, + analytics: false, + advertising: false + }); + + useEffect(() => { + // Check if user has already made a choice + const hasConsented = localStorage.getItem('cookie_consent'); + if (!hasConsented) { + setShowBanner(true); + } else { + // Load existing consent + const savedConsent = JSON.parse(hasConsented); + setConsent(savedConsent); + updateGoogleConsent(savedConsent); + } + }, []); + + const updateGoogleConsent = (consentState: ConsentState) => { + if (window.gtag) { + window.gtag('consent', 'update', { + 'ad_storage': consentState.advertising ? 'granted' : 'denied', + 'analytics_storage': consentState.analytics ? 'granted' : 'denied', + 'ad_user_data': consentState.advertising ? 'granted' : 'denied', + 'ad_personalization': consentState.advertising ? 'granted' : 'denied' + }); + } + }; + + const handleAcceptAll = () => { + const newConsent = { + necessary: true, + analytics: true, + advertising: true + }; + + setConsent(newConsent); + updateGoogleConsent(newConsent); + localStorage.setItem('cookie_consent', JSON.stringify(newConsent)); + setShowBanner(false); + setShowDetails(false); + }; + + const handleRejectAll = () => { + const newConsent = { + necessary: true, + analytics: false, + advertising: false + }; + + setConsent(newConsent); + updateGoogleConsent(newConsent); + localStorage.setItem('cookie_consent', JSON.stringify(newConsent)); + setShowBanner(false); + setShowDetails(false); + }; + + const handleSavePreferences = () => { + updateGoogleConsent(consent); + localStorage.setItem('cookie_consent', JSON.stringify(consent)); + setShowBanner(false); + setShowDetails(false); + }; + + const handleConsentChange = (key: keyof ConsentState, value: boolean) => { + if (key === 'necessary') return; // Cannot disable necessary cookies + setConsent(prev => ({ ...prev, [key]: value })); + }; + + if (!showBanner) return null; + + return ( +
+
+
+ {!showDetails ? ( + // Simple banner +
+
+
+
+
+
+

Cookie-Einstellungen

+
+ +
+ +

+ Wir verwenden Cookies und ähnliche Technologien, um unsere Website zu verbessern, + Inhalte zu personalisieren und Werbung zu schalten. Durch das Fortsetzen der Nutzung + unserer Website stimmen Sie der Verwendung von Cookies zu. +

+ +
+ + + +
+
+ ) : ( + // Detailed settings +
+
+

Cookie-Einstellungen

+ +
+ +
+ {/* Necessary Cookies */} +
+
+

Notwendige Cookies

+
+ Immer aktiv +
+
+

+ Diese Cookies sind für das Funktionieren der Website erforderlich und können + in unseren Systemen nicht deaktiviert werden. +

+
+ + {/* Analytics Cookies */} +
+
+

Analyse-Cookies

+ +
+

+ Diese Cookies ermöglichen es uns, Besuche und Verkehrsquellen zu zählen, + damit wir die Leistung unserer Website messen und verbessern können. +

+
+ + {/* Advertising Cookies */} +
+
+

Werbe-Cookies

+ +
+

+ Diese Cookies werden von Werbepartnern über unsere Website gesetzt. Sie können + verwendet werden, um ein Profil Ihrer Interessen zu erstellen und relevante + Werbung auf anderen Websites zu zeigen. +

+
+
+ +
+ + + +
+
+ )} +
+
+
+ ); +} + +// Global declaration for gtag +declare global { + interface Window { + gtag: (...args: any[]) => void; + } +} \ No newline at end of file