Simple, opt-in cookie warning template for GDPR. (Warning: may not be sufficient to meet legal requirements 🤷‍♂️)

cookie-warning.js

(() => {
    const COOKIE_WARNING_KEY = 'cookie-warning-accepted';
    const ADD_FOR_HOSTNAMES = ['*'];
    const HOTJAR_ID = 0; // number here
    const HOTJAR_SV = 0; // number here 
    const GOOGLE_ANALYTICS_ID = ''; // GA string here
    const FACEBOOK_PIXEL_ID = ''; // FB pixel id string here
    const WARNING_MESSAGE = `
        <p>
            This site uses Google Analytics, Facebook, and HotJar for site analytics, and
            these tools use cookies for tracking.
        </p>`;
    
    function shouldAddTracking() {
        return ADD_FOR_HOSTNAMES.indexOf('*') > -1 || 
               ADD_FOR_HOSTNAMES.some(hostname => window.location.href.indexOf(HOSTNAME) > -1);
    }

    function addTracking() {
        if (!shouldAddTracking()) {
            console.log('Tracking accepted but not prod site. Not adding tracking...');
            return;
        }

        // HotJar
        if (HOTJAR_ID && HOTJAR_SV) {
            (function(h,o,t,j,a,r){
                h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
                h._hjSettings={hjid:HOTJAR_ID,hjsv:HOTJAR_SV};
                a=o.getElementsByTagName('head')[0];
                r=o.createElement('script');r.async=1;
                r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
                a.appendChild(r);
            })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
        }

        // Google Analytics
        if (GOOGLE_ANALYTICS_ID) {
            const el = document.createElement('script');
            el.src = `https://www.googletagmanager.com/gtag/js?id=${GOOGLE_ANALYTICS_ID}`;
            el.onload = () => {
                window.dataLayer = window.dataLayer || [];
                function gtag(){dataLayer.push(arguments);}
                gtag('js', new Date());
                gtag('config', GOOGLE_ANALYTICS_ID);
            }
            document.body.appendChild(el);
        }

        // Facebook pixel
        if (FACEBOOK_PIXEL_ID) {
            !function(f,b,e,v,n,t,s)
            {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
            n.callMethod.apply(n,arguments):n.queue.push(arguments)};
            if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
            n.queue=[];t=b.createElement(e);t.async=!0;
            t.src=v;s=b.getElementsByTagName(e)[0];
            s.parentNode.insertBefore(t,s)}(window, document,'script',
            'https://connect.facebook.net/en_US/fbevents.js');
            fbq('init', FACEBOOK_PIXEL_ID);
            fbq('track', 'PageView');
        }
    }

    function addBanner() {
        const el = document.createElement('div');
        el.id = COOKIE_WARNING_KEY;
        el.innerHTML = `
            ${WARNING_MESSAGE} 
            <p>
                <a href="javascript:CookieWarningLibrary.acceptCookies();"
                    class="cookie-warning-button cookie-warning-accept">Accept Cookies</a>
                <a href="javascript:CookieWarningLibrary.hideWarning();"
                    class="cookie-warning-button cookie-warning-reject">Reject Cookies</a>
            </p>`;
        document.body.appendChild(el);
    }

    // setCookie and getCookie from https://stackoverflow.com/a/38699214
    function setCookie(name, value, days = 7, path = '/') {
        const expires = new Date(Date.now() + days * 864e5).toUTCString();
        document.cookie = name + '=' + encodeURIComponent(value) + '; expires=' + expires + '; path=' + path;
    }

    function getCookie(name) {
        return document.cookie.split('; ').reduce((r, v) => {
            const parts = v.split('=');
            return parts[0] === name ? decodeURIComponent(parts[1]) : r;
        }, '');
    }

    function acceptCookies() {
        hideWarning();
        setCookie(COOKIE_WARNING_KEY, 'yes');
        addTracking();
    }

    function hideWarning() {
        document.getElementById(COOKIE_WARNING_KEY).remove();
    }
    
    window.addEventListener('load', (ev) => {
        if (getCookie(COOKIE_WARNING_KEY) === 'yes') {
            addTracking();
        } else {
            addBanner();
        }
    });

    // Exposed globally for button actions 
    window.CookieWarningLibrary = { acceptCookies, hideWarning };
})();