From Brotato Wiki
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)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/* Any JavaScript here will be loaded for all users on every page load. */
/*
WARNING: ES5 ONLY!
- also can't use `jQuery().filter` because mediawiki thinks it's ES6
*/
$(document).ready( function()
{
// Inits
// ============================================================================
initCardTabs();
// Funcs
// ============================================================================
/**
* Sets up tabs. Used by the StatsCardWeaponTabs template
*
* @link https://brotato.wiki.spellsandguns.com/Template:StatsCardWeaponTabs
* @link https://brotato.wiki.spellsandguns.com/MediaWiki:Common.css
*
* @return {void}
*/
function initCardTabs()
{
var $containers = $( '[data-cardtabs]' );
if ( !$containers.length )
{
return;
}
// Loop over every container
$containers.each( function( i1, containerEl )
{
var $tabs = $( containerEl );
// We use the extra step of targetting containers here, instead of
// just using `.find`, because this lets us support nesteds tabs!
var $panelsContainer = $tabs.children( '[data-cardtabs-panels]' );
var $btnsContainer = $tabs.children( '[data-cardtabs-btns]' );
var $panels = $panelsContainer.children( '[data-cardtabs-panel]' );
var $btns = $btnsContainer.children( '[data-cardtabs-btn]' );
// Loop over buttons and set up their onclicks
$btns.each( function( i2, btnEl )
{
var $btn = $( btnEl );
var btnNum = $btn.attr( 'data-cardtabs-btn' );
var $panel = $panelsContainer.children( `[data-cardtabs-panel="${btnNum}"]` ); // can't use `$panels.filter` because mediawiki thinks that's ES6
var btnActiveCls = 'cardtabs__button--active';
var panelHideCls = 'cardtabs__panel--js-hidden';
// Disabled buttons use "-1" for their numbers
if ( btnNum === '-1' )
{
return;
}
$btn.on( 'click', function()
{
// Hide all other panels, then show the button's own panel
$panels.addClass( panelHideCls );
$panel.removeClass( panelHideCls );
$btns.removeClass( btnActiveCls );
$btn.addClass( btnActiveCls );
});
});
});
}//end:initCardTabs
}); // end:$(document).ready