MediaWiki:Common.js: Difference between revisions

   Fixes for Minerva skin (mobile):

   /* ── 1. Inject CSS (runs before JS, beats inline styles) ── */

   function injectMinervaCSS() {

     if ( document.getElementById( 'gr-minerva-css' ) ) return;

     s.id = 'gr-minerva-css';

     s.textContent = [

       /* Kill body padding — readerToolbar sets it, we override */

       'body,#mw-mf-viewport,#mw-mf-page-center{padding-top:0!important;margin-top:0!important;}',

       'header.header-container{background:#b5451b!important;position:sticky!important;top:0!important;z-index:300!important;}',

       '.minerva-header{background:#b5451b!important;min-height:56px!important;display:flex!important;align-items:center!important;padding:0 12px!important;}',

       /* Hide Minerva header items we don't want */

      /* Keep: .navigation-drawer (hamburger), .branding-box (logo+name) */

      /* Hide: .search-toggle (search icon in header), language, notifications */

       '.minerva-header .search-toggle{display:none!important;}',

      '.minerva-header .minerva-user-notifications{display:none!important;}',

       /* Site name white */

       '.branding-box a{display:flex!important;align-items:center!important;text-decoration:none!important;flex-wrap:wrap!important;}',

       '.branding-box a span{color:#fff!important;font-size:17px!important;font-weight:700!important;font-family:system-ui,sans-serif!important;line-height:1.2!important;flex-shrink:1!important;}',

      '.branding-box a::before{content:"";display:inline-block;width:26px;height:26px;background:url("/favicon.png") center/contain no-repeat;margin-right:8px;flex-shrink:0;}',

       '.branding-box a::after{content:"A Digital Archive of Dvaita Vedanta Literature";display:block;flex-basis:100%;font-size:10px;color:rgba(255,255,255,0.82);font-family:sans-serif;width:100%;margin-top:1px;padding-left:34px;}',

       /* Hamburger icon white */

       '.navigation-drawer .toggle-list__toggle,.minerva-header label[for="main-menu-input"]{color:#fff!important;}',

       '.minerva-header svg path,.minerva-header svg rect,.minerva-header svg circle{fill:#fff!important;}',

       /* Hide the page/discussion tabs bar */

       '.page-actions-menu,.minerva-tabs,.minerva-page-actions,.post-content .page-actions,',

      '#page-secondary-actions,.last-modified-bar,.minerva-overflow-button,',

      '.toolbar,.page-actions,.mw-portlet-views,.minerva-anon-talk-link{display:none!important;}',

       /* Hide the icon bar (translate, watchlist, history, edit, more) */

      '.page-actions-menu{display:none!important;}',

      '.minerva-user-links{display:none!important;}',

      /* Hide ALL default drawer content — exact from HTML */

       '#mw-mf-page-left{display:none!important;}',

       '#gr-mob-extra-links{display:block!important;}',

       /* ReaderToolbar sticky below header */

       '#gr-static-bar{position:sticky!important;top:56px!important;z-index:200!important;order:0!important;}',

       /* Expand sections — CSS backup for hidden attribute */

       '[hidden="until-found"],[hidden]{',

      '  content-visibility:visible!important;',

      '.mf-section-10,.collapsible-block{display:block!important;visibility:visible!important;}',

      '.section-heading .indicator,.collapsible-heading .indicator{display:none!important;}',

      '.section-heading,.collapsible-heading{pointer-events:none!important;}',

       /* Home page — no x-scroll, single column cards */

       '.gr-home,body,#mw-mf-page-center{overflow-x:hidden!important;max-width:100vw!important;}',

      '.gr-home-grid{flex-direction:column!important;flex-wrap:nowrap!important;gap:12px!important;width:100%!important;overflow-x:hidden!important;}',

       '.gr-home-card{width:100%!important;max-width:100%!important;min-width:unset!important;box-sizing:border-box!important;flex:none!important;}',

       /* Content font */

       '.mw-parser-output{font-size:18px!important;line-height:1.8!important;}',

       '.mw-parser-output h2,.mw-parser-output .mw-heading2 h2{width:100%!important;}',

       '.mw-parser-output h3,.mw-parser-output .mw-heading3 h3{width:100%!important;}',

    ].join('');

     document.head.appendChild(s);

   /* ── 2. Remove hidden attribute from sections ── */

     document.querySelectorAll(

      '[class*="mf-section-"], .collapsible-block'

    ).forEach(function(el) {

      el.removeAttribute('hidden');

      el.style.setProperty('display', 'block', 'important');

      el.style.setProperty('visibility', 'visible', 'important');

      el.removeAttribute('aria-hidden');

    });

     document.querySelectorAll('.section-heading, .collapsible-heading').forEach(function(el) {

      el.setAttribute('aria-expanded', 'true');

      el.style.setProperty('pointer-events', 'none', 'important');

    });

   /* Persistent observer — MF re-adds hidden after we remove it */

   function watchAndExpand() {

     var timer = null;

     var obs = new MutationObserver(function(mutations) {

       var need = mutations.some(function(m) {

        return m.type === 'attributes' &&

          (m.attributeName === 'hidden' || m.attributeName === 'aria-hidden');

      });

      if (need) {

         clearTimeout(timer);

        timer = setTimeout(expandSections, 30);

     });

     var root = document.querySelector('#mw-content-text, #mw-mf-page-center, body');

     if (root) obs.observe(root, {subtree:true, attributes:true, attributeFilter:['hidden','aria-hidden','style']});

     var obs = new MutationObserver(function() {

       if (document.body.style.paddingTop && document.body.style.paddingTop !== '0px') {

     });

    obs.observe(document.body, {attributes:true, attributeFilter:['style']});

   /* ── 4. Hide Minerva page toolbar elements via JS ── */

   function hideMinervaChrome() {

     var selectors = [

      /* Page/Discussion tabs */

      '.minerva-tabs', '.page-actions-menu', '.page-actions',

      /* Icon toolbar (translate, watchlist, history, edit, more) */

      '#page-secondary-actions', '.toolbar',

      '.last-modified-bar',

      /* Overflow menu */

      '.minerva-overflow-button',

      });

    });

  /* ── 5. Hamburger menu: replace default items with custom ones ── */

  function setupHamburgerMenu() {

       We hook the checkbox that opens it. */

     var checkbox = document.getElementById('main-menu-input');

     if (!checkbox) return;

     function patchDrawer() {

      var pageLeft = document.getElementById('mw-mf-page-left');

      if ( pageLeft && !pageLeft.querySelector('#gr-mob-extra-links') ) {

        pageLeft.style.setProperty('display', 'none', 'important');

      var drawer = document.querySelector('.navigation-drawer');

       if (!drawer) return;

       if (drawer.querySelector('#gr-mob-extra-links')) return;

       document.querySelectorAll(

        '.mw-footer.minerva-footer, .footer-places, .footer-info, ' +

         '.minerva-footer-logo, #footer-places-about, ' +

        '#footer-places-disclaimers, #footer-places-privacy'

         el.style.setProperty('display', 'none', 'important');

       });

      var nav = document.createElement('div');

      nav.id = 'gr-mob-extra-links';

      nav.style.cssText = 'width:100%;background:#fff;';

      var ls = 'display:flex;align-items:center;gap:14px;padding:15px 20px;' +

              'font-size:16px;color:#2c1810;text-decoration:none;' +

 

      function item(href, emoji, label) {

        var a = document.createElement('a');

        a.href = href; a.style.cssText = ls;

         a.innerHTML = '<span style="font-size:20px;width:28px;text-align:center;flex-shrink:0">'

          + emoji + '</span><span>' + label + '</span>';

        a.onclick = function() {

          var cb = document.getElementById('main-menu-input');

          if (cb) cb.checked = false;

        };

      }

      nav.appendChild( item('/', '🏠', 'Home') );

 

      var userName = window.mw ? mw.config.get('wgUserName') : null;

 

      /* Also hide page-left in case it re-appeared */

      var pl = document.getElementById('mw-mf-page-left');

      if (pl) pl.style.setProperty('display','none','important');

 

       /* Hide About/Disclaimers that appear BELOW the drawer nav */

       setTimeout(function() {

        document.querySelectorAll(

          '.navigation-drawer .mw-portlet-footer, ' +

          '.navigation-drawer .footer, ' +

        ).forEach(function(el) {

          el.style.setProperty('display', 'none', 'important');

      }, 100);

     /* Patch immediately if drawer already exists */

     patchDrawer();

 

     checkbox.addEventListener('change', function() {

      if (checkbox.checked) setTimeout(patchDrawer, 50);

    });

   /* ── 6. Mobile TOC overlay (Contents button) ── */

   var _tocInit = false;

   function initMobileToc() {

     if (_tocInit) return;

     var tocList = document.querySelector('.vector-toc-contents, .vector-toc .vector-toc-list');

     if (!tocList) return;

     _tocInit = true;

     var bd = document.createElement('div');

     document.body.appendChild(bd);

     var panel = document.createElement('div');

     var hdr = document.createElement('div');

     var ttl = document.createElement('div');

     var cls = document.createElement('button');

     hdr.appendChild(ttl); hdr.appendChild(cls);

     panel.appendChild(hdr);

     var body = document.createElement('div');

     body.appendChild(tocList.cloneNode(true));

     panel.appendChild(body);

     document.body.appendChild(panel);

     var btn = document.createElement('button');

    btn.className = 'gr-mob-toc-btn';

     if (!hasItems) btn.style.display = 'none';

     document.body.appendChild(btn);

     btn.addEventListener('click', open);

    cls.addEventListener('click', close);

    bd.addEventListener('click', close);

     body.querySelectorAll('a').forEach(function(a){ a.addEventListener('click', close); });

   injectMinervaCSS();

   function onReady() {

     watchAndExpand();

     hideMinervaChrome();

 

     [100, 300, 700, 1500].forEach(function(ms) {

      setTimeout(expandSections, ms);

    });

 

    setTimeout(setupHamburgerMenu, 800);

     setTimeout(initMobileToc, 600);

   if (document.readyState === 'loading') {

     document.addEventListener('DOMContentLoaded', onReady);

     onReady();

   if (window.mw) {

     mw.hook('wikipage.content').add(function() {

       setTimeout(function() {

        expandSections();

        hideMinervaChrome();

        setupHamburgerMenu();

      }, 200);