docs/consent.js at main · VeloraDEX/docs · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
const GA4_MEASUREMENT_ID = 'G-4D17CZC526';
const COOKIECONSENT_VERSION = '3.1.0';
const CDN = `https://cdn.jsdelivr.net/npm/vanilla-cookieconsent@${COOKIECONSENT_VERSION}/dist`;

window.dataLayer = window.dataLayer || [];
function gtag() {
  dataLayer.push(arguments);
}

gtag('consent', 'default', {
  ad_storage: 'denied',
  ad_user_data: 'denied',
  ad_personalization: 'denied',
  analytics_storage: 'denied',
  functionality_storage: 'denied',
  personalization_storage: 'denied',
  security_storage: 'granted',
  wait_for_update: 500,
});

loadStylesheet(`${CDN}/cookieconsent.css`);
loadScript(`${CDN}/cookieconsent.umd.js`, initConsentBanner);

// GA4 is only fetched after the visitor accepts analytics, so rejecting it
// sends nothing to Google. enableAnalytics() loads gtag.js exactly once.
let analyticsLoaded = false;
function enableAnalytics() {
  if (analyticsLoaded) return;
  analyticsLoaded = true;
  gtag('js', new Date());
  gtag('config', GA4_MEASUREMENT_ID);
  loadScript(`https://www.googletagmanager.com/gtag/js?id=${GA4_MEASUREMENT_ID}`);
}

function loadScript(src, onload) {
  const script = document.createElement('script');
  script.src = src;
  script.async = true;
  if (onload) script.onload = onload;
  document.head.appendChild(script);
}

function loadStylesheet(href) {
  const link = document.createElement('link');
  link.rel = 'stylesheet';
  link.href = href;
  document.head.appendChild(link);
}

function syncConsentMode() {
  const accepted = CookieConsent.acceptedCategory('analytics');
  gtag('consent', 'update', {
    analytics_storage: accepted ? 'granted' : 'denied',
  });
  if (accepted) enableAnalytics();
}

function initConsentBanner() {
  CookieConsent.run({
    categories: {
      necessary: { enabled: true, readOnly: true },
      analytics: {},
    },
    language: {
      default: 'en',
      translations: {
        en: {
          consentModal: {
            title: 'We use cookies',
            description:
              'We use analytics cookies to understand how you use the Velora docs. They stay off until you accept.',
            acceptAllBtn: 'Accept',
            acceptNecessaryBtn: 'Reject',
            showPreferencesBtn: 'Manage preferences',
          },
          preferencesModal: {
            title: 'Cookie preferences',
            acceptAllBtn: 'Accept all',
            acceptNecessaryBtn: 'Reject all',
            savePreferencesBtn: 'Save preferences',
            closeIconLabel: 'Close',
            sections: [
              {
                title: 'Strictly necessary',
                description: 'Required for the docs to work. Always on.',
                linkedCategory: 'necessary',
              },
              {
                title: 'Analytics',
                description: 'Google Analytics, to measure how the docs are used.',
                linkedCategory: 'analytics',
              },
            ],
          },
        },
      },
    },
    onConsent: syncConsentMode,
    onChange: syncConsentMode,
  });
}