MediaWiki:Common.js: Unterschied zwischen den Versionen

Aus MILLENNIUM ARTS ISP - Hilfe | FAQ
Zur Navigation springen Zur Suche springen
KKeine Bearbeitungszusammenfassung
KKeine Bearbeitungszusammenfassung
Markierung: Manuelle Zurücksetzung
 
(27 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
/* Das folgende JavaScript wird für alle Benutzer geladen. */
/* Das folgende JavaScript wird für alle Benutzer geladen. */
console.log("Common.js wird 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!");


    // Ziel: Das HOSTING-Portal
     var defaultCollapsed = ['navigation', 'SEARCH', 'LANGUAGES'];
     var $portal = $('#p-HOSTING');
     var collapsiblePortals = ['HOSTING', 'DOMAINS', 'SERVICE'];
     var $header = $portal.find('#p-HOSTING-label');
    var $content = $portal.find('.vector-menu-content-list');
    var isOpen = false;


     // Debugging
     $('.vector-menu-portal').each(function() {
    console.log("Portal gefunden:", $portal.length > 0 ? "Ja" : "Nein");
        var $portal = $(this);
    console.log("Header:", $header.text());
        var $header = $portal.find('.vector-menu-heading');
    console.log("Untermenüs:", $content.find('li').length);
        var $content = $portal.find('.vector-menu-content-list');
        var portalId = $portal.attr('id');
        var portalName = portalId ? portalId.replace('p-', '') : '';


    // Indikator hinzufügen (Plus-Symbol als Standard)
        if ($content.find('li').length > 0 && collapsiblePortals.includes(portalName)) {
    $header.prepend('<span class="menu-indicator">+</span> ');
            console.log("Portal:", portalName, "Untermenüs:", $content.find('li').length);
   
 
    // Styling für Header und Indikator
            $header.prepend('<span class="menu-indicator"></span> ');
    $header.css({
 
        'cursor': 'pointer',
            $header.css({
        'font-weight': 'bold',
                'cursor': 'pointer',
        'display': 'flex', // Für bessere Ausrichtung
                'font-weight': 'bold',
        'align-items': 'center'
                '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'); // Korrigiert von '.vector-menu-heading' zu '.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;
            });
        }
     });
     });
     $header.find('.menu-indicator').css({
 
         'margin-right': '5px',
    // Viewport-Meta-Tag hinzufügen
         'transition': 'transform 0.3s ease' // Sanfte Rotation
     var viewportMeta = $('<meta>', {
         name: 'viewport',
         content: 'width=device-width, initial-scale=1.0, user-scalable=yes'
     });
     });
   
     $('head').append(viewportMeta);
    // Inhalt standardmäßig einklappen
     $content.hide();


     // Klick-Event
     // Sandwich-Menü für mobile Geräte
     $header.click(function(e) {
     if ($(window).width() <= 768) {  // Nur auf mobilen Geräten
         e.preventDefault();
        // Sandwich-Symbol hinzufügen
         $content.slideToggle(300, function() {
        var sandwichMenu = $('<div class="sandwich-menu">☰</div>');
             // Zustand aktualisieren und Indikator ändern
         $('#mw-head').prepend(sandwichMenu);  // Symbol in der Kopfzeile einfügen
             isOpen = !isOpen;
 
            var $indicator = $header.find('.menu-indicator');
        // Schließen-Symbol hinzufügen (in die Seitenleiste)
             if (isOpen) {
        var closeMenu = $('<div class="close-menu">✕</div>');
                 $indicator.text('−'); // Minus bei geöffnet
         $('#mw-panel').prepend(closeMenu);  // Symbol in die Seitenleiste einfügen
                 $indicator.css('transform', 'rotate(0deg)');
 
        // Seitenleiste standardmäßig ausblenden
        $('#mw-panel').addClass('hidden');
        closeMenu.hide(); // Schließen-Symbol standardmäßig ausblenden
 
        // Klick-Event für das Sandwich-Symbol
        sandwichMenu.click(function(e) {
             e.stopPropagation(); // Verhindert, dass das Klick-Event auf das Dokument übertragen wird
             $('#mw-panel').toggleClass('hidden visible');
             if ($('#mw-panel').hasClass('visible')) {
                 sandwichMenu.hide(); // Sandwich-Symbol ausblenden
                 closeMenu.show(); // Schließen-Symbol anzeigen
             } else {
             } else {
                 $indicator.text('+'); // Plus bei geschlossen
                 sandwichMenu.show(); // Sandwich-Symbol anzeigen
                 $indicator.css('transform', 'rotate(0deg)'); // Zurücksetzen
                closeMenu.hide(); // Schließen-Symbol ausblenden
            }
        });
 
        // Klick-Event für das Schließen-Symbol
        closeMenu.click(function(e) {
            e.stopPropagation(); // Verhindert, dass das Klick-Event auf das Dokument übertragen wird
            $('#mw-panel').removeClass('visible').addClass('hidden');
            sandwichMenu.show(); // Sandwich-Symbol anzeigen
            closeMenu.hide(); // Schließen-Symbol ausblenden
        });
 
        // Klick-Event auf das Dokument, um die Seitenleiste zu schließen
        $(document).click(function(e) {
            // Prüfen, ob der Klick außerhalb der Seitenleiste und der Menübuttons stattgefunden hat
            if (!$(e.target).closest('#mw-panel').length && !$(e.target).closest('.sandwich-menu').length && !$(e.target).closest('.close-menu').length) {
                 $('#mw-panel').removeClass('visible').addClass('hidden');
                sandwichMenu.show(); // Sandwich-Symbol anzeigen
                closeMenu.hide(); // Schließen-Symbol ausblenden
             }
             }
         });
         });
     });
 
        // Quelltext anzeigen und Versionsgeschichte ausblenden
        $('#ca-viewsource').hide(); // Quelltext anzeigen
        $('#ca-history').hide();  // Versionsgeschichte
     }
});
});

