MediaWiki:Common.js: Difference between revisions
m may need to roll back to if we break FAQList |
m sidebar toggle for small screens |
||
| (One intermediate revision by the same user not shown) | |||
| Line 2: | Line 2: | ||
Global JS for the wiki. | Global JS for the wiki. | ||
- Keeps FAQ expand/collapse handlers. | - Keeps FAQ expand/collapse handlers. | ||
- Adds reliable body classes (mw-user / mw-anonuser) | - Adds reliable body classes (mw-user / mw-anonuser) using mw.config.get('wgUserId'). | ||
- Lightweight and safe; fails silently if mw. | - Lightweight and safe; fails silently if mw or mw.config is unavailable. | ||
*/ | */ | ||
| Line 21: | Line 21: | ||
}); | }); | ||
/* | /* Helper: ensure body has mw-user or mw-anonuser so CSS can target logged-in vs anon reliably. | ||
Uses mw.config.get('wgUserId') which is present in all ResourceLoader contexts. | |||
( function () { | */ | ||
(function () { | |||
try { | try { | ||
if ( mw.user. | if ( typeof mw === 'undefined' || !mw.config || typeof mw.config.get !== 'function' ) { | ||
document.body.classList.add( 'mw-anonuser' ); | // mw or mw.config not available yet — try again after DOM ready | ||
document.addEventListener('DOMContentLoaded', function () { | |||
try { | |||
var uid = (window.mw && mw.config && mw.config.get) ? mw.config.get('wgUserId') : null; | |||
if (!uid) { | |||
document.body.classList.add('mw-anonuser'); | |||
document.body.classList.remove('mw-user'); | |||
} else { | |||
document.body.classList.add('mw-user'); | |||
document.body.classList.remove('mw-anonuser'); | |||
} | |||
} catch (e) { | |||
if (window.console && console.warn) console.warn('Common.js body class helper (deferred) failed', e); | |||
} | |||
}, { once: true }); | |||
return; | |||
} | |||
// If body exists now, set classes immediately; otherwise wait for DOMContentLoaded | |||
function setBodyClass() { | |||
try { | |||
var uid = mw.config.get('wgUserId'); | |||
if (!uid || uid === 0 || uid === '') { | |||
document.body.classList.add('mw-anonuser'); | |||
document.body.classList.remove('mw-user'); | |||
} else { | |||
document.body.classList.add('mw-user'); | |||
document.body.classList.remove('mw-anonuser'); | |||
} | |||
} catch (e) { | |||
if (window.console && console.warn) console.warn('Common.js body class helper failed', e); | |||
} | |||
} | |||
if (document.body) { | |||
setBodyClass(); | |||
} else { | } else { | ||
document. | document.addEventListener('DOMContentLoaded', setBodyClass, { once: true }); | ||
} | } | ||
} catch ( e ) { | } catch (e) { | ||
if ( window.console && console.warn ) console.warn( 'Common.js | if (window.console && console.warn) console.warn('Common.js initialization failed', e); | ||
} | } | ||
}()); | |||
// Add a simple sidebar toggle for small screens | |||
( function () { | |||
if ( mw.config.get('skin') && window.matchMedia('(max-width: 800px)').matches ) { | |||
var btn = document.createElement('button'); | |||
btn.className = 'sidebar-toggle'; | |||
btn.textContent = '☰'; | |||
document.body.appendChild(btn); | |||
btn.addEventListener('click', function () { | |||
var sb = document.querySelector('.vector-sidebar, .mw-sidebar, #mw-panel'); | |||
if ( sb ) sb.classList.toggle('open'); | |||
}); | |||
} | |||
}() ); | }() ); | ||