From 7590f5618569372d5f9ec967294ea79524581c09 Mon Sep 17 00:00:00 2001
From: bernardhanna <bernard@matrixinternet.ie>
Date: Wed, 3 Sep 2025 16:02:04 +0100
Subject: [PATCH 1/2] cookiescript declaration

---
 resources/views/static/cookie.blade.php | 339 ++++++++++++++++++------
 1 file changed, 255 insertions(+), 84 deletions(-)

diff --git a/resources/views/static/cookie.blade.php b/resources/views/static/cookie.blade.php
index 9c32250c7..3e7329d73 100644
--- a/resources/views/static/cookie.blade.php
+++ b/resources/views/static/cookie.blade.php
@@ -8,19 +8,26 @@
     a {
       color: #1C4DA1 !important;
       font-weight: 600 !important;
+      text-decoration: underline;
     }
     p {
       padding: 0 !important;
+      margin-bottom: 1rem;
+    }
+    
+    strong {
+      font-weight: 700;
     }
     
     table {
       border-radius: 16px;
       border-collapse: separate;
+      margin: 2rem 0;
       
       thead tr th {
-        background-color: #410098;
+        background-color: #f95c22;
         color: #fff;
-        font-size: 20px;
+        font-size: 18px;
         font-weight: 600;
         padding: 16px 24px;
         
@@ -34,30 +41,30 @@
       
       tbody tr {
         td {
-          font-size: 18px;
+          font-size: 16px;
           padding: 16px 24px;
-          border-bottom: 2px solid #B399D6;
-          border-left: 2px solid #B399D6;
-          border-right: 2px solid #B399D6;
+          border: 2px solid #f95c22;
+          border-top: 0;
+          opacity: 0.8;
           
-          &:first-child {
-            border-left: 2px solid #B399D6;
+          &:not(:last-child) {
+            border-right: 0;
           }
-          &:last-child {
-            border-right: 2px solid #B399D6;
+          &:not(:first-child) {
+            border-left: 0;
           }
         }
         
-        &:nth-child(even) td {
-          background-color: #F5F2FA;
+        &:first-child td {
+          border-top: 2px solid #f95c22;
+          opacity: 0.8;
         }
         
-        &:first-child td {
-          border-top: 2px solid #B399D6;
+        &:nth-child(even) td {
+          background-color: #FFF5F2;
         }
         
         &:last-child td {
-          border-bottom: 2px solid #B399D6;
           &:first-child {
             border-bottom-left-radius: 16px;
           }
@@ -67,6 +74,30 @@
         }
       }
     }
+    
+    h3 {
+      color: #000;
+      font-weight: 700;
+      font-size: 1.5rem;
+      margin: 2rem 0 1rem 0;
+    }
+    
+    h4 {
+      color: #000;
+      font-weight: 600;
+      font-size: 1.25rem;
+      margin: 1.5rem 0 1rem 0;
+    }
+    
+    ul {
+      list-style: disc;
+      margin-left: 2rem;
+      margin-bottom: 1rem;
+      
+      li {
+        margin-bottom: 0.5rem;
+      }
+    }
   }
 </style>
 
@@ -85,94 +116,234 @@
         </section>
 
         <section class="bg-white codeweek-container-lg py-10 tablet:py-20 font-[Blinker]">
-            <!-- Cookie Declaration Container -->
             <div class="cookie-content text-[16px] md:text-xl">
-                <div id="cookie-report">
-                    <div class="py-8 text-center">
-                        <div class="inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-[#410098]"></div>
-                        <p class="mt-4 text-gray-600">Loading cookie information...</p>
+                
+                <!-- What are cookies section -->
+                <div class="mb-10">
+                    <h3>@lang('cookie_policy.what.title')</h3>
+                    {!! __('cookie_policy.what.text') !!}
+                    <p>{!! __('cookie_policy.what.first_party') !!}</p>
+                    <p>{{ __('cookie_policy.what.persistent_cookies') }}</p>
+                    {!! __('cookie_policy.what.items') !!}
+                </div>
+
+                <!-- How do we use cookies section -->
+                <div class="mb-10">
+                    <h3>@lang('cookie_policy.how.title')</h3>
+                    {!! __('cookie_policy.how.text1') !!}
+                    {!! __('cookie_policy.how.text2') !!}
+                    
+                    <h4>@lang('cookie_policy.how.3types.title')</h4>
+                    <ul>
+                        <li>@lang('cookie_policy.how.3types.1')</li>
+                        <li>@lang('cookie_policy.how.3types.2')</li>
+                        <li>@lang('cookie_policy.how.3types.3')</li>
+                    </ul>
+                </div>
+
+                <!-- Dynamic Cookie Tables -->
+                <div id="cookie-tables">
+                    <!-- Visitor Preferences -->
+                    <div class="mb-10">
+                        <h4>@lang('cookie_policy.how.visitor_preferences.title')</h4>
+                        {!! __('cookie_policy.how.visitor_preferences.text') !!}
+                        <ul>
+                            <li>@lang('cookie_policy.how.visitor_preferences.item')</li>
+                        </ul>
+                        
+                        <table class="w-full">
+                            <thead>
+                                <tr>
+                                    <th>@lang('cookie_policy.how.table.name')</th>
+                                    <th>@lang('cookie_policy.how.table.service')</th>
+                                    <th>@lang('cookie_policy.how.table.purpose')</th>
+                                    <th>@lang('cookie_policy.how.table.type_duration')</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>CookieScriptConsent</td>
+                                    <td>@lang('cookie_policy.how.visitor_preferences.table.1.service')</td>
+                                    <td>@lang('cookie_policy.how.visitor_preferences.table.1.purpose')</td>
+                                    <td>@lang('cookie_policy.how.visitor_preferences.table.1.type_duration')</td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+
+                    <!-- Operational/Technical Cookies -->
+                    <div class="mb-10">
+                        <h4>@lang('cookie_policy.how.operational_cookies.title')</h4>
+                        {!! __('cookie_policy.how.operational_cookies.text') !!}
+                        <ul>
+                            <li>@lang('cookie_policy.how.operational_cookies.item')</li>
+                        </ul>
+
+                        <h4>@lang('cookie_policy.how.technical_cookies.title')</h4>
+                        <table class="w-full">
+                            <thead>
+                                <tr>
+                                    <th>@lang('cookie_policy.how.table.name')</th>
+                                    <th>@lang('cookie_policy.how.table.purpose')</th>
+                                    <th>@lang('cookie_policy.how.table.type_duration')</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>XSRF-TOKEN</td>
+                                    <td>@lang('cookie_policy.how.technical_cookies.table.1.purpose')</td>
+                                    <td>@lang('cookie_policy.how.technical_cookies.table.1.type_duration')</td>
+                                </tr>
+                                <tr>
+                                    <td>laravel_session</td>
+                                    <td>@lang('cookie_policy.how.technical_cookies.table.2.purpose')</td>
+                                    <td>@lang('cookie_policy.how.technical_cookies.table.2.type_duration')</td>
+                                </tr>
+                                <tr>
+                                    <td>locale</td>
+                                    <td>@lang('cookie_policy.how.technical_cookies.table.3.purpose')</td>
+                                    <td>@lang('cookie_policy.how.technical_cookies.table.3.type_duration')</td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+
+                    <!-- Analytics Cookies -->
+                    <div class="mb-10">
+                        <h4>@lang('cookie_policy.how.analytics_cookies.title')</h4>
+                        {!! __('cookie_policy.how.analytics_cookies.items') !!}
+                        
+                        <table class="w-full">
+                            <thead>
+                                <tr>
+                                    <th>@lang('cookie_policy.how.table.name')</th>
+                                    <th>@lang('cookie_policy.how.table.service')</th>
+                                    <th>@lang('cookie_policy.how.table.purpose')</th>
+                                    <th>@lang('cookie_policy.how.table.type_duration')</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>_pk_id</td>
+                                    <td>@lang('cookie_policy.how.analytics_cookies.table.1.service')</td>
+                                    <td>@lang('cookie_policy.how.analytics_cookies.table.1.purpose')</td>
+                                    <td>@lang('cookie_policy.how.analytics_cookies.table.1.type_duration')</td>
+                                </tr>
+                                <tr>
+                                    <td>_pk_ses</td>
+                                    <td>@lang('cookie_policy.how.analytics_cookies.table.2.service')</td>
+                                    <td>@lang('cookie_policy.how.analytics_cookies.table.2.purpose')</td>
+                                    <td>@lang('cookie_policy.how.analytics_cookies.table.2.type_duration')</td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+
+                    <!-- Third Party Cookies -->
+                    <div class="mb-10">
+                        <h3>@lang('cookie_policy.third-party.title')</h3>
+                        {!! __('cookie_policy.third-party.items.1') !!}
+                        <p>{{ __('cookie_policy.third-party.items.2') }}</p>
+                        
+                        <table class="w-full">
+                            <thead>
+                                <tr>
+                                    <th>Provider</th>
+                                    <th>@lang('cookie_policy.how.table.purpose')</th>
+                                    <th>Privacy Policy</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>Facebook</td>
+                                    <td>Social media integration and advertising</td>
+                                    <td><a href="https://www.facebook.com/policies/cookies/" target="_blank" rel="noopener">View Policy</a></td>
+                                </tr>
+                                <tr>
+                                    <td>Twitter</td>
+                                    <td>Social media integration</td>
+                                    <td><a href="https://help.twitter.com/en/rules-and-policies/twitter-cookies" target="_blank" rel="noopener">View Policy</a></td>
+                                </tr>
+                                <tr>
+                                    <td>YouTube</td>
+                                    <td>Video content delivery</td>
+                                    <td><a href="https://policies.google.com/privacy" target="_blank" rel="noopener">View Policy</a></td>
+                                </tr>
+                            </tbody>
+                        </table>
                     </div>
                 </div>
-                
+
+                <!-- How to manage cookies -->
+                <div class="mb-10">
+                    <h3>@lang('cookie_policy.how-manage.title')</h3>
+                    {!! __('cookie_policy.how-manage.items') !!}
+                </div>
+
+                <!-- Current Consent Status (Dynamic) -->
+                <div class="p-6 mb-10 bg-gray-50 rounded-lg border-2 border-gray-200">
+                    <h3>Your Current Cookie Preferences</h3>
+                    <div id="consent-status">
+                        <p class="text-gray-600">Loading your preferences...</p>
+                    </div>
+                </div>
+
                 <!-- Manage Preferences Button -->
                 <div class="mt-8 text-center">
                     <button onclick="if(typeof CookieScript !== 'undefined') { CookieScript.instance.show(); } return false;" 
-                            class="bg-[#410098] text-white px-8 py-4 rounded-lg hover:bg-[#5A00D6] transition font-semibold text-lg">
+                            class="bg-[#f95c22] text-white px-8 py-4 rounded-lg hover:bg-[#e54c12] transition font-semibold text-lg">
                         Manage Cookie Preferences
                     </button>
                 </div>
-            </div> <!-- Fixed: This closing div was missing -->
+            </div>
         </section>
     </section>
 @endsection
 
 @push('scripts')
-<!-- Try the CookieScript Report Widget first -->
-<script type="text/javascript" charset="UTF-8" 
-        src="//report.cookie-script.com/r/829a8b1800ff61ff631790bc732f7a67.js">
-</script>
-
-<!-- Fallback to dynamic generation if widget doesn't work -->
 <script>
 document.addEventListener('DOMContentLoaded', function() {
-    setTimeout(function() {
-        // Check if report widget loaded
-        const reportContainer = document.getElementById('cookie-report');
-        if (reportContainer && reportContainer.innerHTML.includes('Loading')) {
-            // Widget didn't load, use dynamic generation
-            generateStaticReport();
-        }
-    }, 3000);
-    
-    function generateStaticReport() {
-        const reportContainer = document.getElementById('cookie-report');
-        
-        let html = '<div class="cookie-declaration">';
-        html += '<p class="mb-6 text-lg">This website uses cookies to enhance your browsing experience. Below you can see what cookies we use.</p>';
-        
-        // Cookie tables
-        const cookieData = {
-            'Strictly Necessary Cookies': [
-                { name: 'CookieScriptConsent', purpose: 'Stores your cookie preferences', duration: '1 year' },
-                { name: 'XSRF-TOKEN', purpose: 'Security token to prevent cross-site attacks', duration: 'Session' },
-                { name: 'laravel_session', purpose: 'Website functionality and session management', duration: 'Session' }
-            ],
-            'Performance/Statistics Cookies': [
-                { name: '_pk_id.*', purpose: 'Matomo - Distinguishes website visitors', duration: '13 months' },
-                { name: '_pk_ses.*', purpose: 'Matomo - Tracks page requests from the same visit', duration: '30 minutes' },
-                { name: '_pk_ref.*', purpose: 'Matomo - Stores referrer information', duration: '6 months' }
-            ],
-            'Marketing/Targeting Cookies': [
-                { name: '_fbp', purpose: 'Facebook - Tracks visits across websites', duration: '3 months' },
-                { name: 'fr', purpose: 'Facebook - Enables ad delivery', duration: '3 months' }
-            ]
-        };
+    // Check for CookieScript and display current consent status
+    function checkConsent() {
+        const statusDiv = document.getElementById('consent-status');
         
-        for (const [category, cookies] of Object.entries(cookieData)) {
-            html += `<div class="mb-10">`;
-            html += `<h3 class="font-bold text-2xl mb-4 text-[#410098]">${category}</h3>`;
-            html += '<div class="overflow-x-auto">';
-            html += '<table class="w-full min-w-[600px]">';
-            html += '<thead><tr>';
-            html += '<th class="text-left">Cookie Name</th>';
-            html += '<th class="text-left">Purpose</th>';
-            html += '<th class="text-left">Duration</th>';
-            html += '</tr></thead><tbody>';
-            
-            cookies.forEach((cookie) => {
-                html += `<tr>`;
-                html += `<td>${cookie.name}</td>`;
-                html += `<td>${cookie.purpose}</td>`;
-                html += `<td>${cookie.duration}</td>`;
-                html += '</tr>';
-            });
-            
-            html += '</tbody></table></div></div>';
+        if (typeof CookieScript !== 'undefined' && CookieScript.instance) {
+            try {
+                const categories = CookieScript.instance.currentState();
+                let html = '<div class="grid grid-cols-1 gap-4 md:grid-cols-2">';
+                
+                const categoryNames = {
+                    'strict': 'Strictly Necessary',
+                    'necessary': 'Strictly Necessary',
+                    'performance': 'Performance/Statistics',
+                    'statistics': 'Performance/Statistics',
+                    'targeting': 'Marketing/Targeting',
+                    'marketing': 'Marketing/Targeting',
+                    'functionality': 'Functionality',
+                    'preferences': 'Preferences'
+                };
+                
+                for (const [key, value] of Object.entries(categories)) {
+                    if (categoryNames[key]) {
+                        const status = value ? '✅ Accepted' : '❌ Rejected';
+                        html += `<div class="flex justify-between items-center p-3 bg-white rounded border">`;
+                        html += `<span>${categoryNames[key]}:</span>`;
+                        html += `<span class="font-semibold">${status}</span>`;
+                        html += `</div>`;
+                    }
+                }
+                
+                html += '</div>';
+                statusDiv.innerHTML = html;
+            } catch (error) {
+                statusDiv.innerHTML = '<p>Click "Manage Cookie Preferences" below to view and change your settings.</p>';
+            }
+        } else {
+            setTimeout(checkConsent, 500);
         }
-        
-        html += '</div>';
-        reportContainer.innerHTML = html;
     }
+    
+    checkConsent();
 });
 </script>
 @endpush
\ No newline at end of file

From b27a3ddc33b768c2fc68e899e093db44e9731141 Mon Sep 17 00:00:00 2001
From: bernardhanna <bernard@matrixinternet.ie>
Date: Wed, 3 Sep 2025 16:05:05 +0100
Subject: [PATCH 2/2] youtubve gdpr improve

---
 resources/views/layout/video-player.blade.php | 71 ++++++++++++++++---
 1 file changed, 61 insertions(+), 10 deletions(-)

diff --git a/resources/views/layout/video-player.blade.php b/resources/views/layout/video-player.blade.php
index d714ee620..4d552bcea 100644
--- a/resources/views/layout/video-player.blade.php
+++ b/resources/views/layout/video-player.blade.php
@@ -1,7 +1,7 @@
 <div>
     <button id="video-modal-trigger-show" data-targetId="video-modal-{{ $id }}"
-        class="bg-yellow hover:bg-primary rounded-full w-20 h-20 duration-300 flex justify-center items-center">
-        <img class="duration-300 ml-2" src="/images/fi_play.svg" />
+        class="flex justify-center items-center w-20 h-20 rounded-full duration-300 bg-yellow hover:bg-primary">
+        <img class="ml-2 duration-300" src="/images/fi_play.svg" />
     </button>
 
     @if ($src)
@@ -9,25 +9,76 @@ class="bg-yellow hover:bg-primary rounded-full w-20 h-20 duration-300 flex justi
             <div id="video-modal-{{ $id }}"
                 class="fixed left-0 top-[139px] md:top-[123px] z-[110] flex flex-col gap-6 items-center justify-center w-full p-6 h-[calc(100dvh-139px)] md:h-[calc(100dvh-123px)] bg-white duration-300 overflow-hidden"
                 style="display: none;">
-                <div class="flex-shrink-0 flex justify-end w-full">
+                <div class="flex flex-shrink-0 justify-end w-full">
                     <button id="video-modal-trigger-hide" data-targetId="video-modal-{{ $id }}"
                         class="block bg-[#FFD700] hover:bg-[#F95C22] rounded-full p-4 duration-300">
                         <img class="w-6 h-6" src="/images/close_menu_icon.svg">
                     </button>
                 </div>
-                <div class="flex-grow flex-shrink flex flex-col justify-center max-h-full w-full overflow-hidden">
+                <div class="flex overflow-hidden flex-col flex-grow flex-shrink justify-center w-full max-h-full">
                     @if ($src && Str::contains($src, ['youtube.com', 'youtu.be']))
-                        <iframe id="youtube-video" class="w-full h-full" src="" data-src="{{ $src }}"
-                            frameborder="0"
-                            allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
-                            allowfullscreen></iframe>
+                        @php
+                            // Extract video ID and convert to privacy-enhanced URL
+                            preg_match('/(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([^"&?\/\s]{11})/', $src, $matches);
+                            $videoId = $matches[1] ?? '';
+                            $privacyEnhancedUrl = "https://www.youtube-nocookie.com/embed/{$videoId}";
+                        @endphp
+                        
+                        <div id="youtube-container-{{ $id }}" class="w-full h-full">
+                            <!-- Placeholder until consent -->
+                            <div class="flex flex-col justify-center items-center w-full h-full bg-gray-100 rounded-lg youtube-consent-placeholder">
+                                <img src="/images/youtube-logo.svg" class="mb-4 w-20 h-20 opacity-50" alt="YouTube">
+                                <p class="px-4 mb-4 text-center">This video is hosted on YouTube. Loading it will share data with Google.</p>
+                                <button onclick="loadYouTubeVideo('{{ $id }}', '{{ $privacyEnhancedUrl }}')" 
+                                        class="bg-[#f95c22] text-white px-6 py-3 rounded-lg hover:bg-[#e54c12] transition">
+                                    Load Video
+                                </button>
+                                <p class="mt-2 text-sm text-gray-600">or <a href="#" onclick="acceptMarketingAndLoad('{{ $id }}', '{{ $privacyEnhancedUrl }}'); return false;" class="underline">accept marketing cookies</a></p>
+                            </div>
+                            <!-- Iframe will be inserted here after consent -->
+                        </div>
                     @else
-                        <video id="video" class="max-h-full max-w-full" controls src="{{ $src }}">
+                        <video id="video" class="max-w-full max-h-full" controls src="{{ $src }}">
                             <source src="{{ $src }}" type="video/mp4">
                         </video>
                     @endif
                 </div>
             </div>
+
+            <script>
+                function loadYouTubeVideo(id, url) {
+                    const container = document.getElementById('youtube-container-' + id);
+                    container.innerHTML = `
+                        <iframe class="w-full h-full" 
+                                src="${url}?rel=0&modestbranding=1" 
+                                frameborder="0"
+                                allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+                                allowfullscreen></iframe>
+                    `;
+                }
+
+                function acceptMarketingAndLoad(id, url) {
+                    // Request marketing consent first
+                    if (typeof CookieScript !== 'undefined') {
+                        CookieScript.instance.acceptCategory('targeting');
+                        loadYouTubeVideo(id, url);
+                    } else {
+                        loadYouTubeVideo(id, url);
+                    }
+                }
+
+                // Auto-load if marketing cookies already accepted
+                document.addEventListener('DOMContentLoaded', function() {
+                    @if ($src && Str::contains($src, ['youtube.com', 'youtu.be']))
+                        if (typeof CookieScript !== 'undefined') {
+                            const state = CookieScript.instance.currentState();
+                            if (state.targeting || state.marketing) {
+                                loadYouTubeVideo('{{ $id }}', '{{ $privacyEnhancedUrl }}');
+                            }
+                        }
+                    @endif
+                });
+            </script>
         @endpush
     @endif
-</div>
+</div>
\ No newline at end of file