MediaWiki:Common.js

/* ============================================
   THEME TOGGLER
   ============================================ */

// 1. INSTANT EXECUTION (PREVENTS FLASH OF WRONG THEME)
// This runs the millisecond the script loads, before the body renders.
(function() {
    var savedTheme = localStorage.getItem('mb-wiki-theme');
    if (savedTheme === 'break') {
        document.documentElement.classList.add('theme-break');
    }
})();

// 2. DOM READY EXECUTION (UI BINDING)
$(function() {
    var isBreak = document.documentElement.classList.contains('theme-break');
    
    var $btn = $('<button>', {
        id: 'theme-toggle',
        class: 'floating-theme-toggle',
        text: isBreak ? '✦ Switch to Mana' : '✦ Switch to Break',
        title: 'Toggle Light/Dark Theme'
    });
    
    $('body').append($btn);

    $btn.on('click', function() {
        var $html = $('html');
        
        if ($html.hasClass('theme-break')) {
            // Switching to Mana (Light)
            $html.removeClass('theme-break');
            localStorage.setItem('mb-wiki-theme', 'mana');
            $(this).text('✦ Switch to Break');
        } else {
            // Switching to Break (Dark)
            $html.addClass('theme-break');
            localStorage.setItem('mb-wiki-theme', 'break');
            $(this).text('✦ Switch to Mana');
        }
    });
});