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.

/* Grantha.io — chapter nav scroll-spy */
(function () {
    'use strict';

    function initScrollSpy() {
        var nav = document.querySelector('.gr-chapter-nav');
        if (!nav) return;

        var links = Array.from(nav.querySelectorAll('a')).filter(function (a) {
            return a.href && a.href.indexOf('#') !== -1;
        });
        if (!links.length) return;

        var targets = links.map(function (a) {
            var id = a.href.split('#')[1];
            return id ? document.getElementById(id) : null;
        });

        function update() {
            /* Try all possible scroll containers — window, html, body,
               and MW-specific wrappers */
            var scrollY = window.scrollY
                || document.documentElement.scrollTop
                || document.body.scrollTop
                || 0;
            var threshold = scrollY + 130;
            var active = 0;
            for (var i = 0; i < targets.length; i++) {
                if (targets[i]) {
                    /* offsetTop walks up to get absolute position */
                    var el = targets[i];
                    var top = 0;
                    while (el) { top += el.offsetTop; el = el.offsetParent; }
                    if (top <= threshold) active = i;
                }
            }
            links.forEach(function (a, i) {
                a.style.color = (i === active) ? '#f57c00' : '';
                a.style.fontWeight = (i === active) ? '600' : '';
            });
        }

        /* Attach to every possible scroll source */
        window.addEventListener('scroll', update, { passive: true });
        document.addEventListener('scroll', update, { passive: true });
        var mwContent = document.getElementById('mw-content-text')
            || document.getElementById('content')
            || document.getElementById('bodyContent');
        if (mwContent) {
            mwContent.addEventListener('scroll', update, { passive: true });
        }

        update();
    }

    mw.hook('wikipage.content').add(function () {
        /* Small delay to let MW finish rendering large pages */
        setTimeout(initScrollSpy, 300);
    });
}());