MediaWiki:Gadget-enhancedTableHandling.js

From Angelina Jordan Wiki
Revision as of 11:23, 11 August 2025 by Most2dot0 (talk | contribs) (New Gadget code for autoexpansion of collapsed tables)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
// Expand collapsibles if they are target of a jump to its anchor id
$(document).ready(function() {
    // Function to escape special characters in a jQuery selector
    function escapeSelector(id) {
        return id.replace(/([ #;?%&,.+*~\':"!^$[\]()=>|\/@])/g, '\\$1');
    }

    // Function to force the expansion of a collapsible section
    function forceExpandCollapsible() {
        var hash = decodeURIComponent(window.location.hash); // Decode the URL-encoded hash

        if (hash) {
            // Extract the ID portion after the '#'
            var targetId = escapeSelector(hash.substring(1)); // Remove '#' and escape the ID
            var target = $('#' + targetId);

            if (target.length) {
                // Find the associated collapsible element based on the customtoggle class
                var collapsible = target.closest('tr').next('tr.mw-collapsible');

                if (collapsible.length && collapsible.hasClass('mw-collapsed')) {
                    // Forcing expansion of collapsible section
                    collapsible.removeClass('mw-collapsed');
                    collapsible.css('display', 'table-row');  // Adjusting display to ensure it's visible
                    
                    // Optionally, scroll to the target
                    // $('html, body').animate({ scrollTop: target.offset().top }, 500);
                }
            }
        }
    }

    // Execute immediately to catch the case when coming from another page
    forceExpandCollapsible();

    // Also handle hash changes (e.g., clicking on an in-page link)
    $(window).on('hashchange', function() {
        forceExpandCollapsible();
    });
});