MediaWiki:Common.js: Difference between revisions

From SZ
Jump to navigation Jump to search
No edit summary
Tag: Reverted
No edit summary
 
(16 intermediate revisions by the same user not shown)
Line 1: Line 1:
* Collapsible sidebar sections for MW 1.44 (Vector & Vector 2022) List the exact section keys from MediaWiki:Sidebar here: */ var COLLAPSIBLE_SECTIONS = [ 'book1', 'book2' ]; /* Default open/closed; set true to open by default */ var DEFAULT_OPEN = false; function initCollapsiblePortlet(name) { var portal = document.getElementById('p-' + name); if (!portal) return; // Choose heading/content across skins var heading = portal.querySelector('.vector-menu-heading') || portal.querySelector('h3'); var content = portal.querySelector('.vector-menu-content') || portal.querySelector('.body'); if (!heading || !content) return; portal.classList.add('mw-custom-collapsible'); // State from storage var storageKey = 'mwSidebar:' + name; var stored = null; try { stored = localStorage.getItem(storageKey); } catch (e) {} var isOpen = stored === null ? DEFAULT_OPEN : stored === '1'; function setState(open) { portal.classList.toggle('is-open', open); heading.setAttribute('aria-expanded', open ? 'true' : 'false'); content.style.display = open ? '' : 'none'; try { localStorage.setItem(storageKey, open ? '1' : '0'); } catch (e) {} } // A11y & interactions heading.setAttribute('role', 'button'); heading.setAttribute('tabindex', '0'); heading.addEventListener('click', function () { setState(!portal.classList.contains('is-open')); }); heading.addEventListener('keydown', function (e) { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); setState(!portal.classList.contains('is-open')); } }); setState(isOpen); } function bootCollapsibleSidebars() { COLLAPSIBLE_SECTIONS.forEach(initCollapsiblePortlet); } // Run on load and on SPA-like updates if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', bootCollapsibleSidebars); } else { bootCollapsibleSidebars(); } mw.hook('wikipage.content').add(bootCollapsibleSidebars);
/**
* Collapsible Sidebar (Debug Build) - Patched for Vector & Vector 2022
* Logs everything to console for verification
*/
 
/*
$(function () {
    // Add toggle link
    var $sidebar = $('#mw-panel');
    var $toggleLink = $('<a href="#" id="collapse-sidebar">Toggle Sidebar</a>')
        .css({ display: 'block', margin: '5px', cursor: 'pointer' });
 
    $('#p-logo').after($toggleLink);
 
    $toggleLink.click(function (e) {
        e.preventDefault();
        $sidebar.toggleClass('collapsed');
    });
});
*/
 
/*
 
(function () {
  window.MWSidebarDebug = true;
 
  function log() {
    if (window.MWSidebarDebug) console.log('[SidebarCollapsible]', ...arguments);
  }
  function warn() {
    if (window.MWSidebarDebug) console.warn('[SidebarCollapsible]', ...arguments);
  }
 
  var skin = mw.config.get('skin');
  log('Init start. Detected skin =', skin);
 
  function findPanels($root) {
    // Match both Vector and Vector 2022 classes
    var $panels = $root.find('#mw-panel .vector-menu-portal, #mw-panel .vector-menu.mw-portlet');
    log('Panels found:', $panels.length);
    return $panels;
  }
 
  function initOnce($root) {
    var $panels = findPanels($root);
 
    if (!$panels.length) {
      warn('No sidebar panels found using selectors for Vector/Vector-2022');
      return;
    }
 
    $panels.each(function (idx, el) {
      var $panel = $(el);
      var id = $panel.attr('id') || ('panel#' + idx);
      var $list = $panel.find('> .vector-menu-content > .vector-menu-content-list, > .body > ul').first();
 
      if (!$list.length) {
        warn('No list in panel:', id);
        return;
      }
 
      var $items = $list.children('li');
      log('Panel', id, ':', $items.length, 'top-level item(s)');
 
      $items.each(function (i, li) {
        var $li = $(li);
        var $sub = $li.children('ul');
        if (!$sub.length) return;
 
        $li.addClass('collapsible-header');
        if (!$li.children('.mw-collapsible-arrow').length) {
          $li.prepend($('<span class="mw-collapsible-arrow" aria-hidden="true">▶</span>'));
        }
        $sub.hide();
 
        var headerText = ($li.find('> a').first().text() || '').trim();
        log('Registered collapsible item', i, 'in', id, 'header=', headerText);
 
        $li.off('.mwCollapsibleSidebar')
          .on('click.mwCollapsibleSidebar', function (e) {
            if ($(e.target).closest('a').length) return;
            e.preventDefault();
            $li.toggleClass('open');
            $sub.stop(true, true).slideToggle(200);
            log('Toggled', $li.hasClass('open') ? 'open' : 'closed', ':', headerText);
          });
      });
    });
  }
 
  mw.loader.using('mediawiki.util').then(function () {
    $(function () {
      console.group && console.group('[SidebarCollapsible] bootstrap');
      initOnce($(document));
      console.groupEnd && console.groupEnd();
    });
    mw.hook('wikipage.content').add(function ($c) {
      log('wikipage.content hook fired (re-init on dynamic content).');
      initOnce($c);
    });
  });
 
 
})();
 
*/

Latest revision as of 15:29, 26 August 2025

/**
 * Collapsible Sidebar (Debug Build) - Patched for Vector & Vector 2022
 * Logs everything to console for verification
 */

/*
$(function () {
    // Add toggle link
    var $sidebar = $('#mw-panel');
    var $toggleLink = $('<a href="#" id="collapse-sidebar">Toggle Sidebar</a>')
        .css({ display: 'block', margin: '5px', cursor: 'pointer' });

    $('#p-logo').after($toggleLink);

    $toggleLink.click(function (e) {
        e.preventDefault();
        $sidebar.toggleClass('collapsed');
    });
});
*/

/*

(function () {
  window.MWSidebarDebug = true;

  function log() {
    if (window.MWSidebarDebug) console.log('[SidebarCollapsible]', ...arguments);
  }
  function warn() {
    if (window.MWSidebarDebug) console.warn('[SidebarCollapsible]', ...arguments);
  }

  var skin = mw.config.get('skin');
  log('Init start. Detected skin =', skin);

  function findPanels($root) {
    // Match both Vector and Vector 2022 classes
    var $panels = $root.find('#mw-panel .vector-menu-portal, #mw-panel .vector-menu.mw-portlet');
    log('Panels found:', $panels.length);
    return $panels;
  }

  function initOnce($root) {
    var $panels = findPanels($root);

    if (!$panels.length) {
      warn('No sidebar panels found using selectors for Vector/Vector-2022');
      return;
    }

    $panels.each(function (idx, el) {
      var $panel = $(el);
      var id = $panel.attr('id') || ('panel#' + idx);
      var $list = $panel.find('> .vector-menu-content > .vector-menu-content-list, > .body > ul').first();

      if (!$list.length) {
        warn('No list in panel:', id);
        return;
      }

      var $items = $list.children('li');
      log('Panel', id, ':', $items.length, 'top-level item(s)');

      $items.each(function (i, li) {
        var $li = $(li);
        var $sub = $li.children('ul');
        if (!$sub.length) return;

        $li.addClass('collapsible-header');
        if (!$li.children('.mw-collapsible-arrow').length) {
          $li.prepend($('<span class="mw-collapsible-arrow" aria-hidden="true">▶</span>'));
        }
        $sub.hide();

        var headerText = ($li.find('> a').first().text() || '').trim();
        log('Registered collapsible item', i, 'in', id, 'header=', headerText);

        $li.off('.mwCollapsibleSidebar')
          .on('click.mwCollapsibleSidebar', function (e) {
            if ($(e.target).closest('a').length) return;
            e.preventDefault();
            $li.toggleClass('open');
            $sub.stop(true, true).slideToggle(200);
            log('Toggled', $li.hasClass('open') ? 'open' : 'closed', ':', headerText);
          });
      });
    });
  }

  mw.loader.using('mediawiki.util').then(function () {
    $(function () {
      console.group && console.group('[SidebarCollapsible] bootstrap');
      initOnce($(document));
      console.groupEnd && console.groupEnd();
    });
    mw.hook('wikipage.content').add(function ($c) {
      log('wikipage.content hook fired (re-init on dynamic content).');
      initOnce($c);
    });
  });


})();

*/