MediaWiki:Common.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

(function () {

    const AGE_KEY = "ageVerifiedTime";
    const CONSENT_KEY = "analyticsConsent";
    const MAX_AGE = 30 * 24 * 60 * 60 * 1000;

    const savedAge = localStorage.getItem(AGE_KEY);

    if (savedAge && (Date.now() - Number(savedAge) < MAX_AGE)) {
        const consent = localStorage.getItem(CONSENT_KEY);
        if (consent === "granted") {
            loadGoogleAnalytics();
        }
        return;
    }

    const style = document.createElement("style");
    style.innerHTML = `
        #age-overlay{
            position:fixed;
            top:0;
            left:0;
            width:100%;
            height:100%;
            backdrop-filter:blur(8px);
            background:rgba(0,0,0,0.85);
            display:flex;
            align-items:center;
            justify-content:center;
            z-index:999999;
            font-family:Arial,sans-serif;
        }

        #age-box{
            background:#111;
            color:white;
            padding:40px;
            border-radius:12px;
            max-width:460px;
            text-align:center;
            box-shadow:0 0 40px rgba(0,0,0,0.7);
        }

        #age-box h2{
            margin-top:0;
        }

        #age-buttons{
            margin-top:20px;
        }

        #age-buttons button{
            padding:12px 22px;
            margin:8px;
            font-size:15px;
            border:none;
            border-radius:6px;
            cursor:pointer;
        }

        #age-enter-analytics{
            background:#2ecc71;
            color:white;
        }

        #age-enter-essential{
            background:#3498db;
            color:white;
        }

        #age-no{
            background:#e74c3c;
            color:white;
        }

        #age-links{
            margin-top:18px;
            font-size:12px;
            opacity:0.85;
            line-height:1.5;
        }

        #age-links a{
            color:#aaa;
            margin:0 8px;
        }

        #cookie-note{
            margin-top:14px;
            font-size:12px;
            color:#ccc;
        }
    `;

    document.head.appendChild(style);

    const overlay = document.createElement("div");
    overlay.id = "age-overlay";

    overlay.innerHTML = `
        <div id="age-box">

            <h2>18+ Age Verification</h2>

            <p>This website contains adult educational content.</p>
            <p>You must be at least <b>18 years old</b> to enter.</p>

            <div id="cookie-note">
                We use essential storage for site functionality. You may optionally allow analytics.
            </div>

            <div id="age-buttons">
                <button id="age-enter-analytics">Enter with Analytics</button>
                <button id="age-enter-essential">Enter Essential Only</button>
                <button id="age-no">Leave</button>
            </div>

            <div id="age-links">
                <a href="/index.php?title=Impressum">Impressum</a>
                <a href="/index.php?title=Datenschutz">Privacy</a>
            </div>

        </div>
    `;

    document.body.appendChild(overlay);

    function saveAgeVerification() {
        localStorage.setItem(AGE_KEY, String(Date.now()));
    }

    function saveAnalyticsConsent(value) {
        localStorage.setItem(CONSENT_KEY, value);
    }

    function loadGoogleAnalytics() {

        if (window.__gaLoaded) return;
        window.__gaLoaded = true;

        window.dataLayer = window.dataLayer || [];

        function gtag(){
            dataLayer.push(arguments);
        }

        window.gtag = gtag;

        gtag('consent', 'default', {
            analytics_storage: 'granted'
        });

        const script = document.createElement('script');
        script.async = true;
        script.src = 'https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX';

        document.head.appendChild(script);

        gtag('js', new Date());

        gtag('config', 'G-XXXXXXXXXX', {
            anonymize_ip: true
        });
    }

    document.getElementById("age-enter-analytics").onclick = function(){
        saveAgeVerification();
        saveAnalyticsConsent("granted");
        overlay.remove();
        loadGoogleAnalytics();
    };

    document.getElementById("age-enter-essential").onclick = function(){
        saveAgeVerification();
        saveAnalyticsConsent("denied");
        overlay.remove();
    };

    document.getElementById("age-no").onclick = function(){
        window.location.href="https://google.com";
    };

})();