MediaWiki:Gadget-gadvia-score-calculator.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

/* Finds elements by a selector and executes a function for each element */
function findAndExecute(selector, callback) {
    const elements = document.querySelectorAll(selector);
    elements.forEach((element) => {
        try {
            callback(element);
        } catch (e) {
            console.error(`Error while initializing "${selector}"`, e);
        }
    });
}

/* Gadvia Score Calculator */

findAndExecute(".rgwiki-gadvia-score-calculator", (root) => {
    root.textContent = "";

    function createFormField(root, labelText) {
        const fieldContainer = document.createElement("div");
        fieldContainer.classList.add("rgwiki-gadvia-score-calculator-field-container");

        const label = document.createElement("label");
        label.textContent = labelText;
        fieldContainer.appendChild(label);

        const inputElement = document.createElement("input");
        inputElement.type = "number";
        inputElement.size = 8;
        fieldContainer.appendChild(inputElement);

        root.appendChild(fieldContainer);
        return inputElement;
    }

    const fields = document.createElement("div");
    fields.classList.add("rgwiki-gadvia-score-calculator-fields");

    const inputGoldPerfect = createFormField(fields, "Gold Perfect");
    const inputAnyPerfect = createFormField(fields, "Any Perfect");
    const inputGreat = createFormField(fields, "Great");
    const inputGood = createFormField(fields, "Good");
    const inputMiss = createFormField(fields, "Miss");

    const calculateBtn = document.createElement("button");
    calculateBtn.textContent = "Calculate";
    fields.appendChild(calculateBtn);

    root.appendChild(fields);

    const output = document.createElement("p");
    root.appendChild(output);

    calculateBtn.addEventListener("click", () => {
        const goldPerfect = Number(inputGoldPerfect.value);
        const anyPerfect = Number(inputAnyPerfect.value);
        const great = Number(inputGreat.value);
        const good = Number(inputGood.value);
        const miss = Number(inputMiss.value);
        const hitNotes = anyPerfect + great + good;
        const totalNotes = anyPerfect + great + good + miss;
        const nonGoldPerfect = anyPerfect - goldPerfect;
        const score = Math.floor((anyPerfect + (great * 0.8) + (good * 0.5)) / totalNotes * 1000000) + (goldPerfect * 0.0001);
        output.innerHTML = `<b>Score:</b> ${score}<br><b>Hit notes:</b> ${hitNotes}/${totalNotes}<br><b>Non-gold perfects:</b> ${nonGoldPerfect}`;
    });
});