MediaWiki:Gadget-partialCollapsibleTable.js

From Final Fantasy XIV Online Wiki
Jump to navigation Jump to search

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.
$(function () {
    $('.partial-collapsible').each(function () {
        var $table = $(this);

        $table.find('tr.collapsible-trigger-row').each(function () {
            var $trigger = $(this);
            var $toggle = $trigger.find('.partial-collapsible-toggle');

            // Collect all col-extra rows until the next trigger or end of table
            var $rows = $trigger.nextUntil('tr.collapsible-trigger-row', 'tr.col-extra');

            $rows.hide();
            $toggle.addClass('is-collapsed');

            $toggle.on('click', function () {
                var collapsed = $rows.first().is(':hidden');
                $rows.toggle(collapsed);
                $toggle.toggleClass('is-collapsed', !collapsed);
            });
        });
    });
});