More actions
No edit summary |
No edit summary |
||
Line 25: | Line 25: | ||
function initialise(root, data) { | function initialise(root, data) { | ||
const levelData = data.LEVELS || {}; | |||
const levels = Object.keys(levelData).map(Number).sort((a, b) => a - b); | |||
if (!levels.length) { | if (!levels.length) { | ||
Line 59: | Line 57: | ||
output.empty(); | output.empty(); | ||
const entry = | const entry = levelData[level]; | ||
if (!entry) { | if (!entry) { | ||
output.text('No data for this level.'); | output.text('No data for this level.'); |
Revision as of 05:38, 7 July 2025
/*
* Gadget: VaultAltarComponent
* ----------------------------
* Activated only when a <div class="js-vault-altar" id="vault-altar-component"> is present.
* Loads Vault altar data from: MediaWiki:Vault_altar_ingredients.json
*/
(function () {
const JSON_PAGE = 'MediaWiki:Vault_altar_ingredients.json';
$(function () {
const host = document.querySelector('.js-vault-altar#vault-altar-component');
if (!host) return;
$.getJSON(getRawURL(JSON_PAGE, 'application/json'))
.done(data => initialise(host, data))
.fail(() => host.textContent = '❌ Could not load altar data.');
});
function getRawURL(title, type) {
return mw.util.wikiScript() +
'?title=' + encodeURIComponent(title) +
'&action=raw&ctype=' + encodeURIComponent(type || 'text/plain');
}
function initialise(root, data) {
const levelData = data.LEVELS || {};
const levels = Object.keys(levelData).map(Number).sort((a, b) => a - b);
if (!levels.length) {
root.textContent = 'No data.';
return;
}
const defaultLevel = levels[0];
console.log('[VaultAltar] Default level to show:', defaultLevel);
const header = $('<div>', { class: 'vault-altar-header' }).appendTo(root);
header.append('<span>Vault Level </span>');
const valueEl = $('<span>', { class: 'vault-altar-slider-value' }).appendTo(header);
const slider = $('<input>', {
type: 'range',
min: levels[0],
max: levels[levels.length - 1],
value: levels[0],
class: 'vault-altar-level-slider'
}).appendTo(header);
const output = $('<div>', { class: 'vault-altar-output' }).appendTo(root);
slider.on('input change', () => render(+slider.val()));
render(levels[0]);
function render(level) {
valueEl.text(level);
output.empty();
const entry = levelData[level];
if (!entry) {
output.text('No data for this level.');
return;
}
Object.keys(entry).forEach(category => {
const catBox = $('<div>', { class: 'vault-altar-category' }).appendTo(output);
$('<h3>').text(capitalise(category)).appendTo(catBox);
const table = $('<table>', { class: 'vault-altar-table' }).appendTo(catBox);
table.append('<thead><tr><th>Item</th><th>Amount</th></tr></thead>');
const tbody = $('<tbody>').appendTo(table);
(entry[category] || []).forEach(row => {
$('<tr>')
.append($('<td>').text(row.item))
.append($('<td>').text(row.amount))
.appendTo(tbody);
});
});
}
}
function capitalise(str) {
return str.charAt(0).toUpperCase() + str.slice(1);
}
})();