From 2f051adf6689e9bf1e0aec888599e5abf76445ee Mon Sep 17 00:00:00 2001
From: Venkata Chandra Sekhar Nainala <mailcs76@gmail.com>
Date: Thu, 15 Aug 2024 23:41:52 +0200
Subject: [PATCH] fix: added matomo scripts to layout pages

---
 resources/views/layouts/app.blade.php   | 121 ++++++++++++--------
 resources/views/layouts/guest.blade.php | 142 ++++++++++++++----------
 2 files changed, 156 insertions(+), 107 deletions(-)
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
index ef5c37e0..54bfea35 100644
--- a/resources/views/layouts/app.blade.php
+++ b/resources/views/layouts/app.blade.php
@@ -1,52 +1,75 @@
 <!DOCTYPE html>
 <html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
-    <head>
-        <meta charset="utf-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-        <meta name="csrf-token" content="{{ csrf_token() }}">
-
-        <title>{{ config('app.name', 'Laravel') }}</title>
-
-        <!-- Fonts -->
-        <link rel="preconnect" href="https://fonts.bunny.net">
-        <link href="https://fonts.bunny.net/css?family=figtree:400,500,600&display=swap" rel="stylesheet" />
-        <link rel="stylesheet" href="https://unpkg.com/tippy.js@6/dist/tippy.css" />
-        
-        <!-- Scripts -->
-        @vite(['resources/css/app.css', 'resources/js/app.js'])
-
-        <script src="https://cdn.jsdelivr.net/npm/jsme@2017.2.26/jsme/jsme.nocache.min.js"></script>
-
-        <link href="https://cdn.jsdelivr.net/npm/jsme@2017.2.26/jsme/jsa.min.css" rel="stylesheet">
-
-        <!-- Styles -->
-        @livewireStyles
-    </head>
-    <body class="font-sans antialiased">
-        <x-banner />
-        <x-impersonate::banner style='light'/>
-        <div class="min-h-screen bg-gray-100">
-            @livewire('navigation-menu')
-
-            <!-- Page Heading -->
-            @if (isset($header))
-                <header class="bg-white shadow">
-                    <div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
-                        {{ $header }}
-                    </div>
-                </header>
-            @endif
-
-            <!-- Page Content -->
-            <main>
-                {{ $slot }}
-            </main>
-        </div>
-        
-        @include('components.tawk-chat')
-
-        @stack('modals')
-        @livewireScripts
-        @include('cookie-consent::index')
-    </body>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="csrf-token" content="{{ csrf_token() }}">
+
+    <title>{{ config('app.name', 'Laravel') }}</title>
+
+    <!-- Fonts -->
+    <link rel="preconnect" href="https://fonts.bunny.net">
+    <link href="https://fonts.bunny.net/css?family=figtree:400,500,600&display=swap" rel="stylesheet" />
+    <link rel="stylesheet" href="https://unpkg.com/tippy.js@6/dist/tippy.css" />
+
+    <!-- Scripts -->
+    @vite(['resources/css/app.css', 'resources/js/app.js'])
+
+    <script src="https://cdn.jsdelivr.net/npm/jsme@2017.2.26/jsme/jsme.nocache.min.js"></script>
+
+    <!-- Matomo -->
+    <script>
+        var _paq = window._paq = window._paq || [];
+        /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+        _paq.push(['trackPageView']);
+        _paq.push(['enableLinkTracking']);
+        (function() {
+            var u = "//matomo.nfdi4chem.de/";
+            _paq.push(['setTrackerUrl', u + 'matomo.php']);
+            _paq.push(['setSiteId', '3']);
+            var d = document,
+                g = d.createElement('script'),
+                s = d.getElementsByTagName('script')[0];
+            g.async = true;
+            g.src = u + 'matomo.js';
+            s.parentNode.insertBefore(g, s);
+        })();
+    </script>
+    <!-- End Matomo Code -->
+
+    <link href="https://cdn.jsdelivr.net/npm/jsme@2017.2.26/jsme/jsa.min.css" rel="stylesheet">
+
+    <!-- Styles -->
+    @livewireStyles
+</head>
+
+<body class="font-sans antialiased">
+    <x-banner />
+    <x-impersonate::banner style='light' />
+    <div class="min-h-screen bg-gray-100">
+        @livewire('navigation-menu')
+
+        <!-- Page Heading -->
+        @if (isset($header))
+            <header class="bg-white shadow">
+                <div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
+                    {{ $header }}
+                </div>
+            </header>
+        @endif
+
+        <!-- Page Content -->
+        <main>
+            {{ $slot }}
+        </main>
+    </div>
+
+    @include('components.tawk-chat')
+
+    @stack('modals')
+    @livewireScripts
+    @include('cookie-consent::index')
+</body>
+
 </html>
