MediaWiki:Common.js

/* Any JavaScript here will be loaded for all users on every page load. */

$(document).ready(function() {         
	build_skill_form();
});
 
function build_skill_form() {
    if (skill_data[mw.config.get("wgPageName")]) {
        calculator_element = document.getElementById("skill_calculator");
        calculator_element.outerHTML =
            '<div id="skill_calculator" style="position:absolute"><table><tr>' +
                '<td rowspan="2" style="background:rgba(128, 128, 128, 0);width:52px;height:52px"></td>' +
                '<td colspan="2" style="background:none">&#8199;</td>' +
            '</tr><tr>' +
                '<td style="padding-left: 10px"><select style=“background:rgba(255, 182, 0, 1);color:rgba(128, 128, 128, 1);width:50px;text-align:center" id="skill_level" onchange="display_data()">' +
                    '<option value="0">Lv. 1</option>' +
                    '<option value="1">Lv. 2</option>' +
                    '<option value="2">Lv. 3</option>' +
                    '<option value="3">Lv. 4</option>' +
                    '<option value="4">Lv. 5</option>' +
                    '<option value="5">Lv. 6</option>' +
                    '<option value="6">Lv. 7</option>' +
                    '<option value="7">Lv. 8</option>' +
                    '<option value="8">Lv. 9</option>' +
                    '<option value="9">Lv. 10</option>' +
                '</select></td><td id="activation"></td></tr><tr></tr></table><p id="description"></p></div>';
        display_data();
    }
}
 
function display_data() {
    data = skill_data[mw.config.get("wgPageName")];
    if (data !== null) {
        index = document.getElementById("skill_level").value;
        regex = /\(\$\w+\)/g;
        formatted_text = data.text;
        vars = data.text.match(regex);
        for (i = 0; i < vars.length; i++) {
            var_name = vars[i].substring(2, vars[i].length - 1);
            formatted_text = formatted_text.replace(
                vars[i],
                data[var_name][index]);
        }
        document.getElementById("activation").outerHTML =
            '<td id="activation" style="color:rgba(255, 182, 0, 1)">' + data.activation[index] + '% chance to activate</td>';
        document.getElementById("description").outerHTML =
            '<p id="description">' + formatted_text + '</p>';
    }
}
 
skill_data = {
    'Kar98k': {
        text: "After taking aim for 2 seconds, shoot the nearest target for ($damage_value) the damage.",
        activation: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
        damage_value: [2, 4, 6, 8, 10, 12, 14, 16, 18, 20],
        time: [2.0, 2.1, 2.2, 2.3, 2.4, 2.5, 2.6, 2.7, 2.8, 2.9],
    },
};