MediaWiki:Common.js: Unterschied zwischen den Versionen
Aus Lost Dreams Of Tomorrow Wiki
Keine Bearbeitungszusammenfassung |
Keine Bearbeitungszusammenfassung |
||
| Zeile 4: | Zeile 4: | ||
function initSidebar() { | function initSidebar() { | ||
// | // Suche nach ALLEN h3 Elementen in mw-portlet Containern | ||
var | var portlets = document.querySelectorAll('.mw-portlet'); | ||
console.log('Gefundene | console.log('Gefundene Portlets:', portlets.length); // Debug | ||
portlets.forEach(function(portlet) { | |||
var portletBody = | var header = portlet.querySelector('h3'); | ||
var portletBody = portlet.querySelector('.mw-portlet-body'); | |||
if (! | if (!header || !portletBody) { | ||
console.log(' | console.log('Header oder Body fehlt in Portlet'); | ||
return; | return; | ||
} | } | ||
console.log('Initialisiere:', header.textContent); // Debug | |||
// Füge Icon hinzu | // Füge Icon hinzu | ||
| Zeile 22: | Zeile 25: | ||
icon.className = 'toggle-icon'; | icon.className = 'toggle-icon'; | ||
icon.textContent = '▼ '; | icon.textContent = '▼ '; | ||
icon.style.marginRight = '5px'; | |||
header.insertBefore(icon, header.firstChild); | header.insertBefore(icon, header.firstChild); | ||
} | } | ||
| Zeile 27: | Zeile 31: | ||
// Cursor | // Cursor | ||
header.style.cursor = 'pointer'; | header.style.cursor = 'pointer'; | ||
header.style.userSelect = 'none'; | |||
// Initial Status | // Initial Status - prüfe ob "open" Klasse existiert | ||
var isOpen = header.classList.contains('open'); | |||
if (!isOpen) { | |||
portletBody.style.display = 'none'; | portletBody.style.display = 'none'; | ||
header.querySelector('.toggle-icon').textContent = '▶ '; | header.querySelector('.toggle-icon').textContent = '▶ '; | ||
| Zeile 37: | Zeile 43: | ||
header.addEventListener('click', function(e) { | header.addEventListener('click', function(e) { | ||
e.preventDefault(); | e.preventDefault(); | ||
console.log(' | console.log('KLICK!'); // Debug | ||
var icon = this.querySelector('.toggle-icon'); | var icon = this.querySelector('.toggle-icon'); | ||
var body = | var body = portlet.querySelector('.mw-portlet-body'); | ||
if (body.style.display === 'none') { | if (body.style.display === 'none') { | ||
| Zeile 46: | Zeile 52: | ||
icon.textContent = '▼ '; | icon.textContent = '▼ '; | ||
this.classList.add('open'); | this.classList.add('open'); | ||
console.log('Geöffnet'); | |||
} else { | } else { | ||
body.style.display = 'none'; | body.style.display = 'none'; | ||
icon.textContent = '▶ '; | icon.textContent = '▶ '; | ||
this.classList.remove('open'); | this.classList.remove('open'); | ||
console.log('Geschlossen'); | |||
} | } | ||
}); | }); | ||
Version vom 11. Januar 2026, 04:29 Uhr
// MediaWiki Sidebar Toggle Script - Vanilla JS
(function() {
'use strict';
function initSidebar() {
// Suche nach ALLEN h3 Elementen in mw-portlet Containern
var portlets = document.querySelectorAll('.mw-portlet');
console.log('Gefundene Portlets:', portlets.length); // Debug
portlets.forEach(function(portlet) {
var header = portlet.querySelector('h3');
var portletBody = portlet.querySelector('.mw-portlet-body');
if (!header || !portletBody) {
console.log('Header oder Body fehlt in Portlet');
return;
}
console.log('Initialisiere:', header.textContent); // Debug
// Füge Icon hinzu
if (!header.querySelector('.toggle-icon')) {
var icon = document.createElement('span');
icon.className = 'toggle-icon';
icon.textContent = '▼ ';
icon.style.marginRight = '5px';
header.insertBefore(icon, header.firstChild);
}
// Cursor
header.style.cursor = 'pointer';
header.style.userSelect = 'none';
// Initial Status - prüfe ob "open" Klasse existiert
var isOpen = header.classList.contains('open');
if (!isOpen) {
portletBody.style.display = 'none';
header.querySelector('.toggle-icon').textContent = '▶ ';
}
// Click Event
header.addEventListener('click', function(e) {
e.preventDefault();
console.log('KLICK!'); // Debug
var icon = this.querySelector('.toggle-icon');
var body = portlet.querySelector('.mw-portlet-body');
if (body.style.display === 'none') {
body.style.display = 'block';
icon.textContent = '▼ ';
this.classList.add('open');
console.log('Geöffnet');
} else {
body.style.display = 'none';
icon.textContent = '▶ ';
this.classList.remove('open');
console.log('Geschlossen');
}
});
});
}
// Warte bis DOM geladen ist
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', initSidebar);
} else {
initSidebar();
}
})();