Zum Inhalt springen

MediaWiki:Mobile.js

Aus ADOS Wiki

Hinweis: Leere nach dem Veröffentlichen den Browser-Cache, um die Änderungen sehen zu können.

  • Firefox/Safari: Umschalttaste drücken und gleichzeitig Aktualisieren anklicken oder entweder Strg+F5 oder Strg+R (⌘+R auf dem Mac) drücken
  • Google Chrome: Umschalttaste+Strg+R (⌘+Umschalttaste+R auf dem Mac) drücken
  • Edge: Strg+F5 drücken oder Strg drücken und gleichzeitig Aktualisieren anklicken
/**
 * Mobile: Alle Abschnitte automatisch ausklappen (Minerva/MobileFrontend)
 * Datei: MediaWiki:Mobile.js
 */
(function () {
  // Nur im Minerva (mobile) Skin laufen lassen
  var skin = mw.config.get('skin');
  if (skin !== 'minerva') return;

  function expandAllSectionsOnce() {
    var didSomething = false;

    // 1) Variante A: Über ARIA-Attribute (stabiler, versionsunabhängig)
    // Buttons/Headings, die Inhalte steuern und noch zugeklappt sind
    document.querySelectorAll('[aria-controls][aria-expanded="false"]').forEach(function (btn) {
      var id = btn.getAttribute('aria-controls');
      var panel = id && document.getElementById(id);
      if (panel) {
        btn.setAttribute('aria-expanded', 'true');
        // Häufige Klassen, die das Zuklappen steuern, entfernen
        btn.classList.remove('collapsed', 'mf-collapsible-button--collapsed');
        panel.classList.remove('collapsed', 'mf-collapsible-content--collapsed', 'mf-collapsible--collapsed');
        panel.style.display = ''; // falls per inline-style versteckt
        didSomething = true;
      }
    });

    // 2) Variante B: Falls MobileFrontend eigene Section-Headings nutzt
    // (z. B. .section-heading[aria-expanded], .collapsible-header, etc.)
    document.querySelectorAll('.section-heading, .collapsible-header, .mf-section-heading').forEach(function (heading) {
      var expanded = heading.getAttribute('aria-expanded');
      if (expanded === 'false') {
        // Am sichersten: Klick simulieren, damit interne Logik läuft
        heading.click();
        didSomething = true;
      }
      // Zusätzliche Absicherung
      heading.setAttribute('aria-expanded', 'true');
      heading.classList.remove('collapsed');
    });

    // 3) Bekannte Content-Container sichtbar schalten
    document.querySelectorAll(
      '.section-content, .content, .collapsible-block, .mf-collapsible-content'
    ).forEach(function (el) {
      // Nur wenn der Container direkt nach einer Heading-Struktur kommt oder collapsible ist
      if (
        el.previousElementSibling &&
        /section|collapsible|heading/i.test(el.previousElementSibling.className + '')
      ) {
        el.style.display = '';
        el.classList.remove('collapsed', 'mf-collapsible-content--collapsed');
      }
    });

    return didSomething;
  }

  function expandWithRetries() {
    // Sofort versuchen…
    var changed = expandAllSectionsOnce();
    // …und noch ein paar Mal nachlegen, falls MF/JS später bootet oder Lazy-Transforms kommen
    var tries = 0;
    var maxTries = 10;
    var interval = setInterval(function () {
      tries++;
      var did = expandAllSectionsOnce();
      if (tries >= maxTries || (!did && tries > 2)) {
        clearInterval(interval);
      }
    }, 300);
  }

  // Wenn MobileFrontend-Hooks vorhanden sind, darauf warten
  if (mw.hook) {
    // Häufiger Hook, wenn die mobile Seite „bereit“ ist
    mw.hook('mobileFrontend.pageReady').add(expandWithRetries);
  }

  // Fallback: nach DOMContentLoaded
  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', expandWithRetries);
  } else {
    expandWithRetries();
  }
})();