Array

MediaWiki:Common.js: Difference between revisions

No edit summary
No edit summary
 
(4 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. */
/* Any JavaScript here will be loaded for all users on every page load. */


// COLLAPSIBLE HEADER
// COLLAPSIBLE HEADERS
$(document).ready(function () {
$(document).ready(function () {
     $(".collapsible-header").each(function () {
     $(".collapsible-header").each(function () {
         var header = $(this);
         var header = $(this);
         var content = header.next(".collapsible-content");
         var content = header.next(".collapsible-content");
        // Skip if there is no associated collapsible-content block
         if (content.length === 0) return;
         if (content.length === 0) return;
        // Check if the section should start open
         var startsOpen = header.hasClass("open");
         var startsOpen = header.hasClass("open");
 
         var arrow = startsOpen ? "▲" : "▼";
        // Hide content only if it should start closed
         header.prepend('<span class="collapse-toggle" aria-hidden="true">' + arrow + '</span>');
        if (!startsOpen) {
         if (!startsOpen) content.hide();
            content.hide();
        }
 
        // Arrow indicator ▼ (closed) or ▲ (open)
         var indicator = startsOpen ? "▲" : "▼";
         header.append(' <span class="collapse-toggle">' + indicator + '</span>');
 
         // Make header clickable
        header.css("cursor", "pointer");
 
        // Collapse / Expand behavior
         header.on("click", function () {
         header.on("click", function () {
             content.slideToggle(200);
             content.slideToggle(150);
 
            // Toggle arrow
            var toggle = header.find(".collapse-toggle");
            var isOpen = toggle.text() === "▲";
            toggle.text(isOpen ? "▼" : "▲");
 
            // Toggle class for CSS rotation (optional)
             header.toggleClass("open");
             header.toggleClass("open");
            var icon = header.hasClass("open") ? "▲" : "▼";
            header.find(".collapse-toggle").text(icon);
         });
         });
     });
     });
});
});

Latest revision as of 15:31, 28 November 2025

/* Any JavaScript here will be loaded for all users on every page load. */

// COLLAPSIBLE HEADERS
$(document).ready(function () {
    $(".collapsible-header").each(function () {
        var header = $(this);
        var content = header.next(".collapsible-content");
        if (content.length === 0) return;
        var startsOpen = header.hasClass("open");
        var arrow = startsOpen ? "▲" : "▼";
        header.prepend('<span class="collapse-toggle" aria-hidden="true">' + arrow + '</span>');
        if (!startsOpen) content.hide();
        header.on("click", function () {
            content.slideToggle(150);
            header.toggleClass("open");
            var icon = header.hasClass("open") ? "▲" : "▼";
            header.find(".collapse-toggle").text(icon);
        });
    });
});