diff --git a/resources/views/layouts/guest.blade.php b/resources/views/layouts/guest.blade.php
index 13aaa744..8fc425fe 100644
--- a/resources/views/layouts/guest.blade.php
+++ b/resources/views/layouts/guest.blade.php
@@ -1,70 +1,96 @@
 <!DOCTYPE html>
 <html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
-    <head>
-        <meta charset="utf-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-        <meta name="csrf-token" content="{{ csrf_token() }}">
 
-        <title>{{ config('app.name', 'Coconut') }}</title>
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="csrf-token" content="{{ csrf_token() }}">
 
-        <!-- Meta Tags -->
-        <meta name="description" content="{{ $description ?? 'An aggregated dataset of elucidated and predicted natural products collected from open sources and a web interface to browse, search, and easily download NPs.' }}">
-        <meta name="keywords" content="{{ $keywords ?? 'natural products, COCONUT, open data, molecule database' }}">
-        <meta name="author" content="{{ $author ?? 'COCONUT Team' }}">
-        <meta property="og:title" content="{{ $ogTitle ?? 'COCONUT: COlleCtion of Open Natural prodUcTs' }}">
-        <meta property="og:description" content="{{ $ogDescription ?? 'An aggregated dataset of elucidated and predicted natural products collected from open sources and a web interface to browse, search, and easily download NPs.' }}">
-        <meta property="og:type" content="website">
-        <meta property="og:url" content="{{ $ogUrl ?? url()->current() }}">
-        <meta property="og:image" content="{{ $ogImage ?? asset('img/coconut-og-image.png') }}">
-        <meta property="og:image:width" content="1200">
-        <meta property="og:image:height" content="630">
-        <meta property="og:site_name" content="{{ $ogSiteName ?? config('app.name', 'Coconut') }}">
+    <title>{{ config('app.name', 'Coconut') }}</title>
 
-        <!-- Fonts -->
-        <link rel="preconnect" href="https://fonts.bunny.net">
-        <link href="https://fonts.bunny.net/css?family=figtree:400,500,600&display=swap" rel="stylesheet" />
+    <!-- Meta Tags -->
+    <meta name="description"
+        content="{{ $description ?? 'An aggregated dataset of elucidated and predicted natural products collected from open sources and a web interface to browse, search, and easily download NPs.' }}">
+    <meta name="keywords" content="{{ $keywords ?? 'natural products, COCONUT, open data, molecule database' }}">
+    <meta name="author" content="{{ $author ?? 'COCONUT Team' }}">
+    <meta property="og:title" content="{{ $ogTitle ?? 'COCONUT: COlleCtion of Open Natural prodUcTs' }}">
+    <meta property="og:description"
+        content="{{ $ogDescription ?? 'An aggregated dataset of elucidated and predicted natural products collected from open sources and a web interface to browse, search, and easily download NPs.' }}">
+    <meta property="og:type" content="website">
+    <meta property="og:url" content="{{ $ogUrl ?? url()->current() }}">
+    <meta property="og:image" content="{{ $ogImage ?? asset('img/coconut-og-image.png') }}">
+    <meta property="og:image:width" content="1200">
+    <meta property="og:image:height" content="630">
+    <meta property="og:site_name" content="{{ $ogSiteName ?? config('app.name', 'Coconut') }}">
 
