MediaWiki:Common.js: Difference between revisions

From MB Wiki
Jump to navigation Jump to search
m (Reverted edits by Ais (talk) to last revision by Mikevoir)
Tag: Rollback
mNo edit summary
Line 1: Line 1:
var config = mw.config.values;
/* ============================================
window.dev = window.dev || {};
  THEME TOGGLER
window.dev.waitFor = function(query, callback, extraDelay) {
  ============================================ */
if ('function' == typeof callback && 'string' == typeof query) {
extraDelay = extraDelay || 0;
if (document.querySelector(query)) {
setTimeout(callback, extraDelay);
} else {
// set up the mutation observer
var observer = new MutationObserver(function (mutations, me) {
// mutations is an array of mutations that occurred
// me is the MutationObserver instance
var targetNode = document.querySelector(query);
if (targetNode) {
setTimeout(callback, extraDelay);
me.disconnect(); // stop observing
return;
}
});
// start observing
observer.observe(document, {
  childList: true,
  subtree: true
});
}
}
};


// Load site JS
// 1. INSTANT EXECUTION (PREVENTS FLASH OF WRONG THEME)
[
// This runs the millisecond the script loads, before the body renders.
'ThemeToggle.js', // Add link button on sidebar for mass renaming files and pages
(function() {
'MassRename.js', // Add link button on sidebar for mass renaming files and pages
    var savedTheme = localStorage.getItem('mb-wiki-theme');
'BetterUpload.js', // Improvements to Special:Upload
    if (savedTheme === 'break') {
'BetterDiff.js' // Aids with patrolling and with diff viewing on RC, page history and user contribs
        document.documentElement.classList.add('theme-break');
]
    }
.forEach(function(src){
})();
importScript('MediaWiki:'+src);
});


// Run when page content is added and loaded
// 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');
        }
    });
});// Run when page content is added and loaded
mw.hook('wikipage.content').add(function(){
mw.hook('wikipage.content').add(function(){
// Add navigational keybinds
// Add navigational keybinds

Revision as of 03:27, 19 May 2026

/* ============================================
   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');
        }
    });
});// Run when page content is added and loaded
mw.hook('wikipage.content').add(function(){
	// Add navigational keybinds
	if (config.wgAction=='view') {
		var actions = {
			e: function(page){ return config.wgServer+mw.util.getUrl(page)+'?action=edit'; },
			h: function(page){ return config.wgServer+mw.util.getUrl(page)+'?action=history'; },
			m: function(page){ return config.wgServer+mw.util.getUrl('Special:MovePage/'+page); },
			d: function(page){ return config.wgServer+mw.util.getUrl(page)+'?action=delete'; },
		};
		var url = new URL(document.location.href);
		var title = 
			url.searchParams.get('title') ||			// for `/w/index.php?title=XYZ` links
			url.pathname.replace(/^.*?wi?k?i?\//, '');	// for `/wiki/XYZ` links
		$(document).on('keydown', function(e) {
			var key = e.key.toLocaleLowerCase();
			if (
				actions[key] &&
				!(e.target && ['INPUT', 'TEXTAREA'].includes(e.target.nodeName)) &&
				config.wgCanonicalSpecialPageName===false
			) {
				document.location.href= actions[key](title);
			}
		});
	}
	
	// Run through sidebar to make sure classes align with collapse status
	window.dev.waitFor('#mw-navigation > .collapsible-nav > nav', function() {
		$('#mw-navigation > .collapsible-nav > nav').each(function(_, nav) {
			if (getComputedStyle(nav).display!=='none') {
				if (
					nav.classList.contains('collapsed') &&
					getComputedStyle(nav.querySelector('.vector-menu-content')).display!=='none'
				) {
					nav.classList.remove('collapsed');
					nav.classList.add('expanded');
				} else if (
					nav.classList.contains('expanded') &&
					getComputedStyle(nav.querySelector('.vector-menu-content')).display=='none'
				) {
					nav.classList.add('collapsed');
					nav.classList.remove('expanded');
				}
			}
		});
	});
});

// Load personal JS & CSS if logged in user
if (config.wgUserName && config.wgUserName.length>0) {
	importScript('User:'+config.wgUserName+'/common.js');
	importStylesheet('User:'+config.wgUserName+'/common.css');
}