MediaWiki:Minerva.js: Unterschied zwischen den Versionen
Erscheinungsbild
Admin (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung Markierungen: Manuelle Zurücksetzung Zurückgesetzt |
Admin (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
| (11 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt) | |||
| Zeile 3: | Zeile 3: | ||
/* Weitere Menüs für MobileFrontend & MinervaNeue (Mobile Ansicht) */ | /* Weitere Menüs für MobileFrontend & MinervaNeue (Mobile Ansicht) */ | ||
(function () { | (function () { | ||
// Nur Mobile-Skin (Minerva) | |||
if (mw.config.get('skin') !== 'minerva') return; | if (mw.config.get('skin') !== 'minerva') return; | ||
const BLOCK_ID = 'ados-custom-links'; | |||
// --- KONFIG: Label + Seitentitel (werden mit mw.util.getUrl() sicher verlinkt) | // --- KONFIG: Label + Seitentitel (werden mit mw.util.getUrl() sicher verlinkt) | ||
// Header/Sektionen haben title = null | |||
// WICHTIG: "📊 Diagramm / Statistik" steht ganz oben | |||
const LINKS = [ | const LINKS = [ | ||
[' | ['📊 Diagramm / Statistik', null], | ||
['Abfüllungen pro Jahr', 'Abfüllungen_pro_Jahr'], | |||
// optional: | |||
// ['Top 5 – Community', 'Top_5'], | |||
['Hauptkategorien', null], | |||
['Alle A Dream of Scotland Abfüllungen', 'Kategorie:Alle A Dream of Scotland Abfüllungen'], | ['Alle A Dream of Scotland Abfüllungen', 'Kategorie:Alle A Dream of Scotland Abfüllungen'], | ||
['Alle A Dream of Ireland 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'], | ['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'], | ['Cigar Malt Übersicht', 'Kategorie:Cigar Malt Übersicht'], | ||
| Zeile 18: | Zeile 28: | ||
['Die Whisky Elfen Abfüllungen', 'Kategorie:Die Whisky Elfen 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 Fine Art of Whisky Abfüllungen', 'Kategorie:The Fine Art of Whisky Abfüllungen'], | ||
['The Forbidden Kingdom', 'Kategorie:The Forbidden Kingdom'] | ['The Forbidden Kingdom', 'Kategorie:The Forbidden Kingdom'], | ||
['Sonderabfüllungen', 'Kategorie:Sonderabfüllungen'] | |||
]; | ]; | ||
function findMenuList() { | function findMenuList() { | ||
| Zeile 31: | Zeile 40: | ||
document.querySelector('.menu') | document.querySelector('.menu') | ||
); | ); | ||
} | |||
function buildSectionsFromLinks(links) { | |||
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 }); | |||
} | |||
} | |||
return sections; | |||
} | } | ||
| Zeile 36: | Zeile 60: | ||
const host = findMenuList(); | const host = findMenuList(); | ||
if (!host) return false; | if (!host) return false; | ||
// | // schon eingebaut? | ||
if (document.getElementById(BLOCK_ID)) return true; | |||
const sections = buildSectionsFromLinks(LINKS); | |||
const | if (!sections.length) return false; | ||
const | // Container für alle Sektionen | ||
const container = document.createElement('div'); | |||
container.id = BLOCK_ID; | |||
sections.forEach((sec, idx) => { | |||
const secId = `${BLOCK_ID}-sec-${idx}`; | |||
// äußerer Block je Sektion | |||
const outer = document.createElement('ul'); | |||
outer.className = 'toggle-list__list'; | |||
// Header mit Icon + Toggle | |||
const | const headerLi = document.createElement('li'); | ||
headerLi.className = 'toggle-list-item'; | |||
const | 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); | ||
li.appendChild(a); | outer.appendChild(headerLi); | ||
// Unterpunkte-Liste (ohne Icons) | |||
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); | |||
}); | }); | ||
// nach der ersten vorhandenen UL einfügen (direkt unter Start/Zufällige Seite) | // nach der ersten vorhandenen UL einfügen (direkt unter Start/Zufällige Seite) | ||
const firstUl = host.querySelector('ul') || host; | const firstUl = host.querySelector('ul') || host; | ||
(firstUl.parentNode || host).insertBefore( | (firstUl.parentNode || host).insertBefore(container, firstUl.nextSibling); | ||
return true; | return true; | ||
| Zeile 105: | Zeile 141: | ||
// beim Laden probieren … | // beim Laden probieren … | ||
document.addEventListener('DOMContentLoaded', () => setTimeout(build, 0)); | document.addEventListener('DOMContentLoaded', () => setTimeout(build, 0)); | ||
// … und wenn das Burger-Menü dynamisch aufgebaut wird, nochmal | // … und wenn das Burger-Menü dynamisch aufgebaut wird, nochmal | ||
document.addEventListener('click', (e) => { | document.addEventListener('click', (e) => { | ||
| Zeile 114: | Zeile 151: | ||
} | } | ||
}); | }); | ||
// Fallback: Observer für lazy DOM | // Fallback: Observer für lazy DOM | ||
const obs = new MutationObserver(() => { if (build()) obs.disconnect(); }); | const obs = new MutationObserver(() => { if (build()) obs.disconnect(); }); | ||
obs.observe(document.documentElement, { childList: true, subtree: true }); | obs.observe(document.documentElement, { childList: true, subtree: 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); | |||
} | |||
})(); | })(); | ||
Aktuelle Version vom 21. Februar 2026, 19:33 Uhr
/* All JavaScript here will be loaded for users of the MinervaNeue skin */
/* Weitere Menüs für MobileFrontend & MinervaNeue (Mobile Ansicht) */
(function () {
// Nur Mobile-Skin (Minerva)
if (mw.config.get('skin') !== 'minerva') return;
const BLOCK_ID = 'ados-custom-links';
// --- KONFIG: Label + Seitentitel (werden mit mw.util.getUrl() sicher verlinkt)
// Header/Sektionen haben title = null
// WICHTIG: "📊 Diagramm / Statistik" steht ganz oben
const LINKS = [
['📊 Diagramm / Statistik', null],
['Abfüllungen pro Jahr', 'Abfüllungen_pro_Jahr'],
// optional:
// ['Top 5 – Community', 'Top_5'],
['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']
];
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 buildSectionsFromLinks(links) {
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 });
}
}
return sections;
}
function build() {
const host = findMenuList();
if (!host) return false;
// schon eingebaut?
if (document.getElementById(BLOCK_ID)) return true;
const sections = buildSectionsFromLinks(LINKS);
if (!sections.length) return false;
// Container für alle Sektionen
const container = document.createElement('div');
container.id = BLOCK_ID;
sections.forEach((sec, idx) => {
const secId = `${BLOCK_ID}-sec-${idx}`;
// äußerer Block je Sektion
const outer = document.createElement('ul');
outer.className = 'toggle-list__list';
// Header mit Icon + Toggle
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);
// Unterpunkte-Liste (ohne Icons)
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);
});
// nach der ersten vorhandenen UL einfügen (direkt unter Start/Zufällige Seite)
const firstUl = host.querySelector('ul') || host;
(firstUl.parentNode || host).insertBefore(container, firstUl.nextSibling);
return true;
}
// beim Laden probieren …
document.addEventListener('DOMContentLoaded', () => setTimeout(build, 0));
// … und wenn das Burger-Menü dynamisch aufgebaut wird, nochmal
document.addEventListener('click', (e) => {
const btn = e.target.closest('button, a');
if (!btn) return;
const s = (btn.className + ' ' + btn.id).toLowerCase();
if (s.includes('menu') || s.includes('hamburger') || s.includes('main-menu')) {
setTimeout(build, 250);
}
});
// Fallback: Observer für lazy DOM
const obs = new MutationObserver(() => { if (build()) obs.disconnect(); });
obs.observe(document.documentElement, { childList: true, subtree: 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);
}
})();