|
|
| Zeile 1: |
Zeile 1: |
| // 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();
| |
| }
| |
| })();
| |
