MediaWiki:ClassMasteryCalculator.js: Difference between revisions

From EQOA Sandstorm Wiki
Jump to navigationJump to search
(Created page with "mw.hook('wikipage.content').add(function () { function waitForCMData(attemptsLeft) { if (window.EQOA_CM_DATA) { initClassMasteryCalculator(); return; } if (attemptsLeft <= 0) { var app = document.getElementById('cm-calculator-app'); if (app) { app.innerHTML = '<div style="color:red;">EQOA_CM_DATA failed to load.</div>'; } return; } setTim...")
 
No edit summary
Line 39: Line 39:
                     <select id="cm-class"></select>
                     <select id="cm-class"></select>


                     <label>CM Points</label>
                     <label>Character Level</label>
                    <input type="number" id="cm-points" min="0" max="60" value="60" style="width:70px;">
<input type="number" id="cm-level" min="1" max="60" value="60" style="width:70px;">
                 </div>
                 </div>


Line 67: Line 67:
         var raceSelect = document.getElementById('cm-race');
         var raceSelect = document.getElementById('cm-race');
         var classSelect = document.getElementById('cm-class');
         var classSelect = document.getElementById('cm-class');
         var pointsInput = document.getElementById('cm-points');
         var levelInput = document.getElementById('cm-level');


         function addOption(select, value, label) {
         function addOption(select, value, label) {
Line 78: Line 78:
         function loadRaces() {
         function loadRaces() {
             raceSelect.innerHTML = '';
             raceSelect.innerHTML = '';


             Object.keys(data.raceClasses).forEach(function (race) {
             Object.keys(data.raceClasses).forEach(function (race) {
Line 105: Line 104:


         function getAvailablePoints() {
         function getAvailablePoints() {
            var points = parseInt(pointsInput.value, 10);
    var level = parseInt(levelInput.value, 10);


            if (isNaN(points) || points < 0) points = 0;
    if (isNaN(level) || level < 1) level = 1;
            if (points > data.maxPoints) points = data.maxPoints;
    if (level > 60) level = 60;


            pointsInput.value = points;
    levelInput.value = level;
            return points;
 
        }
    return level * 25;
}


         function updateSummary() {
         function updateSummary() {
Line 135: Line 135:
         raceSelect.addEventListener('change', loadClasses);
         raceSelect.addEventListener('change', loadClasses);
         classSelect.addEventListener('change', updateSummary);
         classSelect.addEventListener('change', updateSummary);
         pointsInput.addEventListener('input', updateSummary);
         levelInput.addEventListener('input', updateSummary);


         loadRaces();
         loadRaces();

Revision as of 17:52, 14 May 2026

mw.hook('wikipage.content').add(function () {

    function waitForCMData(attemptsLeft) {
        if (window.EQOA_CM_DATA) {
            initClassMasteryCalculator();
            return;
        }

        if (attemptsLeft <= 0) {
            var app = document.getElementById('cm-calculator-app');
            if (app) {
                app.innerHTML = '<div style="color:red;">EQOA_CM_DATA failed to load.</div>';
            }
            return;
        }

        setTimeout(function () {
            waitForCMData(attemptsLeft - 1);
        }, 100);
    }

    waitForCMData(30);

    function initClassMasteryCalculator() {
        var app = document.getElementById('cm-calculator-app');
        if (!app) return;

        var data = window.EQOA_CM_DATA;

        app.innerHTML = `
            <div class="cm-calculator-box">
                <div class="character-builder-title">Class Mastery Calculator</div>

                <div class="character-builder-controls">
                    <label>Race</label>
                    <select id="cm-race"></select>

                    <label>Class</label>
                    <select id="cm-class"></select>

                    <label>Character Level</label>
<input type="number" id="cm-level" min="1" max="60" value="60" style="width:70px;">
                </div>

                <div class="character-builder-section-title" style="margin-top:15px;">Point Summary</div>

                <table class="character-builder-stat-table">
                    <tr>
                        <th>Available</th>
                        <th>Spent</th>
                        <th>Remaining</th>
                    </tr>
                    <tr>
                        <td id="cm-available">60</td>
                        <td id="cm-spent">0</td>
                        <td id="cm-remaining">60</td>
                    </tr>
                </table>

                <div class="character-builder-section-title" style="margin-top:18px;">Class Masteries</div>
                <div id="cm-mastery-panel" class="character-builder-warning-box">
                    Select a race and class to begin.
                </div>
            </div>
        `;

        var raceSelect = document.getElementById('cm-race');
        var classSelect = document.getElementById('cm-class');
        var levelInput = document.getElementById('cm-level');

        function addOption(select, value, label) {
            var option = document.createElement('option');
            option.value = value;
            option.textContent = label;
            select.appendChild(option);
        }

        function loadRaces() {
            raceSelect.innerHTML = '';

            Object.keys(data.raceClasses).forEach(function (race) {
                addOption(raceSelect, race, race);
            });

            loadClasses();
        }

        function loadClasses() {
            classSelect.innerHTML = '';

            var race = raceSelect.value;
            var classList = data.raceClasses[race] || [];

            classList.forEach(function (classCode) {
                addOption(
                    classSelect,
                    classCode,
                    classCode + ' - ' + (data.classes[classCode] || classCode)
                );
            });

            updateSummary();
        }

        function getAvailablePoints() {
    var level = parseInt(levelInput.value, 10);

    if (isNaN(level) || level < 1) level = 1;
    if (level > 60) level = 60;

    levelInput.value = level;

    return level * 25;
}

        function updateSummary() {
            var available = getAvailablePoints();
            var spent = 0;
            var remaining = available - spent;

            document.getElementById('cm-available').textContent = available;
            document.getElementById('cm-spent').textContent = spent;
            document.getElementById('cm-remaining').textContent = remaining;

            var masteryPanel = document.getElementById('cm-mastery-panel');

            masteryPanel.innerHTML =
                '<b>Selected:</b> ' +
                raceSelect.value +
                ' ' +
                classSelect.value +
                '<br><br>Mastery trees will go here.';
        }

        raceSelect.addEventListener('change', loadClasses);
        classSelect.addEventListener('change', updateSummary);
        levelInput.addEventListener('input', updateSummary);

        loadRaces();
    }

});