MediaWiki:Minerva.js: Unterschied zwischen den Versionen
Admin (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung Markierung: Zurückgesetzt |
Admin (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung Markierung: Zurückgesetzt |
||
| Zeile 40: | Zeile 40: | ||
} | } | ||
function build() { | |||
const host = findMenuList(); | |||
if (!host) return false; | |||
// Block schon eingebaut? | |||
if (document.getElementById(BLOCK_ID)) return true; | |||
// Container für alle Sektionen | |||
const container = document.createElement('div'); | |||
container.id = BLOCK_ID; | |||
// LINKS in Sektionen aufteilen: jeder Header (title=null) startet neue Sektion | |||
const sections = []; | |||
let current = null; | |||
for (const [label, title] of LINKS) { | |||
if (title === null) { | |||
current = { header: label, items: [] }; | |||
sections.push(current); | |||
} else if (current) { | |||
current.items.push({ label, title }); | |||
} | |||
} | |||
// Sektionen bauen | |||
sections.forEach((sec, idx) => { | |||
const secId = `${BLOCK_ID}-sec-${idx}`; | |||
const outer = document.createElement('ul'); | const outer = document.createElement('ul'); | ||
outer.className = 'toggle-list__list'; | outer.className = 'toggle-list__list'; | ||
// Header | // Header | ||
const headerLi = document.createElement('li'); | const headerLi = document.createElement('li'); | ||
headerLi.className = 'toggle-list-item'; | headerLi.className = 'toggle-list-item'; | ||
| Zeile 61: | Zeile 81: | ||
headerBtn.innerHTML = | headerBtn.innerHTML = | ||
'<span class="minerva-icon minerva-icon--listBullet"></span>' + | '<span class="minerva-icon minerva-icon--listBullet"></span>' + | ||
`<span class="toggle-list-item__label">${ | `<span class="toggle-list-item__label">${sec.header}</span>`; | ||
headerLi.appendChild(headerBtn); | headerLi.appendChild(headerBtn); | ||
outer.appendChild(headerLi); | outer.appendChild(headerLi); | ||
// | // Inner list | ||
const inner = document.createElement('ul'); | const inner = document.createElement('ul'); | ||
inner.className = 'toggle-list__list'; | inner.className = 'toggle-list__list'; | ||
inner.style.marginLeft = '10px'; | inner.style.marginLeft = '10px'; | ||
sec.items.forEach(({ label, title }) => { | |||
const li = document.createElement('li'); | const li = document.createElement('li'); | ||
li.className = 'toggle-list-item'; | li.className = 'toggle-list-item'; | ||
| Zeile 79: | Zeile 98: | ||
a.className = 'toggle-list-item__anchor'; | a.className = 'toggle-list-item__anchor'; | ||
a.textContent = label; | a.textContent = label; | ||
a.href = | a.href = mw.util.getUrl(title); | ||
li.appendChild(a); | li.appendChild(a); | ||
inner.appendChild(li); | inner.appendChild(li); | ||
} | }); | ||
outer.appendChild(inner); | outer.appendChild(inner); | ||
// Toggle-Logik | // Toggle-Logik pro Sektion | ||
headerBtn.addEventListener('click', function () { | headerBtn.addEventListener('click', function () { | ||
const expanded = this.getAttribute('aria-expanded') === 'true'; | const expanded = this.getAttribute('aria-expanded') === 'true'; | ||
this.setAttribute('aria-expanded', String(!expanded)); | this.setAttribute('aria-expanded', String(!expanded)); | ||
inner.style.display = expanded ? 'none' : ''; | inner.style.display = expanded ? 'none' : ''; | ||
try { localStorage.setItem( | try { localStorage.setItem(secId + ':collapsed', expanded ? '1' : '0'); } catch (e) {} | ||
}); | }); | ||
// Zustand wiederherstellen | // Zustand wiederherstellen | ||
try { | try { | ||
if (localStorage.getItem( | if (localStorage.getItem(secId + ':collapsed') === '1') { | ||
headerBtn.setAttribute('aria-expanded', 'false'); | headerBtn.setAttribute('aria-expanded', 'false'); | ||
inner.style.display = 'none'; | inner.style.display = 'none'; | ||
| Zeile 103: | Zeile 122: | ||
} catch (e) {} | } catch (e) {} | ||
container.appendChild(outer); | |||
}); | |||
// Einfügen (wie bei dir: direkt nach erster UL) | |||
const firstUl = host.querySelector('ul') || host; | |||
(firstUl.parentNode || host).insertBefore(container, firstUl.nextSibling); | |||
return true; | |||
} | |||
} | |||
Version vom 21. Februar 2026, 19:30 Uhr
/* All JavaScript here will be loaded for users of the MinervaNeue skin */
/* Weitere Menüs für MobileFrontend & MinervaNeue (Mobile Ansicht) */
(function () {
if (mw.config.get('skin') !== 'minerva') return;
// --- KONFIG: Label + Seitentitel (werden mit mw.util.getUrl() sicher verlinkt)
const LINKS = [
['Hauptkategorien', null],
['Alle A Dream of Scotland Abfüllungen', 'Kategorie:Alle A Dream of Scotland Abfüllungen'],
['Alle A Dream of Ireland Abfüllungen', 'Kategorie:Alle A Dream of Ireland Abfüllungen'],
['Alle A Dream of... – Der Rest der Welt', 'Kategorie:Alle A Dream of... – Der Rest der Welt Abfüllungen'],
['Cigar Malt Übersicht', 'Kategorie:Cigar Malt Übersicht'],
['Alle Rumbastic Abfüllungen', 'Kategorie:Alle Rumbastic Abfüllungen'],
['The Tasteful 8', 'Kategorie:The Tasteful 8'],
['Còmhlan Abfüllungen', 'Kategorie:Còmhlan Abfüllungen'],
['Friendly Mr. Z Whiskytainment Abfüllungen', 'Kategorie:Friendly Mr. Z Whiskytainment Abfüllungen'],
['Die Whisky Elfen Abfüllungen', 'Kategorie:Die Whisky Elfen Abfüllungen'],
['The Fine Art of Whisky Abfüllungen', 'Kategorie:The Fine Art of Whisky Abfüllungen'],
['The Forbidden Kingdom', 'Kategorie:The Forbidden Kingdom'],
['Sonderabfüllungen', 'Kategorie:Sonderabfüllungen'],
// --- NEUER REITER / SEKTION ---
['📊 Diagramm / Statistik', null],
['Abfüllungen pro Jahr', 'Abfüllungen_pro_Jahr'],
// optional später:
// ['Top 5 – Community', 'Top_5'],
];
const BLOCK_ID = 'ados-custom-links';
function findMenuList() {
return (
document.querySelector('#mw-mf-main-menu nav ul') ||
document.querySelector('#mw-mf-main-menu ul') ||
document.querySelector('.minerva-main-menu .menu__list') ||
document.querySelector('.menu__list') ||
document.querySelector('.menu')
);
}
function build() {
const host = findMenuList();
if (!host) return false;
// Block schon eingebaut?
if (document.getElementById(BLOCK_ID)) return true;
// Container für alle Sektionen
const container = document.createElement('div');
container.id = BLOCK_ID;
// LINKS in Sektionen aufteilen: jeder Header (title=null) startet neue Sektion
const sections = [];
let current = null;
for (const [label, title] of LINKS) {
if (title === null) {
current = { header: label, items: [] };
sections.push(current);
} else if (current) {
current.items.push({ label, title });
}
}
// Sektionen bauen
sections.forEach((sec, idx) => {
const secId = `${BLOCK_ID}-sec-${idx}`;
const outer = document.createElement('ul');
outer.className = 'toggle-list__list';
// Header
const headerLi = document.createElement('li');
headerLi.className = 'toggle-list-item';
const headerBtn = document.createElement('button');
headerBtn.type = 'button';
headerBtn.className = 'toggle-list-item__anchor';
headerBtn.setAttribute('aria-expanded', 'true');
headerBtn.innerHTML =
'<span class="minerva-icon minerva-icon--listBullet"></span>' +
`<span class="toggle-list-item__label">${sec.header}</span>`;
headerLi.appendChild(headerBtn);
outer.appendChild(headerLi);
// Inner list
const inner = document.createElement('ul');
inner.className = 'toggle-list__list';
inner.style.marginLeft = '10px';
sec.items.forEach(({ label, title }) => {
const li = document.createElement('li');
li.className = 'toggle-list-item';
const a = document.createElement('a');
a.className = 'toggle-list-item__anchor';
a.textContent = label;
a.href = mw.util.getUrl(title);
li.appendChild(a);
inner.appendChild(li);
});
outer.appendChild(inner);
// Toggle-Logik pro Sektion
headerBtn.addEventListener('click', function () {
const expanded = this.getAttribute('aria-expanded') === 'true';
this.setAttribute('aria-expanded', String(!expanded));
inner.style.display = expanded ? 'none' : '';
try { localStorage.setItem(secId + ':collapsed', expanded ? '1' : '0'); } catch (e) {}
});
// Zustand wiederherstellen
try {
if (localStorage.getItem(secId + ':collapsed') === '1') {
headerBtn.setAttribute('aria-expanded', 'false');
inner.style.display = 'none';
}
} catch (e) {}
container.appendChild(outer);
});
// Einfügen (wie bei dir: direkt nach erster UL)
const firstUl = host.querySelector('ul') || host;
(firstUl.parentNode || host).insertBefore(container, firstUl.nextSibling);
return true;
}
// ----------Abschnitte Geöffnet-----------
/* Minerva: Alle Abschnitte automatisch ausklappen */
(function () {
if (!window.mw) return;
if (mw.config.get('skin') !== 'minerva') return;
function expandAll() {
// 1) Alle Toggle-Buttons, die noch "zu" sind, anklicken
document.querySelectorAll('button.section-toggle[aria-expanded="false"], [data-event-name="section-toggle"][aria-expanded="false"]').forEach(function (btn) {
try { btn.click(); } catch(e) {}
});
// 2) Sicherheitsgurt: typische Inhalts-Container sichtbar erzwingen
document.querySelectorAll('.collapsible-block, .mf-section-contents, .section-content').forEach(function (el) {
el.style.display = 'block';
el.hidden = false;
el.classList.add('open-block');
el.classList.remove('collapsed');
});
}
// Beim Rendern und bei dynamischen Änderungen erneut ausführen
function init() {
expandAll();
// Nochmal kurz nach Seitenaufbau und nach spätem JS
setTimeout(expandAll, 50);
setTimeout(expandAll, 400);
}
if (mw.loader && mw.loader.using) {
mw.loader.using(['mobile.init']).always(function () {
if (mw.hook) mw.hook('wikipage.content').add(init);
init();
});
} else {
document.addEventListener('DOMContentLoaded', init);
}
})();