User:Most2dot0/common.js

From Angelina Jordan Wiki
Revision as of 20:58, 12 November 2025 by Most2dot0 (talk | contribs) (3rd version of date preview gadget to check sytem popup emulation)

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.
//syntax highlighter
mw.loader.load('//www.mediawiki.org/w/index.php?title=MediaWiki:Gadget-DotsSyntaxHighlighter.js&action=raw&ctype=text/javascript');
syntaxHighlighterConfig = { parameterColor: "#FFDD99" }


// Auto-reload page content if marker element is present
$(document).ready(function() {
    const marker = document.getElementById('auto-reload-trigger');
    if (!marker) return;

    const period = Math.max(5, parseInt(marker.dataset.period || "30", 10)); // seconds
    const limit = parseInt(marker.dataset.limit || "10", 10); // max reloads
    let count = 0;

    // Create and insert status display
    const statusBox = $('<div id="auto-reload-status" style="margin:10px 0;padding:5px;border:1px solid #ccc;font-size:90%;width:fit-content;background:#f8f8f8;"></div>');
    statusBox.text(`Reloads done: ${count} / ${limit}`);
    $('#mw-content-text').before(statusBox);

    function reloadContent() {
        if (count >= limit) {
            statusBox.text(`Reload complete (${count}/${limit})`);
            return;
        }
        count++;
        statusBox.text(`Reloads done: ${count} / ${limit}`);

        $.ajax({
            url: location.href,
            cache: false,
            success: function(data) {
                const newContent = $(data).find('#mw-content-text');
                if (newContent.length) {
                    $('#mw-content-text').replaceWith(newContent);
                    mw.hook('wikipage.content').fire($('#mw-content-text'));
                }
            }
        });
    }

    setInterval(reloadContent, period * 1000);
});



// Gadget: Timeline hover previews (enhanced)
// Requires: mediawiki.api, mediawiki.util, jquery

mw.loader.using(['mediawiki.api', 'mediawiki.util']).then(function () {
    var api = new mw.Api();
    var timelineCache = null;

    // Precreate popup styled like MediaWiki page preview
    var popup = $('<div>')
        .addClass('mwe-popups mwe-popups-type-page')
        .css({
            position: 'absolute',
            zIndex: 1000,
            display: 'none'
        })
        .append(
            $('<div>')
                .addClass('mwe-popups-container')
                .append(
                    $('<div>')
                        .addClass('mwe-popups-extract')
                        .css({
                            padding: '0.75em 1em',
                            background: 'white',
                            border: '1px solid #ccc',
                            borderRadius: '4px',
                            boxShadow: '0 2px 4px rgba(0,0,0,0.2)',
                            maxWidth: '350px'
                        })
                )
        )
        .appendTo(document.body);

    function setPopupContent(html) {
        popup.find('.mwe-popups-extract').html(html);
    }

    function loadTimeline() {
        if (timelineCache) return $.Deferred().resolve();

        return api.get({
            action: 'parse',
            page: 'Timeline',
            prop: 'text',
            formatversion: 2
        }).then(function (data) {
            var html = $('<div>').html(data.parse.text);
            timelineCache = {};
            html.find('dt').each(function () {
                var dt = $(this);
                var id = dt.find('span[id]').attr('id');
                if (!id) return;
                var ddList = [];
                var el = dt.next();
                while (el.length && el.prop('tagName') === 'DD') {
                    var clone = el.clone();
                    // Remove <sup class="reference"> citations
                    clone.find('sup.reference').remove();
                    ddList.push(clone.html());
                    el = el.next();
                }
                timelineCache[id] = ddList.join('<br>');
            });
        });
    }

    function showPopup($link, html) {
        setPopupContent(html);
        var offset = $link.offset();
        popup
            .css({
                top: offset.top + $link.outerHeight() + 6,
                left: offset.left
            })
            .show();
    }

    function hidePopup() {
        popup.hide();
    }

    function onHover() {
        var $link = $(this);
        var href = $link.attr('href') || '';
        var match =
            href.match(/\/Timeline#(\d{4}-\d{2}-\d{2})$/) ||
            href.match(/^#(\d{4}-\d{2}-\d{2})$/);
        if (!match) return;

        var id = match[1];
        loadTimeline().then(function () {
            var content = timelineCache[id];
            if (content) showPopup($link, content);
        });
    }

    function bindTimelineLinks(context) {
        $(context)
            .find('a[href*="Timeline#"], a[href^="#"]')
            .each(function () {
                var $link = $(this);
                var href = $link.attr('href') || '';
                if (
                    href.match(/Timeline#\d{4}-\d{2}-\d{2}$/) ||
                    href.match(/^#\d{4}-\d{2}-\d{2}$/)
                ) {
                    $link.attr('data-mw-previews-disable', 'true');
                    $link.off('.timelinePreview')
                        .on('mouseenter.timelinePreview', onHover)
                        .on('mouseleave.timelinePreview', hidePopup);
                }
            });
    }

    // Initial bind
    mw.hook('wikipage.content').add(bindTimelineLinks);

    // Mutation observer to rebind links inside dynamically revealed content
    var observer = new MutationObserver(function (mutations) {
        for (var i = 0; i < mutations.length; i++) {
            var m = mutations[i];
            for (var j = 0; j < m.addedNodes.length; j++) {
                var node = m.addedNodes[j];
                if (node.nodeType === 1) bindTimelineLinks(node);
            }
        }
    });
    observer.observe(document.body, { childList: true, subtree: true });
});