User:HyperNervie/sandbox: Difference between revisions
Jump to navigation
Jump to search
HyperNervie (talk | contribs) (Created page with "Input these in your browser console: <pre> mw.loader.using("oojs-ui-widgets").then(function () { function convertToOOUITabber(_, tabberDiv) { const $tabberDiv = $(tabberDiv); const $labels = $tabberDiv.find( "> .rhwiki-tabberneue-menu" + "> .rhwiki-tabberneue-option" + "> .rhwiki-tabberneue-label" ); const $panels = $tabberDiv.find( "> .rhwiki-tabberneue-content" + "> .rhwiki-...") |
(No difference)
|
Revision as of 02:03, 11 July 2025
Input these in your browser console:
mw.loader.using("oojs-ui-widgets").then(function () {
function convertToOOUITabber(_, tabberDiv) {
const $tabberDiv = $(tabberDiv);
const $labels = $tabberDiv.find(
"> .rhwiki-tabberneue-menu" +
"> .rhwiki-tabberneue-option" +
"> .rhwiki-tabberneue-label"
);
const $panels = $tabberDiv.find(
"> .rhwiki-tabberneue-content" +
"> .rhwiki-tabberneue-panel"
);
const tabPanelLayouts = [];
$labels.each(function (i, labelDiv) {
tabPanelLayouts.push(new OO.ui.TabPanelLayout({
name: i,
expanded: false,
label: $(labelDiv).contents(),
$content: $($panels[i]).contents()
}));
});
const classList = tabberDiv.classList;
const indexLayout = new OO.ui.IndexLayout({
expanded: false,
autoFocus: false
});
let shownIndex = parseInt($tabberDiv.attr("data-shown-index"));
if (isNaN(shownIndex) || shownIndex < 0 || shownIndex >= $panels.length)
shownIndex = 0;
indexLayout.addTabPanels(tabPanelLayouts).setTabPanel(shownIndex);
$tabberDiv.replaceWith(indexLayout.$element);
}
mw.hook("wikipage.content").add(function ($content) {
while (true) {
let $tabbers = $content.find(".rhwiki-tabberneue");
if ($tabbers.length === 0) break;
$tabbers.each(convertToOOUITabber);
}
});
});
Current "TabStart-content-TabEnd" solution renders a series of pairs of label and panel. Before MediaWiki:Gadget-Tabber.js is loaded, all panels are visible. In extreme cases where the script fails to load, the panels are left there forever.
Here we have only one visible panel at the beginning, and the labels are styled properly so that when MediaWiki:Gadget-Tabber.js loads, there won't be any change to page appearance. Even if the script doesn't load successfully, readers just can't switch panels by clicking on labels.
