| Line 1: |
Line 1: |
| | /* Any JavaScript here will be loaded for users using the mobile site */ | | /* Any JavaScript here will be loaded for users using the mobile site */ |
| | mw.loader.using('mobile.site.styles'); | | mw.loader.using('mobile.site.styles'); |
| − |
| |
| − | /* Load an image header for every mobile page load. We can use siteNotice for this: */
| |
| − | document.getElementById('siteNotice').innerHTML = '<div style="padding: 10px;"><a href="https://www.kidzsearch.com"><img src="/w/siteImages/mwiki.png"></a></div>';
| |
| − |
| |
| − | /* Other JS: */
| |
| − | /* Force open sections and mw-collapsible; eagerly load media inside */
| |
| − | (function () {
| |
| − | function forceLoadIn(root) {
| |
| − | if (!root) return;
| |
| − |
| |
| − | // IMG & PICTURE sources (native lazy + data-* patterns)
| |
| − | var imgs = root.querySelectorAll('img, picture source');
| |
| − | imgs.forEach(function (el) {
| |
| − | try {
| |
| − | var tag = el.tagName.toLowerCase();
| |
| − | var img = tag === 'img' ? el : null;
| |
| − |
| |
| − | ['src', 'srcset', 'sizes'].forEach(function (k) {
| |
| − | var dk = 'data-' + k;
| |
| − | if (el.hasAttribute && el.hasAttribute(dk)) {
| |
| − | el.setAttribute(k, el.getAttribute(dk));
| |
| − | el.removeAttribute(dk);
| |
| − | }
| |
| − | if (img && img.dataset && img.dataset[k]) {
| |
| − | img[k] = img.dataset[k];
| |
| − | }
| |
| − | });
| |
| − |
| |
| − | if (img) {
| |
| − | try { img.loading = 'eager'; } catch (e) {}
| |
| − | try { img.decoding = 'sync'; } catch (e) {}
| |
| − | var s = img.currentSrc || img.src;
| |
| − | if (s) { img.src = ''; img.src = s; } // nudge reload if it was idle
| |
| − | }
| |
| − | } catch (e) {}
| |
| − | });
| |
| − |
| |
| − | // Background images deferred via data-bg
| |
| − | root.querySelectorAll('[data-bg]').forEach(function (el) {
| |
| − | var bg = el.getAttribute('data-bg');
| |
| − | if (bg) {
| |
| − | el.style.backgroundImage = 'url("' + bg + '")';
| |
| − | el.removeAttribute('data-bg');
| |
| − | }
| |
| − | });
| |
| − |
| |
| − | // Videos (mobile often sets preload="none")
| |
| − | root.querySelectorAll('video').forEach(function (v) {
| |
| − | try {
| |
| − | if (v.getAttribute('preload') === 'none') v.setAttribute('preload', 'metadata');
| |
| − | if (v.dataset && v.dataset.poster && !v.poster) v.poster = v.dataset.poster;
| |
| − | v.load();
| |
| − | } catch (e) {}
| |
| − | });
| |
| − | }
| |
| − |
| |
| − | function openMFSection(el) {
| |
| − | if (!el) return;
| |
| − | el.classList.add('open-block');
| |
| − | el.classList.remove('collapsed');
| |
| − | el.setAttribute('aria-expanded', 'true');
| |
| − | (el.querySelector('.collapsible-block-content, .mf-collapsible-content, .section-content') || el)
| |
| − | .style.display = 'block';
| |
| − | forceLoadIn(el);
| |
| − | }
| |
| − |
| |
| − | function openAll() {
| |
| − | // MobileFrontend sections
| |
| − | document.querySelectorAll('.mf-section, .collapsible-block, .mf-collapsible-block, .mobile-collapse')
| |
| − | .forEach(openMFSection);
| |
| − |
| |
| − | // Core mw-collapsible (templates/navboxes)
| |
| − | document.querySelectorAll('.mw-collapsible').forEach(function (el) {
| |
| − | el.classList.remove('mw-collapsed');
| |
| − | var c = el.querySelector('.mw-collapsible-content');
| |
| − | if (c) c.style.display = 'block';
| |
| − | forceLoadIn(el);
| |
| − | });
| |
| − | }
| |
| − |
| |
| − | function neutralizeToggles() {
| |
| − | // Remove heading click handlers that re-collapse
| |
| − | document.querySelectorAll('.section-heading, .mf-section-heading, .toc-mobile__section-heading, h2, h3, h4')
| |
| − | .forEach(function (h) {
| |
| − | var clone = h.cloneNode(true);
| |
| − | h.parentNode && h.parentNode.replaceChild(clone, h);
| |
| − | });
| |
| − |
| |
| − | // Disable core mw-collapsible toggles
| |
| − | document.querySelectorAll('.mw-collapsible .mw-collapsible-toggle, .mw-collapsible .mw-collapsible-button')
| |
| − | .forEach(function (t) {
| |
| − | var c = t.cloneNode(true);
| |
| − | c.addEventListener('click', function (e) { e.stopImmediatePropagation(); e.preventDefault(); }, true);
| |
| − | t.parentNode && t.parentNode.replaceChild(c, t);
| |
| − | });
| |
| − | }
| |
| − |
| |
| − | function init() {
| |
| − | neutralizeToggles();
| |
| − | openAll();
| |
| − |
| |
| − | // Keep overriding as MF/core mutate DOM
| |
| − | var mo = new MutationObserver(function () {
| |
| − | neutralizeToggles();
| |
| − | openAll();
| |
| − | });
| |
| − | mo.observe(document.documentElement, { childList: true, subtree: true, attributes: true });
| |
| − | }
| |
| − |
| |
| − | if (document.readyState === 'loading') {
| |
| − | document.addEventListener('DOMContentLoaded', init);
| |
| − | } else {
| |
| − | init();
| |
| − | }
| |
| − |
| |
| − | // Also eagerly load the lead
| |
| − | var lead = document.querySelector('#mf-section-0, .lead, #bodyContent, .content');
| |
| − | if (lead) forceLoadIn(lead);
| |
| − | })();
| |