미디어위키:NationsPanel.js

(function (mw, $) {
'use strict';
function setActive(panel, key) {
if (!panel || !key) return;
var tabs = panel.querySelectorAll('.clbi-nations-state-tab[data-continent]');
var panes = panel.querySelectorAll('.clbi-nations-state-continent[data-continent-panel]');
Array.prototype.forEach.call(tabs, function (tab) {
var active = tab.getAttribute('data-continent') === key;
tab.classList.toggle('is-active', active);
tab.setAttribute('aria-selected', active ? 'true' : 'false');
});
Array.prototype.forEach.call(panes, function (pane) {
var active = pane.getAttribute('data-continent-panel') === key;
pane.classList.toggle('is-active', active);
if (active) {
pane.removeAttribute('hidden');
} else {
pane.setAttribute('hidden', 'hidden');
}
});
}
function init(root) {
root = root && root.jquery ? root[0] : (root || document);
var panels = root.querySelectorAll ? root.querySelectorAll('.clbi-nations-state-shell') : [];
Array.prototype.forEach.call(panels, function (panel) {
if (panel.getAttribute('data-nations-panel-ready') === '1') return;
panel.setAttribute('data-nations-panel-ready', '1');
var activeTab = panel.querySelector('.clbi-nations-state-tab.is-active[data-continent]') || panel.querySelector('.clbi-nations-state-tab[data-continent]');
if (activeTab) setActive(panel, activeTab.getAttribute('data-continent'));
panel.addEventListener('click', function (event) {
var tab = event.target.closest ? event.target.closest('.clbi-nations-state-tab[data-continent]') : null;
if (!tab || !panel.contains(tab)) return;
event.preventDefault();
setActive(panel, tab.getAttribute('data-continent'));
});
panel.addEventListener('keydown', function (event) {
if (event.key !== 'Enter' && event.key !== ' ') return;
var tab = event.target.closest ? event.target.closest('.clbi-nations-state-tab[data-continent]') : null;
if (!tab || !panel.contains(tab)) return;
event.preventDefault();
setActive(panel, tab.getAttribute('data-continent'));
});
});
}
window.CLBI_NationsPanel = { init: init, setActive: setActive };
$(init);
if (mw && mw.hook) {
mw.hook('wikipage.content').add(function ($content) {
init($content && $content[0] ? $content[0] : document);
});
}
}(window.mediaWiki, window.jQuery));