MediaWiki:Common.js: Difference between revisions
Jump to navigation
Jump to search
No edit summary Tag: Reverted |
No edit summary Tag: Reverted |
||
| Line 1: | Line 1: | ||
/* Any JavaScript here will be loaded for all users on every page load. */ | /* Any JavaScript here will be loaded for all users on every page load. */ | ||
function | function setupLevelSliderSpan(wrapperSelector, min, max) { | ||
const wrapper = document.querySelector(wrapperSelector); | |||
if (!wrapper) return; | |||
const valueDisplay = wrapper.querySelector('.levelValue'); | const valueDisplay = wrapper.querySelector('.levelValue'); | ||
const increase = wrapper.querySelector('.increase'); | const increase = wrapper.querySelector('.increase'); | ||
const decrease = wrapper.querySelector('.decrease'); | const decrease = wrapper.querySelector('.decrease'); | ||
if ( | if (!valueDisplay || !increase || !decrease) return; | ||
const updateDisplay = () => { | |||
valueDisplay.textContent = valueDisplay.dataset.value; | |||
} | }; | ||
increase.addEventListener('click', () => { | increase.addEventListener('click', () => { | ||
let current = parseInt(valueDisplay.dataset.value); | |||
if (current < max) valueDisplay.dataset.value = current + 1; | |||
updateDisplay(); | |||
}); | }); | ||
decrease.addEventListener('click', () => { | decrease.addEventListener('click', () => { | ||
let current = parseInt(valueDisplay.dataset.value); | |||
if (current > min) valueDisplay.dataset.value = current - 1; | |||
updateDisplay(); | |||
}); | }); | ||
// initialize display | // initialize display | ||
updateDisplay(); | |||
} | } | ||
document.addEventListener('DOMContentLoaded', | // On page load | ||
document.addEventListener('DOMContentLoaded', () => { | |||
setupLevelSliderSpan('.level-slider-wrapper', 1, 10); | |||
}); | |||
Revision as of 21:54, 18 December 2025
/* Any JavaScript here will be loaded for all users on every page load. */
function setupLevelSliderSpan(wrapperSelector, min, max) {
const wrapper = document.querySelector(wrapperSelector);
if (!wrapper) return;
const valueDisplay = wrapper.querySelector('.levelValue');
const increase = wrapper.querySelector('.increase');
const decrease = wrapper.querySelector('.decrease');
if (!valueDisplay || !increase || !decrease) return;
const updateDisplay = () => {
valueDisplay.textContent = valueDisplay.dataset.value;
};
increase.addEventListener('click', () => {
let current = parseInt(valueDisplay.dataset.value);
if (current < max) valueDisplay.dataset.value = current + 1;
updateDisplay();
});
decrease.addEventListener('click', () => {
let current = parseInt(valueDisplay.dataset.value);
if (current > min) valueDisplay.dataset.value = current - 1;
updateDisplay();
});
// initialize display
updateDisplay();
}
// On page load
document.addEventListener('DOMContentLoaded', () => {
setupLevelSliderSpan('.level-slider-wrapper', 1, 10);
});