MediaWiki:Common.js: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| Line 28: | Line 28: | ||
}); | }); | ||
}); | }); | ||
/* Mobile class-card collapse controls */ | |||
( function () { | |||
var mobileQuery = window.matchMedia('(max-width: 599px)'); | |||
function initialiseClassCards() { | |||
$('.wizlords-class-card').each(function () { | |||
var $card = $(this); | |||
if (mobileQuery.matches) { | |||
if (!$card.attr('data-wizlords-mobile-class-card')) { | |||
$card | |||
.attr('data-wizlords-mobile-class-card', '1') | |||
.attr('role', 'button') | |||
.attr('tabindex', '0'); | |||
} | |||
if (!$card.hasClass('is-open')) { | |||
$card.attr('aria-expanded', 'false'); | |||
} | |||
} else { | |||
$card | |||
.removeAttr('data-wizlords-mobile-class-card') | |||
.removeAttr('role') | |||
.removeAttr('tabindex') | |||
.removeAttr('aria-expanded') | |||
.removeClass('is-open'); | |||
} | |||
}); | |||
} | |||
function toggleClassCard(card) { | |||
if (!mobileQuery.matches) { | |||
return; | |||
} | |||
var $card = $(card); | |||
var isOpen = $card.hasClass('is-open'); | |||
$card | |||
.toggleClass('is-open', !isOpen) | |||
.attr('aria-expanded', isOpen ? 'false' : 'true'); | |||
} | |||
$(initialiseClassCards); | |||
if (mobileQuery.addEventListener) { | |||
mobileQuery.addEventListener('change', initialiseClassCards); | |||
} else if (mobileQuery.addListener) { | |||
mobileQuery.addListener(initialiseClassCards); | |||
} | |||
$(document).on('click', '.wizlords-class-card', function (event) { | |||
if ($(event.target).closest('a').length) { | |||
return; | |||
} | |||
toggleClassCard(this); | |||
}); | |||
$(document).on('keydown', '.wizlords-class-card', function (event) { | |||
if (event.key === 'Enter' || event.key === ' ') { | |||
event.preventDefault(); | |||
toggleClassCard(this); | |||
} | |||
}); | |||
}() ); | |||
Revision as of 22:52, 29 June 2026
/* Bottom collapse controls */
mw.loader.using('jquery.makeCollapsible').then(function () {
function collapseFromBottom(toggleClass, collapsibleId) {
$(document).on('click', toggleClass, function (event) {
event.preventDefault();
var $collapsible = $('#' + collapsibleId);
var $topToggle = $collapsible.children('.mw-collapsible-toggle').first();
if ($topToggle.length) {
$topToggle.trigger('click');
}
});
}
collapseFromBottom('.wizlords-spellbook-collapse-arcane', 'wizlords-arcane-spellbook');
collapseFromBottom('.wizlords-spellbook-collapse-divine', 'wizlords-divine-spellbook');
$(document).on('click', '.wizlords-collapsible-section-bottom-toggle', function (event) {
event.preventDefault();
var $collapsible = $(this).closest('.wizlords-collapsible-section');
var $topToggle = $collapsible.children('.mw-collapsible-toggle').first();
if ($topToggle.length) {
$topToggle.trigger('click');
}
});
});
/* Mobile class-card collapse controls */
( function () {
var mobileQuery = window.matchMedia('(max-width: 599px)');
function initialiseClassCards() {
$('.wizlords-class-card').each(function () {
var $card = $(this);
if (mobileQuery.matches) {
if (!$card.attr('data-wizlords-mobile-class-card')) {
$card
.attr('data-wizlords-mobile-class-card', '1')
.attr('role', 'button')
.attr('tabindex', '0');
}
if (!$card.hasClass('is-open')) {
$card.attr('aria-expanded', 'false');
}
} else {
$card
.removeAttr('data-wizlords-mobile-class-card')
.removeAttr('role')
.removeAttr('tabindex')
.removeAttr('aria-expanded')
.removeClass('is-open');
}
});
}
function toggleClassCard(card) {
if (!mobileQuery.matches) {
return;
}
var $card = $(card);
var isOpen = $card.hasClass('is-open');
$card
.toggleClass('is-open', !isOpen)
.attr('aria-expanded', isOpen ? 'false' : 'true');
}
$(initialiseClassCards);
if (mobileQuery.addEventListener) {
mobileQuery.addEventListener('change', initialiseClassCards);
} else if (mobileQuery.addListener) {
mobileQuery.addListener(initialiseClassCards);
}
$(document).on('click', '.wizlords-class-card', function (event) {
if ($(event.target).closest('a').length) {
return;
}
toggleClassCard(this);
});
$(document).on('keydown', '.wizlords-class-card', function (event) {
if (event.key === 'Enter' || event.key === ' ') {
event.preventDefault();
toggleClassCard(this);
}
});
}() );