MediaWiki:Common.js
Aparência
Nota: Após publicar, você pode ter que limpar o "cache" do seu navegador para ver as alterações.
- Firefox / Safari: Pressione Shift enquanto clica Recarregar, ou pressione Ctrl-F5 ou Ctrl-R (⌘-R no Mac)
- Google Chrome: Pressione Ctrl-Shift-R (⌘-Shift-R no Mac)
- Edge: Pressione Ctrl enquanto clica Recarregar, ou pressione Ctrl-F5.
- Opera: Pressione Ctrl-F5.
/* Códigos JavaScript aqui colocados serão carregados por todos aqueles que acessarem alguma página deste wiki */
/* =========================================================
SPLIXMMO WIKI
MediaWiki:Common.js
========================================================= */
/* =========================================================
MENU PRINCIPAL SEMPRE FIXADO
========================================================= */
(function () {
'use strict';
function splixPinMainMenu() {
var pinButton = document.querySelector(
'[data-event-name="pinnable-header.vector-main-menu.pin"]'
);
/*
* Se existir o botão "fixar", significa que o menu
* ainda está no modo hambúrguer.
*/
if (pinButton) {
pinButton.click();
}
}
/*
* Se o Vector já terminou de inicializar,
* fixa imediatamente.
*/
if (
document.documentElement.classList.contains(
'vector-animations-ready'
)
) {
splixPinMainMenu();
return;
}
/*
* Caso contrário, aguarda a inicialização do Vector.
*/
var observer = new MutationObserver(function () {
if (
document.documentElement.classList.contains(
'vector-animations-ready'
)
) {
splixPinMainMenu();
observer.disconnect();
}
});
observer.observe(
document.documentElement,
{
attributes: true,
attributeFilter: ['class']
}
);
})();
/* ==========================================================
SPLIX - MASONRY DAS SKILLS
========================================================== */
(function () {
'use strict';
function resizeMasonryItem(item) {
var grid = item.parentElement;
if (!grid) {
return;
}
/* Mobile: fluxo normal */
if (window.innerWidth <= 950) {
item.style.gridRowEnd = '';
return;
}
var gridStyle =
window.getComputedStyle(grid);
var rowHeight =
parseInt(
gridStyle.getPropertyValue('grid-auto-rows'),
10
);
var rowGap =
parseInt(
gridStyle.getPropertyValue('row-gap'),
10
);
if (!rowHeight) {
rowHeight = 8;
}
if (!rowGap) {
rowGap = 16;
}
/*
* Remove o span anterior antes de medir.
*/
item.style.gridRowEnd = 'auto';
/*
* Altura real do card.
*/
var itemHeight =
item.getBoundingClientRect().height;
/*
* Fórmula correta considerando:
*
* altura das linhas +
* gaps existentes entre elas.
*/
var rowSpan =
Math.ceil(
(itemHeight + rowGap) /
(rowHeight + rowGap)
);
item.style.gridRowEnd =
'span ' + rowSpan;
}
function resizeAllMasonryItems() {
var items =
document.querySelectorAll(
'.splix-rebalance-skill-grid > .splix-rebalance-skill'
);
items.forEach(function (item) {
resizeMasonryItem(item);
});
}
function scheduleMasonry() {
window.requestAnimationFrame(function () {
resizeAllMasonryItems();
});
}
/* ======================================================
MEDIAWIKI
====================================================== */
mw.hook('wikipage.content').add(function () {
scheduleMasonry();
/*
* Recalcula depois que imagens carregarem.
*/
document
.querySelectorAll(
'.splix-rebalance-skill-grid img'
)
.forEach(function (img) {
if (!img.complete) {
img.addEventListener(
'load',
scheduleMasonry,
{ once: true }
);
}
});
/*
* Segunda medição após renderização
* de fontes/estilos.
*/
setTimeout(scheduleMasonry, 100);
setTimeout(scheduleMasonry, 300);
});
/* ======================================================
RESIZE
====================================================== */
var resizeTimer;
window.addEventListener(
'resize',
function () {
clearTimeout(resizeTimer);
resizeTimer =
setTimeout(
resizeAllMasonryItems,
120
);
}
);
})();
mw.hook('wikipage.content').add(function ($content) {
$content.find('.splix-class-nav-card[data-anchor]').each(function () {
var card = this;
var anchor = card.getAttribute('data-anchor');
if (!anchor) {
return;
}
card.setAttribute('role', 'link');
card.setAttribute('tabindex', '0');
card.addEventListener('click', function () {
window.location.hash = anchor;
});
card.addEventListener('keydown', function (event) {
if (event.key === 'Enter' || event.key === ' ') {
event.preventDefault();
window.location.hash = anchor;
}
});
});
});