MediaWiki:Common.js: Difference between revisions
Appearance
No edit summary |
No edit summary |
||
| Line 5: | Line 5: | ||
let selectedRight = null; | let selectedRight = null; | ||
/* TABS */ | /* ================= TABS ================= */ | ||
document.querySelectorAll('.mw-tab-buttons').forEach(group => { | document.querySelectorAll('.mw-tab-buttons').forEach(group => { | ||
const buttons = group.querySelectorAll('.mw-tab-btn'); | const buttons = group.querySelectorAll('.mw-tab-btn'); | ||
buttons.forEach(btn => { | buttons.forEach(btn => { | ||
btn. | btn.onclick = function () { | ||
const tabId = this.dataset.tab; | const tabId = this.dataset.tab; | ||
const container = group.closest('.mw-tab-content') || document; | const container = group.closest('.mw-tab-content') || document; | ||
| Line 21: | Line 21: | ||
const target = container.querySelector('#' + tabId); | const target = container.querySelector('#' + tabId); | ||
if (target) target.style.display = 'block'; | if (target) target.style.display = 'block'; | ||
} | }; | ||
}); | }); | ||
if (buttons.length | if (buttons.length) buttons[0].click(); | ||
}); | }); | ||
/* DROPDOWNS */ | /* ================= DROPDOWNS (PURE CLEAN) ================= */ | ||
function | function createDropdown(targetId, label, options, side) { | ||
const | const container = document.getElementById(targetId); | ||
const button = document.createElement('button'); | const button = document.createElement('button'); | ||
const list = document.createElement('div'); | const list = document.createElement('div'); | ||
| Line 41: | Line 39: | ||
Object.keys(options).forEach(key => { | Object.keys(options).forEach(key => { | ||
const item = document.createElement('div'); | const item = document.createElement('div'); | ||
item.textContent = options[key] | item.textContent = options[key]; | ||
item.onclick = function () { | item.onclick = function () { | ||
button.textContent = options[key] | button.textContent = options[key]; | ||
list.style.display = 'none'; | list.style.display = 'none'; | ||
if ( | if (side === 'left') selectedLeft = key; | ||
if ( | if (side === 'right') selectedRight = key; | ||
updateResult(); | |||
}; | }; | ||
| Line 60: | Line 58: | ||
}; | }; | ||
container.appendChild(button); | |||
container.appendChild(list); | |||
} | |||
createDropdown("dropdown-left", "Select Mod", { | |||
flame_resonance: "Flame Resonance", | |||
} | embers: "Embers", | ||
blaze_blessing: "Blaze Blessing", | |||
burning_wrath: "Burning Wrath" | |||
}, "left"); | |||
createDropdown("dropdown-right", "Select Category", { | |||
burn: "Burn", | |||
deviant_energy: "Deviant Energy", | |||
survival: "Survival", | |||
violent: "Violent", | |||
general: "General" | |||
}, "right"); | |||
/* RESULT | /* ================= RESULT ================= */ | ||
function | function updateResult() { | ||
const result = document.getElementById( | const result = document.getElementById("combo-result"); | ||
if (!selectedLeft || !selectedRight) { | if (!selectedLeft || !selectedRight) { | ||
result.style.display = | result.style.display = "none"; | ||
return; | return; | ||
} | } | ||
result.style.display = | result.style.display = "block"; | ||
if (selectedLeft === | if (selectedLeft === "flame_resonance" && selectedRight === "burn") { | ||
result.innerHTML = "Max Burn Stack +2, Burn Duration -20%. Flash Effect: Burn DMG +5%"; | result.innerHTML = "Max Burn Stack +2, Burn Duration -20%. Flash Effect: Burn DMG +5%"; | ||
} else { | } else { | ||
Revision as of 18:34, 21 April 2026
mw.loader.using('mediawiki.util').then(function () {
$(function () {
let selectedLeft = null;
let selectedRight = null;
/* ================= TABS ================= */
document.querySelectorAll('.mw-tab-buttons').forEach(group => {
const buttons = group.querySelectorAll('.mw-tab-btn');
buttons.forEach(btn => {
btn.onclick = function () {
const tabId = this.dataset.tab;
const container = group.closest('.mw-tab-content') || document;
container.querySelectorAll('.mw-tab-content').forEach(c => c.style.display = 'none');
container.querySelectorAll('.mw-tab-btn').forEach(b => b.classList.remove('active'));
this.classList.add('active');
const target = container.querySelector('#' + tabId);
if (target) target.style.display = 'block';
};
});
if (buttons.length) buttons[0].click();
});
/* ================= DROPDOWNS (PURE CLEAN) ================= */
function createDropdown(targetId, label, options, side) {
const container = document.getElementById(targetId);
const button = document.createElement('button');
const list = document.createElement('div');
button.textContent = label;
list.style.display = 'none';
Object.keys(options).forEach(key => {
const item = document.createElement('div');
item.textContent = options[key];
item.onclick = function () {
button.textContent = options[key];
list.style.display = 'none';
if (side === 'left') selectedLeft = key;
if (side === 'right') selectedRight = key;
updateResult();
};
list.appendChild(item);
});
button.onclick = function () {
list.style.display = list.style.display === 'none' ? 'block' : 'none';
};
container.appendChild(button);
container.appendChild(list);
}
createDropdown("dropdown-left", "Select Mod", {
flame_resonance: "Flame Resonance",
embers: "Embers",
blaze_blessing: "Blaze Blessing",
burning_wrath: "Burning Wrath"
}, "left");
createDropdown("dropdown-right", "Select Category", {
burn: "Burn",
deviant_energy: "Deviant Energy",
survival: "Survival",
violent: "Violent",
general: "General"
}, "right");
/* ================= RESULT ================= */
function updateResult() {
const result = document.getElementById("combo-result");
if (!selectedLeft || !selectedRight) {
result.style.display = "none";
return;
}
result.style.display = "block";
if (selectedLeft === "flame_resonance" && selectedRight === "burn") {
result.innerHTML = "Max Burn Stack +2, Burn Duration -20%. Flash Effect: Burn DMG +5%";
} else {
result.innerHTML = "No data for this combination.";
}
}
});
});