Insurer Brain

MediaWiki:Mobile.js: Difference between revisions

Browse history interactively
← Older editNewer edit →
Content deleted Content added
No edit summary
Tag: Reverted
No edit summary
Tag: Reverted
Line 8:
}
 
/* CapSach — Mobile TOC overlay (phones); robustALWAYS H2-open- parent H2 before-scroll forscrolling to H3+ */
(function () {
/* ---------------- utilities ---------------- */
function isMobileSite() {
// Stable wayMF tosignal detecton the MobileFrontend site (<body> class="mw-mf">)for gadgets/scripts.
return document.body && document.body.classList.contains('mw-mf'); /* MF site */ /*MobileFrontend active. */ :contentReference[oaicite:1]{index=1}
}
 
function once(id) { return !document.getElementById(id); }
function onReady(fn) { if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', fn); else fn(); }
 
function onReady(fn) {
if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', fn);
else fn();
}
 
function getContentRoot() {
Line 33 ⟶ 28:
}
 
// AccountScroll while compensating for any sticky headers whenin mobile scrollingskins.
function smoothScrollTo(el) {
var offset = 0;
try {
var fixed = document.querySelectorAll('header, .minerva-header, .mw-header, .site-header, #header, .header');.forEach(function (node) {
fixed.forEach(function (node) {
var cs = getComputedStyle(node);
if (cs.position === 'fixed' || cs.position === 'sticky') {
Line 50 ⟶ 44:
}
 
// In MW 1.43+ IDs may be on .mw-headline (inside the heading wrapper). :contentReference[oaicite:2]{index=2}
/* ---------- MF section helpers ---------- */
// NEW heading markup: ids can be on <hN> or on .mw-headline (MW 1.43+ wrappers)
function anchorForHeadingEl(hEl) {
if (!hEl) return null;
var span = hEl.querySelector && hEl.querySelector('.mw-headline[id]');
if (span) return span;
return hEl.id ? hEl : null; /* MW 1.44+ may put id on <hN> */
}
 
/* ---------------- section open logic ---------------- */
// Find the element that actually toggles the H2 section (owns aria-expanded / aria-controls)
// Try to locate the *actual* toggle that MobileFrontend attached.
function getH2Toggle(h2El) {
if (!h2El) return null;
var wwrapper = h2El.closest('.mw-heading') || h2El.parentElement || h2El;
// PreferMost robust: a realbutton with aria-controls; otherwise any control with aria-controlsexpanded.
var ctrl = wwrapper.querySelector('button[aria-controls], [ariadata-expanded][ariaevent-controlsname="section-toggle"], .mf-section-toggle');
if (!ctrl) return ctrl = wrapper.querySelector('[aria-expanded]');
// Legacy: the H2 or its sibling acts as the toggle.
// Next-best: any descendant exposing aria-expanded
if (!ctrl && (h2El.hasAttribute('aria-expanded') || h2El.classList.contains('section-heading') || h2El.classList.contains('collapsible-heading'))) ctrl = h2El;
ctrl = w.querySelector('[aria-expanded]');
if (!ctrl && h2El.previousElementSibling && (h2El.previousElementSibling.matches('[aria-expanded], .section-heading, .collapsible-heading'))) ctrl = h2El.previousElementSibling;
if (ctrl) return ctrl;
if (!ctrl && h2El.nextElementSibling && (h2El.nextElementSibling.matches('[aria-expanded], .section-heading, .collapsible-heading'))) ctrl = h2El.nextElementSibling;
// Legacy: the heading itself behaves as the toggle
return ctrl;
if (h2El.hasAttribute('aria-expanded') || h2El.classList.contains('section-heading') ||
h2El.classList.contains('collapsible-heading')) {
return h2El;
}
// As a last resort, some old MF put a separate preceding/next sibling as the toggle
var prev = h2El.previousElementSibling, next = h2El.nextElementSibling;
if (prev && (prev.matches('[aria-expanded], .section-heading, .collapsible-heading'))) return prev;
if (next && (next.matches('[aria-expanded], .section-heading, .collapsible-heading'))) return next;
return null;
}
 
function h2IsCollapsed(h2El) {
if (!h2El) return false;
 
var toggle = getH2Toggle(h2El);
// Newer pattern: wrapper section with aria-expanded controls visibility.
if (toggle) {
var aesec = toggleh2El.getAttributeclosest('section[aria-expanded]');
if (sec) return sec.getAttribute('aria-expanded') === 'false';
 
// Toggle state on heading/button itself.
var t = getH2Toggle(h2El);
if (t) {
var ae = t.getAttribute('aria-expanded');
if (ae === 'false') return true;
if (ae === 'true') return false;
var cid = togglet.getAttribute('aria-controls');
if (cid) {
var block = document.getElementById(cid);
Line 97 ⟶ 89:
}
}
// Legacy: sibling .collapsible-block right after H2
var sib = h2El.nextElementSibling;
if (sib && sib.classList.contains('collapsible-block')) return !sib.classList.contains('open-block');
// Newer wrapper pattern: <section aria-expanded="false"> around heading+content
var sec = h2El.closest('section[aria-expanded]');
if (sec) return sec.getAttribute('aria-expanded') === 'false';
return false;
}
 
// Synthesize a robust "activation" to trigger MF's own handler if present.
function fireActivation(el) {
function activate(el) {
// Fire a sequence of events so whichever MF handler is present reacts
var optsev = { bubbles: true, cancelable: true, view: window };
try { el.dispatchEvent(new PointerEventMouseEvent('pointerdownmousedown', optsev)); } catch (_) {}
try { el.dispatchEvent(new MouseEvent('mousedownmouseup', optsev)); } catch (_) {}
try { el.dispatchEvent(new TouchEventMouseEvent('touchstartclick', optsev)); } catch (_) { el.click(); }
try { el.dispatchEvent(new TouchEvent('touchend', opts)); } catch (_) {}
try { el.dispatchEvent(new MouseEvent('mouseup', opts)); } catch (_) {}
try { el.dispatchEvent(new MouseEvent('click', opts)); } catch (_) { el.click(); }
}
 
// **Guarantee** the H2 section is open:
// Open H2 if needed; resolve when open (or after timeout)
// 1) try MF's toggle; 2) if still closed, **force-open** the DOM (wrapper+block).
function ensureH2Open(h2El) {
return new Promise(function (resolve) {
Line 123 ⟶ 110:
 
var toggle = getH2Toggle(h2El);
var triedManualobs = null, done = false;
function finish() { if (!done) { done = true; if (obs) obs.disconnect(); resolve(); } }
 
// Observe changes to aria-expanded / classes / hidden
var obs = null;
if (window.MutationObserver) {
obs = new MutationObserver(function () {
if (!h2IsCollapsed(h2El)) {finish();
if (obs) obs.disconnect();
resolve();
}
});
var targets = [];
if (toggle) targets.push(toggle);
var cid = toggle && toggle.getAttribute('aria-controls');
var controlled = cid && document.getElementById(cid);
if (controlled) targets.push(controlled);
// Also watch the wrapper <section aria-expanded>
var sec = h2El.closest('section[aria-expanded]');
if (sec) targets.push(sec);
var cid = toggle && toggle.getAttribute('aria-controls');
if (targets.length) {
var block = cid && document.getElementById(cid);
targets.forEach(function (t) {
if (block) targets.push(block);
obs.observe(t, { attributes: true, attributeFilter: ['aria-expanded', 'class', 'hidden'] });
targets.forEach(function }(t); {
obs.observe(t, { attributes: true, attributeFilter: ['aria-expanded', 'class', 'hidden', 'style'] });
}
});
}
 
// FirstStep 1: try to useAttempt MF’sthe own*real* handlertoggle
if (toggle) fireActivationactivate(toggle);
 
// FallbackStep (after2: After a short tick) –, manually**force open** if still collapsed
setTimeout(function manualIfNeeded() {
if (!h2IsCollapsed(h2El)) return finish(); // already open
 
if (!triedManual) {
// Wrapper triedManual<section = true;aria-expanded>
var sec = h2El.closest('section[aria-expanded]');
if (sec) sec.setAttribute('aria-expanded', 'true');
 
// ManualToggle openelement strategy:state
if (toggle) {
// 1) If we have a controls target, unhide it + mark open-block
var cid = toggle && toggle.getAttributesetAttribute('aria-controlsexpanded', 'true');
var cid = toggle.getAttribute('aria-controls');
var block = cid && document.getElementById(cid);
if (block) {
block.hidden = false;
block.removeAttribute('hidden');
block.classList.add('open-block'); // legacy open marker
block.style.display = ''; // clear any inline display:none
}
// 2) If a wrapper <section aria-expanded> exists, flip it
var sec = h2El.closest('section[aria-expanded]');
if (sec) sec.setAttribute('aria-expanded', 'true');
// 3) If legacy sibling block exists, mark it open
var sib = h2El.nextElementSibling;
if (sib && sib.classList.contains('collapsible-block')) {
sib.classList.add('open-block');
sib.hidden = false;
sib.removeAttribute('hidden');
}
}
 
// FinalLegacy safetysibling timeout: stop waitingblock after 900ms overallH2
var sib = h2El.nextElementSibling;
if (sib && sib.classList.contains('collapsible-block')) {
sib.hidden = false;
sib.removeAttribute('hidden');
sib.classList.add('open-block');
sib.style.display = '';
}
 
// Final safety: even if some CSS remains, proceed; scrolling to H3 will now work.
finish();
}, 120);
 
// Hard stop to prevent hangs
setTimeout(function () {
if setTimeout(obs)finish, obs.disconnect(900);
resolve(); // even if still closed, we won’t hang
}, 900);
});
}
 
/* ---------------- main initializer ---------------- */
function initTOC() {
if (window.matchMedia('(min-width: 768px)').matches) return; // phones only
if (mw.config && !mw.config.get('wgIsArticle')) return; // content pages only
if (window.matchMedia('(min-width: 768px)').matches) return;
if (!once('cps-open-toc')) return; // avoid duplicates
// only in article view
if (mw.config && !mw.config.get('wgIsArticle')) return;
// avoid duplicate buttons
if (!once('cps-open-toc')) return;
 
var root = getContentRoot();
 
// Build heading list and+ indices
var items = [];
var indexById = Object.create(null);
Line 208 ⟶ 187:
var level = parseInt(h.tagName.slice(1), 10);
if (level < 2 || level > 6) return;
var anchor = h.querySelector('.mw-headline[id]') || h; // works pre/post Heading-HTML changes :contentReference[oaicite:3]{index=3}
var id = anchor.id || h.id;
var text = (anchor.textContent || h.textContent || '').trim();
Line 217 ⟶ 196:
});
 
if (items.length < 3) return; // matchmirror core TOC threshold
 
// UI: trigger button
Line 240 ⟶ 219:
var header = document.createElement('div');
header.id = 'cps-toc-header';
header.innerHTML = '<h2 id="cps-toc-title">Contents</h2><button id="cps-toc-close" type="button" aria-label="Close">×</button>';
header.innerHTML =
'<h2 id="cps-toc-title">Contents</h2>' +
'<button id="cps-toc-close" type="button" aria-label="Close">×</button>';
 
var list = document.createElement('ul');
Line 262 ⟶ 239:
document.body.appendChild(overlay);
 
// openOpen/close overlay
var lastFocus = null;
function openOverlay() {
Line 269 ⟶ 246:
overlay.setAttribute('aria-hidden', 'false');
document.body.style.overflow = 'hidden';
var firstLinkfirst = list.querySelector('a');
if (firstLinkfirst) firstLinkfirst.focus({ preventScroll: true });
}
function closeOverlay() {
Line 278 ⟶ 255:
if (lastFocus && lastFocus.focus) lastFocus.focus({ preventScroll: true });
}
 
btn.style.display = 'flex';
btn.addEventListener('click', openOverlay);
Line 284 ⟶ 262:
overlay.addEventListener('keydown', function (e) { if (e.key === 'Escape') closeOverlay(); });
 
// parent H2 lookup
function parentH2For(id) {
var idx = indexById[id];
Line 292 ⟶ 269:
}
 
// navNAV: open parent H2 (forced if collapsedneeded), thenTHEN scroll to targetthe H3+ (or fallback to H2)target
list.addEventListener('click', function (e) {
var a = e.target && e.target.closest('a');
Line 302 ⟶ 279:
var level = li ? parseInt(li.getAttribute('data-level') || '0', 10) : 0;
 
closeOverlay(); // let layout settle first (iOS)
 
// H3+ — ensure its parent H2 is open first
if (level >= 3) {
var p = parentH2For(targetId);
Line 310 ⟶ 286:
var h2El = headingElById[p.id];
ensureH2Open(h2El).then(function () {
// Prefer the intended H3 anchor; if missing, fall back to H2 anchor if needed
var dest = document.getElementById(targetId) || anchorForHeadingEl(h2El) || h2El;
if (!dest) return;
Line 326 ⟶ 302:
}
 
// H2 (or no parent found): go straight todirect targetscroll
var hdest = document.getElementById(targetId) ||
(level === 2 ? anchorForHeadingEl(headingElById[targetId]) : null);
if (!hdest) return;
requestAnimationFrame(function () {
smoothScrollTo(hdest);
setTimeout(function () {
if (history && history.replaceState) history.replaceState(null, '', '#' + (hdest.id || targetId));
else location.hash = hdest.id || targetId;
}, 120);
});
});
 
// Hide/show triggerthe floating button on rotation
window.addEventListener('resize', function () {
if (window.matchMedia('(min-width: 768px)').matches) { btn.style.display = 'none'; closeOverlay(); }
Line 346 ⟶ 322:
}
 
/* ---------------- bootstrap ---------------- */
if (window.mw && mw.loader) {
// EnsureWait for MobileFrontend client pieces(sections/toggles are presentprovided beforeby weit). poke at headings/sections:contentReference[oaicite:4]{index=4}
mw.loader.using('mobile.startup').then(function () { /* MF site modules */
onReady(function () { if (isMobileSite()) initTOC(); });
if (mw.hook) mw.hook('wikipage.content').add(function () { if (isMobileSite()) initTOC(); /* re-run after SPA updates */});
if (isMobileSite()) initTOC();
});
});
} else {
Retrieved from "https://www.insurerbrain.com/wiki/MediaWiki:Mobile.js"