MediaWiki:Common.js: Difference between revisions

From Roat Pkz
Jump to navigation Jump to search
No edit summary
No edit summary
Line 1: Line 1:
// --- COMMON.JS CLEANED AND UPDATED ---
// COMMON.JS MINIMAL SAFE VERSION
 
document.addEventListener("DOMContentLoaded", function() {
// --- Dropdown-based Tier Assignment ---
     console.log("✅ Common.js Loaded");
mw.loader.using('jquery').then(function () {
     console.log("✅ Dropdown-based Tier Assignment is running");
 
    document.addEventListener('DOMContentLoaded', function () {
        function moveItemToTier(itemId, tierId) {
            var item = document.getElementById(itemId);
            var targetTier = document.getElementById(tierId);
            if (item && targetTier) {
                targetTier.appendChild(item);
            }
        }


        var selectors = document.querySelectorAll('.tier-selector');
    // --- Tier Assignment ---
        selectors.forEach(function(sel) {
    document.querySelectorAll('.tier-selector').forEach(function(sel) {
            sel.addEventListener('change', function () {
        sel.addEventListener('change', function() {
                moveItemToTier(this.id, this.value);
            const item = document.getElementById(this.id);
             });
            const targetTier = document.getElementById(this.value);
             if (item && targetTier) targetTier.appendChild(item);
         });
         });
     });
     });
});


// --- Bingo JS ---
    // --- Bingo ---
mw.loader.using('mediawiki.util', function () {
    document.querySelectorAll(".bingo-table td .lighttable-cell").forEach(function(tile) {
    document.addEventListener("DOMContentLoaded", function () {
        const id = tile.dataset.key || tile.id;
        console.log("✅ Bingo JS Loaded");
        if (!id) return;
        if (localStorage.getItem(id) === "selected") tile.classList.add("bingo-selected");


         var tiles = document.querySelectorAll(".bingo-table td .lighttable-cell");
         tile.addEventListener("click", function() {
        tiles.forEach(function(tile) {
             tile.classList.toggle("bingo-selected");
             var id = tile.dataset.key || tile.id;
             if (tile.classList.contains("bingo-selected")) {
            if (!id) return;
                 localStorage.setItem(id, "selected");
 
            } else {
             if (localStorage.getItem(id) === "selected") {
                localStorage.removeItem(id);
                 tile.classList.add("bingo-selected");
             }
             }
            tile.addEventListener("click", function () {
                tile.classList.toggle("bingo-selected");
                if (tile.classList.contains("bingo-selected")) {
                    localStorage.setItem(id, "selected");
                } else {
                    localStorage.removeItem(id);
                }
            });
         });
         });
     });
     });
});


// --- Skill XP Calculator ---
    // --- Skill XP Calculator ---
document.addEventListener("DOMContentLoaded", function() {
     document.querySelectorAll(".skill-info-calc").forEach(function(table){
     var tables = document.querySelectorAll(".skill-info-calc");
         const xpPerAction = parseInt(table.querySelector("span.total-xp").textContent);
    tables.forEach(function(table){
         const numActionsElem = table.querySelector(".num-actions");
         var xpPerAction = parseInt(table.querySelector("span.total-xp").textContent);
         const totalXPElem = table.querySelector(".total-xp");
         var numActionsElem = table.querySelector(".num-actions");
         var totalXPElem = table.querySelector(".total-xp");


         table.querySelector(".increase").addEventListener("click", function() {
         table.querySelector(".increase").addEventListener("click", function() {
             var actions = parseInt(numActionsElem.textContent) + 1;
             let actions = parseInt(numActionsElem.textContent) + 1;
             numActionsElem.textContent = actions;
             numActionsElem.textContent = actions;
             totalXPElem.textContent = actions * xpPerAction;
             totalXPElem.textContent = actions * xpPerAction;
Line 64: Line 41:


         table.querySelector(".decrease").addEventListener("click", function() {
         table.querySelector(".decrease").addEventListener("click", function() {
             var actions = parseInt(numActionsElem.textContent) - 1;
             let actions = parseInt(numActionsElem.textContent) - 1;
             if (actions < 0) actions = 0;
             if (actions < 0) actions = 0;
             numActionsElem.textContent = actions;
             numActionsElem.textContent = actions;
Line 70: Line 47:
         });
         });
     });
     });
});


// --- Simple Calculator ---
    // --- Simple Calculator ---
document.addEventListener("DOMContentLoaded", function() {
     const container = document.getElementById("calcContainer");
     const container = document.getElementById("calcContainer");
     if (!container) return;
     if (container) {
        container.innerHTML = `
            <div style="margin:10px 0;">
                <label>Num1: <input type="number" id="num1" value="0" style="width:60px;"></label>
                <label>Num2: <input type="number" id="num2" value="0" style="width:60px;"></label>
                <label>Operation:
                    <select id="op">
                        <option value="+">+</option>
                        <option value="-">-</option>
                        <option value="*">*</option>
                        <option value="/">/</option>
                    </select>
                </label>
                <button id="calcButton">Calculate</button>
            </div>
            <div>Result: <span id="result">0</span></div>
        `;


    // Build calculator HTML dynamically
        document.getElementById("calcButton").addEventListener("click", function() {
    container.innerHTML = `
             const a = parseFloat(document.getElementById("num1").value);
        <div style="margin:10px 0;">
             const b = parseFloat(document.getElementById("num2").value);
             <label>Num1: <input type="number" id="num1" value="0" style="width:60px;"></label>
             const op = document.getElementById("op").value;
             <label>Num2: <input type="number" id="num2" value="0" style="width:60px;"></label>
             let result;
             <label>Operation:
                <select id="op">
                    <option value="+">+</option>
                    <option value="-">-</option>
                    <option value="*">*</option>
                    <option value="/">/</option>
                </select>
             </label>
            <button id="calcButton">Calculate</button>
        </div>
        <div>Result: <span id="result">0</span></div>
    `;


    // Add calculator functionality
            if (isNaN(a) || isNaN(b)) {
    const btn = document.getElementById("calcButton");
                result = "Enter valid numbers";
    btn.addEventListener("click", function() {
            } else {
        const a = parseFloat(document.getElementById("num1").value);
                switch(op) {
        const b = parseFloat(document.getElementById("num2").value);
                    case "+": result = a + b; break;
        const op = document.getElementById("op").value;
                    case "-": result = a - b; break;
        let result;
                    case "*": result = a * b; break;
 
                    case "/": result = b !== 0 ? a / b : "∞"; break;
        if (isNaN(a) || isNaN(b)) {
                    default: result = "Error";
            result = "Enter valid numbers";
                }
        } else {
            switch(op) {
                case "+": result = a + b; break;
                case "-": result = a - b; break;
                case "*": result = a * b; break;
                case "/": result = b !== 0 ? a / b : "∞"; break;
                default: result = "Error";
             }
             }
        }
            document.getElementById("result").textContent = result;
        document.getElementById("result").textContent = result;
        });
    });
    }
});
});

Revision as of 02:33, 5 March 2026

// COMMON.JS MINIMAL SAFE VERSION
document.addEventListener("DOMContentLoaded", function() {
    console.log("✅ Common.js Loaded");

    // --- Tier Assignment ---
    document.querySelectorAll('.tier-selector').forEach(function(sel) {
        sel.addEventListener('change', function() {
            const item = document.getElementById(this.id);
            const targetTier = document.getElementById(this.value);
            if (item && targetTier) targetTier.appendChild(item);
        });
    });

    // --- Bingo ---
    document.querySelectorAll(".bingo-table td .lighttable-cell").forEach(function(tile) {
        const id = tile.dataset.key || tile.id;
        if (!id) return;
        if (localStorage.getItem(id) === "selected") tile.classList.add("bingo-selected");

        tile.addEventListener("click", function() {
            tile.classList.toggle("bingo-selected");
            if (tile.classList.contains("bingo-selected")) {
                localStorage.setItem(id, "selected");
            } else {
                localStorage.removeItem(id);
            }
        });
    });

    // --- Skill XP Calculator ---
    document.querySelectorAll(".skill-info-calc").forEach(function(table){
        const xpPerAction = parseInt(table.querySelector("span.total-xp").textContent);
        const numActionsElem = table.querySelector(".num-actions");
        const totalXPElem = table.querySelector(".total-xp");

        table.querySelector(".increase").addEventListener("click", function() {
            let actions = parseInt(numActionsElem.textContent) + 1;
            numActionsElem.textContent = actions;
            totalXPElem.textContent = actions * xpPerAction;
        });

        table.querySelector(".decrease").addEventListener("click", function() {
            let actions = parseInt(numActionsElem.textContent) - 1;
            if (actions < 0) actions = 0;
            numActionsElem.textContent = actions;
            totalXPElem.textContent = actions * xpPerAction;
        });
    });

    // --- Simple Calculator ---
    const container = document.getElementById("calcContainer");
    if (container) {
        container.innerHTML = `
            <div style="margin:10px 0;">
                <label>Num1: <input type="number" id="num1" value="0" style="width:60px;"></label>
                <label>Num2: <input type="number" id="num2" value="0" style="width:60px;"></label>
                <label>Operation:
                    <select id="op">
                        <option value="+">+</option>
                        <option value="-">-</option>
                        <option value="*">*</option>
                        <option value="/">/</option>
                    </select>
                </label>
                <button id="calcButton">Calculate</button>
            </div>
            <div>Result: <span id="result">0</span></div>
        `;

        document.getElementById("calcButton").addEventListener("click", function() {
            const a = parseFloat(document.getElementById("num1").value);
            const b = parseFloat(document.getElementById("num2").value);
            const op = document.getElementById("op").value;
            let result;

            if (isNaN(a) || isNaN(b)) {
                result = "Enter valid numbers";
            } else {
                switch(op) {
                    case "+": result = a + b; break;
                    case "-": result = a - b; break;
                    case "*": result = a * b; break;
                    case "/": result = b !== 0 ? a / b : "∞"; break;
                    default: result = "Error";
                }
            }
            document.getElementById("result").textContent = result;
        });
    }
});