Jump to content

Welcome to King Warz Charts Wiki! Please note that the site is still under construction as I work on creating past chart week pages, as well as templates and pages for artists, songs, and albums. Because of this, you may see a lot of red links throughout the site.

MediaWiki:Common.js

From King Warz Charts
Revision as of 23:49, 12 July 2026 by Kingwarz (talk | contribs)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

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.
/* 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);
    });
}());