MediaWiki:Common.js: Unterschied zwischen den Versionen

Aus MILLENNIUM ARTS ISP - Hilfe | FAQ
Zur Navigation springen Zur Suche springen
KKeine Bearbeitungszusammenfassung
KKeine Bearbeitungszusammenfassung
Zeile 1: Zeile 1:
/* Das folgende JavaScript wird für alle Benutzer geladen. */
/* Das folgende JavaScript wird für alle Benutzer geladen. */
$(document).ready(function() {
$(document).ready(function() {
    // Bestehender Code für die einklappbaren Menüs
     console.log("Common.js wird geladen!");
     console.log("Common.js wird geladen!");


    // Liste der Standard-Menüs, die eingeklappt starten (TOOLBOX entfernt)
     var defaultCollapsed = ['navigation', 'SEARCH', 'LANGUAGES'];
     var defaultCollapsed = ['navigation', 'SEARCH', 'LANGUAGES'];
    // Liste der Portale, die klappbar sein sollen (ab HOSTING, jetzt mit SERVICE)
     var collapsiblePortals = ['HOSTING', 'DOMAINS', 'SERVICE'];
     var collapsiblePortals = ['HOSTING', 'DOMAINS', 'SERVICE'];


    // Alle Vector-Menü-Portale durchlaufen
     $('.vector-menu-portal').each(function() {
     $('.vector-menu-portal').each(function() {
         var $portal = $(this);
         var $portal = $(this);
         var $header = $portal.find('.vector-menu-heading');
         var $header = $portal.find('.vector-menu-heading');
         var $content = $portal.find('.vector-menu-content-list');
         var $content = $portal.find('.vector-menu-content-list');
         var portalId = $portal.attr('id'); // z. B. "p-HOSTING"
         var portalId = $portal.attr('id');
         var portalName = portalId ? portalId.replace('p-', '') : '';
         var portalName = portalId ? portalId.replace('p-', '') : '';


        // Nur Portale mit Untermenüs (mindestens 1 <li>) und in collapsiblePortals bearbeiten
         if ($content.find('li').length > 0 && collapsiblePortals.includes(portalName)) {
         if ($content.find('li').length > 0 && collapsiblePortals.includes(portalName)) {
             console.log("Portal:", portalName, "Untermenüs:", $content.find('li').length);
             console.log("Portal:", portalName, "Untermenüs:", $content.find('li').length);


            // Indikator hinzufügen (▼ für ausgeklappt, ▶ für eingeklappt)
             $header.prepend('<span class="menu-indicator">▼</span> ');
             $header.prepend('<span class="menu-indicator">▼</span> ');


            // Styling
             $header.css({
             $header.css({
                 'cursor': 'pointer',
                 'cursor': 'pointer',
Zeile 35: Zeile 30:
             });
             });


            // Klappzustand aus sessionStorage laden, sonst Standard auf "zugeklappt" setzen
             var savedState = sessionStorage.getItem('menu-state-' + portalName);
             var savedState = sessionStorage.getItem('menu-state-' + portalName);
             var isOpen = savedState !== null ? (savedState === 'open') : false; // Beim ersten Besuch immer zugeklappt
             var isOpen = savedState !== null ? (savedState === 'open') : false;


             if (isOpen) {
             if (isOpen) {
Zeile 47: Zeile 41:
             }
             }


            // Klick-Event mit synchroner Animation
             $header.click(function(e) {
             $header.click(function(e) {
                 e.preventDefault();
                 e.preventDefault();
Zeile 61: Zeile 54:
                     sessionStorage.setItem('menu-state-' + portalName, 'open');
                     sessionStorage.setItem('menu-state-' + portalName, 'open');
                 }
                 }
                 isOpen = !isOpen; // Zustand umschalten
                 isOpen = !isOpen;
             });
             });
         }
         }
     });
     });
    // Viewport-Meta-Tag hinzufügen
    var viewportMeta = $('<meta>', {
        name: 'viewport',
        content: 'width=device-width, initial-scale=1.0'
    });
    $('head').append(viewportMeta);
});
});

Version vom 2. April 2025, 09:30 Uhr

/* Das folgende JavaScript wird für alle Benutzer geladen. */
$(document).ready(function() {
    // Bestehender Code für die einklappbaren Menüs
    console.log("Common.js wird geladen!");

    var defaultCollapsed = ['navigation', 'SEARCH', 'LANGUAGES'];
    var collapsiblePortals = ['HOSTING', 'DOMAINS', 'SERVICE'];

    $('.vector-menu-portal').each(function() {
        var $portal = $(this);
        var $header = $portal.find('.vector-menu-heading');
        var $content = $portal.find('.vector-menu-content-list');
        var portalId = $portal.attr('id');
        var portalName = portalId ? portalId.replace('p-', '') : '';

        if ($content.find('li').length > 0 && collapsiblePortals.includes(portalName)) {
            console.log("Portal:", portalName, "Untermenüs:", $content.find('li').length);

            $header.prepend('<span class="menu-indicator">▼</span> ');

            $header.css({
                'cursor': 'pointer',
                'font-weight': 'bold',
                'display': 'flex',
                'align-items': 'center'
            });
            $header.find('.menu-indicator').css({
                'margin-right': '5px',
                'transition': 'transform 0.3s ease'
            });

            var savedState = sessionStorage.getItem('menu-state-' + portalName);
            var isOpen = savedState !== null ? (savedState === 'open') : false;

            if (isOpen) {
                $content.show();
                $header.find('.menu-indicator').css('transform', 'rotate(0deg)');
            } else {
                $content.hide();
                $header.find('.menu-indicator').css('transform', 'rotate(-90deg)');
            }

            $header.click(function(e) {
                e.preventDefault();
                var $indicator = $header.find('.menu-indicator');

                if (isOpen) {
                    $content.slideUp(300);
                    $indicator.css('transform', 'rotate(-90deg)');
                    sessionStorage.setItem('menu-state-' + portalName, 'closed');
                } else {
                    $content.slideDown(300);
                    $indicator.css('transform', 'rotate(0deg)');
                    sessionStorage.setItem('menu-state-' + portalName, 'open');
                }
                isOpen = !isOpen;
            });
        }
    });

    // Viewport-Meta-Tag hinzufügen
    var viewportMeta = $('<meta>', {
        name: 'viewport',
        content: 'width=device-width, initial-scale=1.0'
    });
    $('head').append(viewportMeta);
});