MediaWiki:Common.js

/* MediaWiki:Common.js — King Warz Charts site scripts */

/* Interactive charts (Module:KWCChart / Template:Chart history).
 * Loads Apache ECharts from cdnjs (allowed by Miraheze's CSP) whenever a
 * page contains a .kwc-echart container, then renders the JSON config that
 * the Lua module wrote into the hidden <pre> inside it. */
(function () {
    var ECHARTS_URLS = [
        'https://cdnjs.cloudflare.com/ajax/libs/echarts/6.1.0/echarts.min.js',
        'https://cdn.jsdelivr.net/npm/[email protected]/dist/echarts.min.js'
    ];
    var loading = null;

    function loadECharts() {
        if (window.echarts) { return Promise.resolve(); }
        if (!loading) {
            loading = mw.loader.getScript(ECHARTS_URLS[0]).catch(function () {
                return mw.loader.getScript(ECHARTS_URLS[1]);
            });
        }
        return loading;
    }

    function decodeEntities(s) {
        var t = document.createElement('textarea');
        t.innerHTML = s;
        return t.value;
    }

    function renderAll($content) {
        var nodes = $content ? $content.find('.kwc-echart').get()
                             : document.querySelectorAll('.kwc-echart');
        if (!nodes.length) { return; }
        loadECharts().then(function () {
            Array.prototype.forEach.call(nodes, function (el) {
                if (el.getAttribute('data-kwc-rendered')) { return; }
                var pre = el.querySelector('.kwc-echart-config');
                if (!pre) { return; }
                var opt;
                try {
                    opt = JSON.parse(decodeEntities(pre.textContent));
                } catch (e) {
                    return;
                }
                el.setAttribute('data-kwc-rendered', '1');
                var years = opt.kwcYears;
                delete opt.kwcYears;
                if (years && years.length && opt.tooltip) {
                    opt.tooltip.formatter = function (params) {
                        if (!params || !params.length) { return ''; }
                        var i = params[0].dataIndex;
                        var head = params[0].axisValueLabel || params[0].axisValue;
                        if (years[i] !== undefined) {
                            head += ' (' + years[i] + ')';
                        }
                        var lines = [head];
                        params.forEach(function (p) {
                            if (p.value === null || p.value === undefined ||
                                p.value === '-') { return; }
                            lines.push(p.marker + ' ' + (p.seriesName || '') +
                                       ' &nbsp;<b>' + p.value + '</b>');
                        });
                        return lines.join('<br/>');
                    };
                }
                var chart = window.echarts.init(el);
                chart.setOption(opt);
                window.addEventListener('resize', function () {
                    chart.resize();
                });
            });
        });
    }

    mw.hook('wikipage.content').add(function ($content) {
        renderAll($content);
    });
}());
/* "Did you know…" rotator (Template:DYK). The template ships the whole
 * weekly fact pool; server HTML is parser-cached, so each page view picks
 * 4 facts at random client-side. */
(function () {
    function rotateDyk() {
        var pools = document.querySelectorAll('.kwc-dyk-pool');
        Array.prototype.forEach.call(pools, function (root) {
            if (root.getAttribute('data-kwc-rotated')) { return; }
            root.setAttribute('data-kwc-rotated', '1');
            var items = root.querySelectorAll('ul > li');
            if (items.length <= 4) { return; }
            var idx = [];
            for (var i = 0; i < items.length; i++) { idx.push(i); }
            for (var j = idx.length - 1; j > 0; j--) {
                var k = Math.floor(Math.random() * (j + 1));
                var t = idx[j]; idx[j] = idx[k]; idx[k] = t;
            }
            var keep = {};
            for (var c = 0; c < 4; c++) { keep[idx[c]] = true; }
            for (var n = 0; n < items.length; n++) {
                if (!keep[n]) { items[n].style.display = 'none'; }
            }
        });
    }
    mw.hook('wikipage.content').add(rotateDyk);
})();