Array

MediaWiki:Common.js: Difference between revisions

No edit summary
No edit summary
 
(7 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* Any JavaScript here will be loaded for all users on every page load. */
// COLLAPSIBLE HEADERS
 
// COLLAPSIBLE HEADER - improved (arrow left + CSS rotate)
$(document).ready(function () {
$(document).ready(function () {
     $(".collapsible-header").each(function () {
     $(".collapsible-wrapper").each(function () {
         var header = $(this);
         var wrapper = $(this);
         var content = header.next(".collapsible-content");
         var titleContent = wrapper.find(".collapsible-title-content");
 
         var bodyContent = wrapper.find(".collapsible-body-content");
         // Skip if there is no associated collapsible-content block
         if (titleContent.length === 0 || bodyContent.length === 0) return;
         if (content.length === 0) return;
         var startsOpen = wrapper.data("state") === "open";
 
         var titleHTML = titleContent.html();
         // Check if the section should start open (template may add class "open")
         var bodyHTML = bodyContent.html();
         var startsOpen = header.hasClass("open");
         var header = $('<div class="collapsible-header"></div>');
 
        var content = $('<div class="collapsible-content"></div>');
         // Hide content only if it should start closed
         if (startsOpen) header.addClass("open");
         if (!startsOpen) {
         var arrow = startsOpen ? "▲" : "▼";
            content.hide();
         header.append(titleHTML);
         } else {
         header.append('<span class="collapse-toggle" aria-hidden="true">' + arrow + '</span>');
            // ensure the header has the open class in case it's needed
        content.html(bodyHTML);
            header.addClass("open");
         if (!startsOpen) content.hide();
         }
         wrapper.replaceWith(header.add(content));
 
       
        // Always use the same arrow character and rotate with CSS
         // Inicializar elementos mw-collapsible dentro del contenido
         // Prepend so the arrow appears before the header text
        content.find('.mw-collapsible').each(function() {
         header.prepend('<span class="collapse-toggle" aria-hidden="true">▼</span>');
            if (typeof mw !== 'undefined' && mw.hook) {
 
                mw.hook('wikipage.content').fire($(this));
         // Make header clickable
            }
         header.css("cursor", "pointer");
        });
 
       
         // Collapse / Expand behavior
         header.on("click", function () {
         header.on("click", function () {
             content.slideToggle(200);
             content.slideToggle(150);
             header.toggleClass("open");
             header.toggleClass("open");
            var icon = header.hasClass("open") ? "▲" : "▼";
            header.find(".collapse-toggle").text(icon);
         });
         });
     });
     });
});
});

Latest revision as of 14:36, 11 December 2025

// COLLAPSIBLE HEADERS
$(document).ready(function () {
    $(".collapsible-wrapper").each(function () {
        var wrapper = $(this);
        var titleContent = wrapper.find(".collapsible-title-content");
        var bodyContent = wrapper.find(".collapsible-body-content");
        if (titleContent.length === 0 || bodyContent.length === 0) return;
        var startsOpen = wrapper.data("state") === "open";
        var titleHTML = titleContent.html();
        var bodyHTML = bodyContent.html();
        var header = $('<div class="collapsible-header"></div>');
        var content = $('<div class="collapsible-content"></div>');
        if (startsOpen) header.addClass("open");
        var arrow = startsOpen ? "▲" : "▼";
        header.append(titleHTML);
        header.append('<span class="collapse-toggle" aria-hidden="true">' + arrow + '</span>');
        content.html(bodyHTML);
        if (!startsOpen) content.hide();
        wrapper.replaceWith(header.add(content));
        
        // Inicializar elementos mw-collapsible dentro del contenido
        content.find('.mw-collapsible').each(function() {
            if (typeof mw !== 'undefined' && mw.hook) {
                mw.hook('wikipage.content').fire($(this));
            }
        });
        
        header.on("click", function () {
            content.slideToggle(150);
            header.toggleClass("open");
            var icon = header.hasClass("open") ? "▲" : "▼";
            header.find(".collapse-toggle").text(icon);
        });
    });
});
Retrieved from "https://www.fairlatterdaysaints.org/answers/index.php?title=MediaWiki:Common.js&oldid=264582"