Aktuelle Version vom 4. April 2025, 18:16 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'); // Korrigiert von '.vector-menu-heading' zu '.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, user-scalable=yes'
    });
    $('head').append(viewportMeta);

    // Sandwich-Menü für mobile Geräte
    if ($(window).width() <= 768) {  // Nur auf mobilen Geräten
        // Sandwich-Symbol hinzufügen
        var sandwichMenu = $('<div class="sandwich-menu">☰</div>');
        $('#mw-head').prepend(sandwichMenu);  // Symbol in der Kopfzeile einfügen

        // Schließen-Symbol hinzufügen (in die Seitenleiste)
        var closeMenu = $('<div class="close-menu">✕</div>');
        $('#mw-panel').prepend(closeMenu);  // Symbol in die Seitenleiste einfügen

        // Seitenleiste standardmäßig ausblenden
        $('#mw-panel').addClass('hidden');
        closeMenu.hide(); // Schließen-Symbol standardmäßig ausblenden

        // Klick-Event für das Sandwich-Symbol
        sandwichMenu.click(function(e) {
            e.stopPropagation(); // Verhindert, dass das Klick-Event auf das Dokument übertragen wird
            $('#mw-panel').toggleClass('hidden visible');
            if ($('#mw-panel').hasClass('visible')) {
                sandwichMenu.hide(); // Sandwich-Symbol ausblenden
                closeMenu.show(); // Schließen-Symbol anzeigen
            } else {
                sandwichMenu.show(); // Sandwich-Symbol anzeigen
                closeMenu.hide(); // Schließen-Symbol ausblenden
            }
        });

        // Klick-Event für das Schließen-Symbol
        closeMenu.click(function(e) {
            e.stopPropagation(); // Verhindert, dass das Klick-Event auf das Dokument übertragen wird
            $('#mw-panel').removeClass('visible').addClass('hidden');
            sandwichMenu.show(); // Sandwich-Symbol anzeigen
            closeMenu.hide(); // Schließen-Symbol ausblenden
        });

        // Klick-Event auf das Dokument, um die Seitenleiste zu schließen
        $(document).click(function(e) {
            // Prüfen, ob der Klick außerhalb der Seitenleiste und der Menübuttons stattgefunden hat
            if (!$(e.target).closest('#mw-panel').length && !$(e.target).closest('.sandwich-menu').length && !$(e.target).closest('.close-menu').length) {
                $('#mw-panel').removeClass('visible').addClass('hidden');
                sandwichMenu.show(); // Sandwich-Symbol anzeigen
                closeMenu.hide(); // Schließen-Symbol ausblenden
            }
        });

        // Quelltext anzeigen und Versionsgeschichte ausblenden
        $('#ca-viewsource').hide(); // Quelltext anzeigen
        $('#ca-history').hide();   // Versionsgeschichte
    }
});