Main Page:mediawiki:common.js: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
/* --- Initialize sortable tables (desktop + mobile) --- */ | /* ========================================================== | ||
MediaWiki:Common.js | |||
Purpose: Ensure tables are responsive, sortable, and collapsible | |||
across desktop (Vector) and mobile (Minerva). | |||
========================================================== */ | |||
(function () { | |||
/* --- Wrap tables for responsive scrolling --- */ | |||
function wrapTables($root) { | |||
var $scope = $root.find('.mw-parser-output').addBack('.mw-parser-output'); | |||
if (!$scope.length) $scope = $root; | |||
$scope.find('table').each(function () { | |||
var $table = $(this); | |||
// Skip if already wrapped, or marked no-responsive | |||
if ($table.closest('.table-responsive').length) return; | |||
if ($table.hasClass('no-responsive')) return; | |||
// Skip common layout/meta tables | |||
if ($table.is('.infobox, .navbox, .toc, .metadata')) return; | |||
// Use caption as label if present | |||
var label = 'Scrollable table'; | |||
var $cap = $table.children('caption').first(); | |||
if ($cap.length) { | |||
var capText = ($cap.text() || '').trim(); | |||
if (capText) label = 'Scrollable table: ' + capText; | |||
} | |||
// Wrap with scrollable div | |||
var $wrapper = $('<div>', { | |||
'class': 'table-responsive', | |||
'role': 'region', | |||
'aria-label': label, | |||
'tabindex': 0 | |||
}); | |||
$table.before($wrapper); | |||
$wrapper.append($table); | |||
}); | |||
} | |||
/* --- Initialize collapsible tables --- */ | |||
function initCollapsible($root) { | |||
mw.loader.using('jquery.makeCollapsible').then(function () { | |||
$root.find('.mw-collapsible').each(function () { | |||
var $c = $(this); | |||
if (!$c.data('collapsible-initialized')) { | |||
$c.makeCollapsible(); | |||
$c.data('collapsible-initialized', true); | |||
} | |||
}); | |||
}); | |||
} | |||
/* --- Initialize sortable tables (desktop + mobile) --- */ | |||
function initSortable($root) { | function initSortable($root) { | ||
mw.loader.using(['jquery.tablesorter', 'jquery.tablesorter.styles']).then(function () { | mw.loader.using(['jquery.tablesorter', 'jquery.tablesorter.styles']).then(function () { | ||
| Line 22: | Line 79: | ||
}); | }); | ||
} | } | ||
/* --- Enhance page content --- */ | |||
function enhance($content) { | |||
wrapTables($content); | |||
initCollapsible($content); | |||
initSortable($content); | |||
} | |||
/* Run on initial load */ | |||
$(function () { enhance($(document)); }); | |||
/* Run again when new content is injected (e.g., VisualEditor, AJAX) */ | |||
mw.hook('wikipage.content').add(function ($content) { enhance($content); }); | |||
})(); | |||
Revision as of 16:43, 26 August 2025
/* ==========================================================
MediaWiki:Common.js
Purpose: Ensure tables are responsive, sortable, and collapsible
across desktop (Vector) and mobile (Minerva).
========================================================== */
(function () {
/* --- Wrap tables for responsive scrolling --- */
function wrapTables($root) {
var $scope = $root.find('.mw-parser-output').addBack('.mw-parser-output');
if (!$scope.length) $scope = $root;
$scope.find('table').each(function () {
var $table = $(this);
// Skip if already wrapped, or marked no-responsive
if ($table.closest('.table-responsive').length) return;
if ($table.hasClass('no-responsive')) return;
// Skip common layout/meta tables
if ($table.is('.infobox, .navbox, .toc, .metadata')) return;
// Use caption as label if present
var label = 'Scrollable table';
var $cap = $table.children('caption').first();
if ($cap.length) {
var capText = ($cap.text() || ).trim();
if (capText) label = 'Scrollable table: ' + capText;
}
// Wrap with scrollable div
var $wrapper = $('
', {
'class': 'table-responsive',
'role': 'region',
'aria-label': label,
'tabindex': 0
});
$table.before($wrapper);
$wrapper.append($table);
});
}
/* --- Initialize collapsible tables --- */
function initCollapsible($root) {
mw.loader.using('jquery.makeCollapsible').then(function () {
$root.find('.mw-collapsible').each(function () {
var $c = $(this);
if (!$c.data('collapsible-initialized')) {
$c.makeCollapsible();
$c.data('collapsible-initialized', true);
}
});
});
}
/* --- Initialize sortable tables (desktop + mobile) --- */
function initSortable($root) {
mw.loader.using(['jquery.tablesorter', 'jquery.tablesorter.styles']).then(function () {
// Use MediaWiki's built-in sortTables() if available
if (typeof window.sortTables === 'function') {
$root.find('table.sortable').each(function () {
var $t = $(this);
if (!$t.hasClass('sortable-initialized')) {
window.sortTables(this);
$t.addClass('sortable-initialized');
}
});
} else {
// Fallback: tablesorter
$root.find('table.sortable').each(function () {
var $t = $(this);
if (!$t.hasClass('tablesorter-processed')) {
$t.tablesorter();
}
});
}
});
}
/* --- Enhance page content --- */
function enhance($content) {
wrapTables($content);
initCollapsible($content);
initSortable($content);
}
/* Run on initial load */
$(function () { enhance($(document)); });
/* Run again when new content is injected (e.g., VisualEditor, AJAX) */
mw.hook('wikipage.content').add(function ($content) { enhance($content); });
})();