-        <!-- Scripts -->
-        @vite(['resources/css/app.css', 'resources/js/app.js'])
+    <!-- Fonts -->
+    <link rel="preconnect" href="https://fonts.bunny.net">
+    <link href="https://fonts.bunny.net/css?family=figtree:400,500,600&display=swap" rel="stylesheet" />
 
-        <!-- Styles -->
-        @livewireStyles
-    </head>
-    <body>
-        <x-banner />
-        <x-impersonate::banner style='light'/>
-        <div class="font-sans text-gray-900 antialiased">
-            <div class="bg-white">
-                <livewire:header />
-                <main class="isolate">
+    <!-- Scripts -->
+    @vite(['resources/css/app.css', 'resources/js/app.js'])
+
+    <!-- Matomo -->
+    <script>
+        var _paq = window._paq = window._paq || [];
+        /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+        _paq.push(['trackPageView']);
+        _paq.push(['enableLinkTracking']);
+        (function() {
+            var u = "//matomo.nfdi4chem.de/";
+            _paq.push(['setTrackerUrl', u + 'matomo.php']);
+            _paq.push(['setSiteId', '3']);
+            var d = document,
+                g = d.createElement('script'),
+                s = d.getElementsByTagName('script')[0];
+            g.async = true;
+            g.src = u + 'matomo.js';
+            s.parentNode.insertBefore(g, s);
+        })();
+    </script>
+    <!-- End Matomo Code -->
+
+
+    <!-- Styles -->
+    @livewireStyles
+</head>
+
+<body>
+    <x-banner />
+    <x-impersonate::banner style='light' />
+    <div class="font-sans text-gray-900 antialiased">
+        <div class="bg-white">
+            <livewire:header />
+            <main class="isolate">
                 {{ $slot }}
-                </main>
-                <livewire:footer />
-            </div>
+            </main>
+            <livewire:footer />
         </div>
-        @include('components.tawk-chat')
-        @livewireScripts
-        @include('cookie-consent::index')
-    </body>
-     <script>
-        document.addEventListener('DOMContentLoaded', function() {
-            function animateValue(element, start, end, duration) {
-                let startTimestamp = null;
-                const step = (timestamp) => {
-                    if (!startTimestamp) startTimestamp = timestamp;
-                    const progress = Math.min((timestamp - startTimestamp) / duration, 1);
-                    element.innerText = Math.floor(progress * (end - start) + start);
-                    if (progress < 1) {
-                        window.requestAnimationFrame(step);
-                    }
-                };
-                window.requestAnimationFrame(step);
-            }
+    </div>
+    @include('components.tawk-chat')
+    @livewireScripts
+    @include('cookie-consent::index')
+</body>
+<script>
+    document.addEventListener('DOMContentLoaded', function() {
+        function animateValue(element, start, end, duration) {
+            let startTimestamp = null;
+            const step = (timestamp) => {
+                if (!startTimestamp) startTimestamp = timestamp;
+                const progress = Math.min((timestamp - startTimestamp) / duration, 1);
+                element.innerText = Math.floor(progress * (end - start) + start);
+                if (progress < 1) {
+                    window.requestAnimationFrame(step);
+                }
+            };
+            window.requestAnimationFrame(step);
+        }
 
-            document.querySelectorAll('.number').forEach((element) => {
-                const endValue = parseFloat(element.getAttribute('data-value').replace(/,/g, ''));
-                animateValue(element, 0, endValue, 500);
-            });
+        document.querySelectorAll('.number').forEach((element) => {
+            const endValue = parseFloat(element.getAttribute('data-value').replace(/,/g, ''));
+            animateValue(element, 0, endValue, 500);
         });
-    </script>
+    });
+</script>
+
 </html>
