MediaWiki:Common.js: Unterschied zwischen den Versionen
Keine Bearbeitungszusammenfassung |
Keine Bearbeitungszusammenfassung |
||
| Zeile 1: | Zeile 1: | ||
/* Das folgende JavaScript wird für alle Benutzer geladen. */ | /* Das folgende JavaScript wird für alle Benutzer geladen. */ | ||
/* | /* ==== Sidebar: klickbare Kopfzeile + Gruppen mit Auf/Zu (Vector-2022) ==== */ | ||
(function () { | |||
if (mw.config.get('skin') !== 'vector-2022') return; | |||
if ( mw.config.get('skin') !== 'vector-2022' ) return; | |||
var | function extractDirective(a) { | ||
if (!a) return null; | |||
var href = a.getAttribute('href') || ''; | |||
// Hash robust ermitteln (funktioniert auch bei /wiki/…#group:…) | |||
try { href = new URL(href, location.href).hash || ''; } catch (e) {} | |||
var s = href.trim().toLowerCase(); | |||
if (s.indexOf('#group:') >= 0) return { kind: 'group', value: decodeURIComponent(s.split('#group:').pop()) }; | |||
if (s.indexOf('#link:') >= 0) return { kind: 'link', value: decodeURIComponent(s.split('#link:').pop()) }; | |||
return null; | |||
} | |||
function | function makeHead(li, keepLink) { | ||
// Kopf: [Pfeil] [Link- oder Textlabel] | |||
var a = li.querySelector(':scope > a'); | |||
var head = document.createElement('div'); | |||
head.className = 'kr-head'; | |||
var btn = document.createElement('button'); | |||
btn.type = 'button'; | |||
btn.className = 'kr-arrow'; | |||
btn.setAttribute('aria-expanded', 'true'); | |||
head.appendChild(btn); | |||
if (keepLink) { | |||
// klickbarer Link als Titel | |||
head.appendChild(a); | |||
} else { | |||
// Nur Text (kein Link) | |||
var span = document.createElement('span'); | |||
span.className = 'kr-title'; | |||
span.textContent = (a && a.textContent) || ''; | |||
head.appendChild(span); | |||
if (a) a.remove(); // Link entfernen | |||
} | |||
li.insertBefore(head, li.firstChild); | |||
return head; | |||
} | } | ||
function buildGroups(ul) { | |||
var lis = Array.from(ul.querySelectorAll(':scope > li.mw-list-item')); | |||
var currentGroup = null; | |||
lis.forEach(function (li) { | |||
var a = li.querySelector(':scope > a'); | |||
var d = extractDirective(a); | |||
if (d && d.kind === 'group') { | |||
// Gruppen-Header (ohne Link), eigener Container + Unterliste | |||
li.classList.add('kr-group'); | |||
makeHead(li, false); | |||
var sub = document.createElement('ul'); | |||
sub.className = 'kr-sub'; | |||
li.appendChild(sub); | |||
currentGroup = sub; | |||
// Direktiven-Link ausblenden (falls noch da) | |||
if (a) a.removeAttribute('href'); | |||
return; | |||
} | |||
// Normale Elemente wandern in die aktuelle Gruppe (falls vorhanden) | |||
} | if (currentGroup && !(d && (d.kind === 'group' || d.kind === 'link'))) { | ||
currentGroup.appendChild(li); | |||
} | |||
}); | |||
// Auf/Zu: Delegation auf den UL | |||
// | ul.addEventListener('click', function (e) { | ||
var t = e.target; | |||
if (t.classList.contains('kr-arrow')) { | |||
var li = t.closest('li.kr-group, li.kr-top'); | |||
if (li) { | |||
var collapsed = li.classList.toggle('is-collapsed'); | |||
t.setAttribute('aria-expanded', collapsed ? 'false' : 'true'); | |||
} | |||
} | |||
}); | }); | ||
} | } | ||
function buildPortlets(root) { | |||
// Alle Portlet-Listen (Vector 2022) | |||
var lists = root.querySelectorAll('#mw-panel .vector-menu-content-list'); | |||
lists.forEach(function (ul) { | |||
// 1. Kopf-Link (#link:...) als „Top“-Kopf mit Auf/Zu über den Rest | |||
var items = Array.from(ul.querySelectorAll(':scope > li.mw-list-item')); | |||
var topIdx = items.findIndex(function (li) { | |||
var a = li.querySelector(':scope > a'); | |||
var d = extractDirective(a); | |||
return d && d.kind === 'link'; | |||
}); | |||
if (topIdx >= 0) { | |||
var top = items[topIdx]; | |||
top.classList.add('kr-top'); | |||
makeHead(top, true); | |||
// Unterliste unterhalb der Kopfzeile, alle nachfolgenden Elemente rein | |||
var sub = document.createElement('ul'); | |||
sub.className = 'kr-sub'; | |||
top.appendChild(sub); | |||
// Alle Listeneinträge NACH dem Top-Link in die Unterliste verschieben | |||
for (var i = topIdx + 1; i < items.length; i++) { | |||
sub.appendChild(items[i]); | |||
} | |||
// Innerhalb der Unterliste Gruppen (#group:...) bauen | |||
buildGroups(sub); | |||
} else { | |||
// Kein #link: – wir bauen Gruppen direkt in der Wurzel | |||
buildGroups(ul); | |||
} | |||
}); | |||
} | |||
function init() { | |||
var panel = document.getElementById('mw-panel'); | |||
if (!panel) return; | |||
panel.classList.add('kr-sb'); | |||
buildPortlets(panel); | |||
} | |||
// Sofort & bei Ajax-Nachladungen | |||
mw.hook('wikipage.content').add(init); | |||
init(); | |||
})(); | |||
Version vom 10. Oktober 2025, 13:29 Uhr
/* Das folgende JavaScript wird für alle Benutzer geladen. */
/* ==== Sidebar: klickbare Kopfzeile + Gruppen mit Auf/Zu (Vector-2022) ==== */
(function () {
if (mw.config.get('skin') !== 'vector-2022') return;
function extractDirective(a) {
if (!a) return null;
var href = a.getAttribute('href') || '';
// Hash robust ermitteln (funktioniert auch bei /wiki/…#group:…)
try { href = new URL(href, location.href).hash || ''; } catch (e) {}
var s = href.trim().toLowerCase();
if (s.indexOf('#group:') >= 0) return { kind: 'group', value: decodeURIComponent(s.split('#group:').pop()) };
if (s.indexOf('#link:') >= 0) return { kind: 'link', value: decodeURIComponent(s.split('#link:').pop()) };
return null;
}
function makeHead(li, keepLink) {
// Kopf: [Pfeil] [Link- oder Textlabel]
var a = li.querySelector(':scope > a');
var head = document.createElement('div');
head.className = 'kr-head';
var btn = document.createElement('button');
btn.type = 'button';
btn.className = 'kr-arrow';
btn.setAttribute('aria-expanded', 'true');
head.appendChild(btn);
if (keepLink) {
// klickbarer Link als Titel
head.appendChild(a);
} else {
// Nur Text (kein Link)
var span = document.createElement('span');
span.className = 'kr-title';
span.textContent = (a && a.textContent) || '';
head.appendChild(span);
if (a) a.remove(); // Link entfernen
}
li.insertBefore(head, li.firstChild);
return head;
}
function buildGroups(ul) {
var lis = Array.from(ul.querySelectorAll(':scope > li.mw-list-item'));
var currentGroup = null;
lis.forEach(function (li) {
var a = li.querySelector(':scope > a');
var d = extractDirective(a);
if (d && d.kind === 'group') {
// Gruppen-Header (ohne Link), eigener Container + Unterliste
li.classList.add('kr-group');
makeHead(li, false);
var sub = document.createElement('ul');
sub.className = 'kr-sub';
li.appendChild(sub);
currentGroup = sub;
// Direktiven-Link ausblenden (falls noch da)
if (a) a.removeAttribute('href');
return;
}
// Normale Elemente wandern in die aktuelle Gruppe (falls vorhanden)
if (currentGroup && !(d && (d.kind === 'group' || d.kind === 'link'))) {
currentGroup.appendChild(li);
}
});
// Auf/Zu: Delegation auf den UL
ul.addEventListener('click', function (e) {
var t = e.target;
if (t.classList.contains('kr-arrow')) {
var li = t.closest('li.kr-group, li.kr-top');
if (li) {
var collapsed = li.classList.toggle('is-collapsed');
t.setAttribute('aria-expanded', collapsed ? 'false' : 'true');
}
}
});
}
function buildPortlets(root) {
// Alle Portlet-Listen (Vector 2022)
var lists = root.querySelectorAll('#mw-panel .vector-menu-content-list');
lists.forEach(function (ul) {
// 1. Kopf-Link (#link:...) als „Top“-Kopf mit Auf/Zu über den Rest
var items = Array.from(ul.querySelectorAll(':scope > li.mw-list-item'));
var topIdx = items.findIndex(function (li) {
var a = li.querySelector(':scope > a');
var d = extractDirective(a);
return d && d.kind === 'link';
});
if (topIdx >= 0) {
var top = items[topIdx];
top.classList.add('kr-top');
makeHead(top, true);
// Unterliste unterhalb der Kopfzeile, alle nachfolgenden Elemente rein
var sub = document.createElement('ul');
sub.className = 'kr-sub';
top.appendChild(sub);
// Alle Listeneinträge NACH dem Top-Link in die Unterliste verschieben
for (var i = topIdx + 1; i < items.length; i++) {
sub.appendChild(items[i]);
}
// Innerhalb der Unterliste Gruppen (#group:...) bauen
buildGroups(sub);
} else {
// Kein #link: – wir bauen Gruppen direkt in der Wurzel
buildGroups(ul);
}
});
}
function init() {
var panel = document.getElementById('mw-panel');
if (!panel) return;
panel.classList.add('kr-sb');
buildPortlets(panel);
}
// Sofort & bei Ajax-Nachladungen
mw.hook('wikipage.content').add(init);
init();
})();