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.

/* OSRS Custom JS Framework */

// 1. Asynchronous Calculator Loader
$(function() {
    if ($('.jcConfig').length > 0) {
        // Asynchronously pull in calculator scripts
        mw.loader.getScript('/resources/assets/calc.js').then(function() {
            mw.loader.load('/resources/assets/calc.css', 'text/css');
            console.log("OSRS calculators loaded.");
        });
    }
});

// 2. Reader Mode Toggle
$(function() {
    var isReaderMode = localStorage.getItem('osrs-reader-mode') === 'true';

    function applyReaderMode() {
        $('body').toggleClass('reader-mode-active', isReaderMode);
        $('#reader-mode-escape').toggle(isReaderMode);
    }

    function toggleReaderMode() {
        isReaderMode = !isReaderMode;
        localStorage.setItem('osrs-reader-mode', String(isReaderMode));
        applyReaderMode();
    }

    // Insert toggle button into personal nav (in the header)
    var btn = $('<li><a href="#" id="pt-reader-mode">Toggle Reader Mode</a></li>');
    btn.on('click', function(e) {
        e.preventDefault();
        toggleReaderMode();
    });
    $('#p-personal ul').prepend(btn);

    // Also inject a fixed escape button that is ALWAYS visible in reader mode
    var escapeBtn = $('<div id="reader-mode-escape" style="' +
        'display:none; position:fixed; top:10px; left:10px; z-index:99999;' +
        'background:rgba(0,0,0,0.7); color:#fff; padding:8px 14px;' +
        'border-radius:6px; cursor:pointer; font-size:13px; font-weight:bold;' +
        'box-shadow:0 2px 8px rgba(0,0,0,0.4);">&#x2715; Exit Reader Mode</div>');
    escapeBtn.on('click', function() {
        toggleReaderMode();
    });
    $('body').append(escapeBtn);

    // Apply state on page load
    applyReaderMode();
});