PokeXGames

Widget:BoostCalcForm: mudanças entre as edições

Widget Discussão

Widget:BoostCalcForm (ver código-fonte)

Edição das 11h33min de 16 de agosto de 2023

8 350 bytes adicionados ,  16 de agosto de 2023
sem sumário de edição
Sem resumo de edição
Sem resumo de edição
 
(41 revisões intermediárias por 2 usuários não estão sendo mostradas)
Linha 1: Linha 1:
<style>
.mw-body-content {
    display: flex;
}
.mw-parser-output {
display: inline-block;
    padding: .5rem 2rem;
    margin: 0 auto;
    border: 30px solid transparent;
    border-image: url(https://wiki.pokexgames.com/images/3/37/Calculadora-de-Boost.png) 38;
}
</style>
<form class="boostCalc__form" data-target="calcBoostForm">
<form class="boostCalc__form" data-target="calcBoostForm">
         <div class="input-group">
         <div class="input-group">
Linha 4: Linha 19:
                 <option value="2">2</option>
                 <option value="2">2</option>
                 <option value="3">3</option>
                 <option value="3">3</option>
                <option value="4">4</option>
                 <option value="5">5</option>
                 <option value="5">5</option>
                <option value="6">6</option>
                <option value="7">7</option>
                <option value="8">8</option>
                <option value="9">9</option>
                 <option value="10">10</option>
                 <option value="10">10</option>
                <option value="15">15</option>
                <option value="20">20</option>
                <option value="25">25</option>
                <option value="30">30</option>
                <option value="50">50</option>
             </select>
             </select>


Linha 13: Linha 38:
         <div class="checkbox-group">
         <div class="checkbox-group">
             <input placeholder=" " type="checkbox" name="specialBoost" id="specialBoostCheckbox">
             <input placeholder=" " type="checkbox" name="specialBoost" id="specialBoostCheckbox">
             <label for="specialBoostCheckbox">Você irá usar metal, crystal ou ancient stone ?</label>
             <label for="specialBoostCheckbox">Marque se você irá usar metal, crystal ou ancient stone!</label>
         </div>
         </div>


        <div class="boostTo-container">
            <div class="input-group">
                <input placeholder=" " value="0" name="startBoost" id="startBoost" required class="boostCalc__input" min="0" max="49"
                    type="number">
                <label class="boostCalc__label" for="startBoost">Digite o boost atual</label>
            </div>
           
            <div>
                <img src="https://wiki.pokexgames.com/images/a/a0/Seta-Calculadora.png" alt="Seta">
            </div>


        <div class="input-group">
            <div class="input-group">
            <input placeholder=" " name="stonePrice" id="stonePrice" class="boostCalc__input" type="number">
                <input placeholder=" " value="50" name="endBoost" id="endBoost" required class="boostCalc__input" min="1" max="50"
            <label class="boostCalc__label" for="stonePrice">Digite o preço da stone (Opcional)</label>
                    type="number">
        </div>
                <label class="boostCalc__label" for="endBoost">Digite o boost desejado</label>
 
            </div>
        <div class="input-group">
            <input placeholder=" " name="stonePrice" id="stonePrice" class="boostCalc__input" type="number">
            <label class="boostCalc__label" for="stonePrice">Digite o preço da Boost stone (Opcional)</label>
         </div>
         </div>


         <div class="input-group">
         <div class="input-group">
             <input placeholder=" " name="startBoost" id="startBoost" class="boostCalc__input" min="0" max="49"
             <input placeholder=" " name="stonePrice" id="stonePrice" step="0.01" class="boostCalc__input" type="number">
                type="number">
             <label class="boostCalc__label" for="stonePrice">Digite o preço da stone (Ex: 8)</label>
             <label class="boostCalc__label" for="startBoost">Digite o boost atual</label>
         </div>
         </div>


         <div class="input-group">
         <div class="input-group">
             <input placeholder=" " name="endBoost" id="endBoost" class="boostCalc__input" min="1" max="50"
             <input placeholder=" " name="boostStonePrice" id="boostStonePrice" step="0.01" class="boostCalc__input" type="number">
                type="number">
             <label class="boostCalc__label" for="boostStonePrice">Digite o preço da Boost stone (Ex: 180)</label>
             <label class="boostCalc__label" for="endBoost">Digite o boost desejado</label>
         </div>
         </div>


<div class="d-flex justify-center">
<div class="d-flex justify-center align-center flex-column">
<button type="submit" class="hover-minimize" style="background:none;border:none;margin-top:1.5rem;cursor:pointer;border-radius:12px;">
<button type="submit" class="hover-minimize" style="background:none;border:none;margin-top:1.5rem;cursor:pointer;">
<img src="http://51.161.108.38/images/d/d3/Banner_calculadora.png" alt="Imagem botão calcular boost" />
<img style="border-radius:12px;" src="https://wiki.pokexgames.com/images/d/d3/Banner_calculadora.png" alt="Imagem botão calcular boost" />
</button>
</button>
<a href="javascript:void(0);" data-target="clearForm" class="mt-1"> Limpar campos </a>
</div>
</div>
     </form>
     </form>
<div data-target="boostCalc-resultContainer" class="boostCalc__resultContainer d-none mt-2">
<h5 class="boostCalc__resultTitle">Resultado</h5>
<h6 data-target="boostCalc-result" class="boostCalc__result"></h6>
</div>
<script>
      // Função para formatar numeros para o padrão decimal
        const formatNumber = (number) => Number(number).toLocaleString("pt-BR", { style: "decimal" });
       
        document.querySelector("[data-target='clearForm']").addEventListener("click", function() {
            document.getElementById("boostType").value = "2";
            document.getElementById("specialBoostCheckbox").checked= false;
            document.getElementById("startBoost").value = "0";
            document.getElementById("endBoost").value = "50";
            document.getElementById("stonePrice").value = "";
            document.getElementById("boostStonePrice").value = "";
            document.querySelector("[data-target='boostCalc-resultContainer']").classList.add("d-none");
        });
        // Função que retorna o calculo de gasto para boostar um pokemon (Forma normal)
function calcNormalBoost(initBoost, endBoost, boostType, stonePrice, boostStonePrice) {
    const responseBoost = [];
    let usedNormalStones = 0;
    let usedBoostStones = 0;
    let stonesForBoost = 0;
    for (i = 0; i <= initBoost; i++) {
        if (i % boostType === 0) stonesForBoost++;
    }
    for (i = initBoost + 1; i <= endBoost; i++) {   
        if ((stonesForBoost * stonePrice) < boostStonePrice) {
            usedNormalStones += stonesForBoost;
        } else {
            usedBoostStones++;
        }
        if (i % boostType == 0 && i != initBoost) stonesForBoost++;
        responseBoost.push(
            {
                price: (usedNormalStones * stonePrice) + (usedBoostStones * boostStonePrice),
                normal_stones: usedNormalStones,
                boost_stones: usedBoostStones,
                boost: i
            }
        );
    }
    return responseBoost;
}
        // Função que retorna o calculo de gasto para boostar um pokemon (Exceção)
        function calcExceptionBoost(initBoost, endBoost, boostType, stonePrice, boostStonePrice) {
            const responseBoost = [];
            let usedNormalStones = 0;
            let usedBoostStones = 0;
            let stonesForBoost = 1;
            for (i = 1; i <= initBoost; i++) {
                if (i < 10) continue;
                if (i % boostType === 0) stonesForBoost++;
            }
            for (i = initBoost + 1; i <= endBoost; i++) {
                if (i < 10) {
                    if (!(i % 2 === 0)) {
                        responseBoost.push(
                            {
                                price: null,
                                necessary_stones: null,
                                boost: i
                            }
                        );
                        continue;
                    }
                    if ((stonesForBoost * stonePrice) < boostStonePrice) {
                        usedNormalStones += stonesForBoost;
                    } else {
                        usedBoostStones++;
                    }
                    responseBoost.push(
                        {
                            price: (usedNormalStones * stonePrice) + (usedBoostStones * boostStonePrice),
                            normal_stones: usedNormalStones,
                            boost_stones: usedBoostStones,
                            boost: i
                        }
                    );
                    continue;
                }
                if ((stonesForBoost * stonePrice) < boostStonePrice) {
                    usedNormalStones += stonesForBoost;
                } else {
                    usedBoostStones++;
                }
                if (i % boostType === 0) stonesForBoost++;
                responseBoost.push(
                    {
                        price: (usedNormalStones * stonePrice) + (usedBoostStones * boostStonePrice),
                        normal_stones: usedNormalStones,
                        boost_stones: usedBoostStones,
                        boost: i
                    }
                );
            }
            return responseBoost;
        }
        document.addEventListener('DOMContentLoaded', function () {
            const resultArea = document.querySelector("[data-target='boostCalc-result']");
            const form = document.querySelector("[data-target='calcBoostForm']");
            form.addEventListener("submit", function (e) {
                e.preventDefault();
                let result;
                const formData = new FormData(form);
                const boostType = Number(formData.get("boostType"));
                const specialBoost = formData.get("specialBoost");
                const stonePrice = formData.get("stonePrice") ? Number(formData.get("stonePrice")) > 1000 ? Number(formData.get("stonePrice")) / 1000 : Number(formData.get("stonePrice")) : 0;
                const boostStonePrice = formData.get("boostStonePrice") ? Number(formData.get("boostStonePrice")) > 1000 ? Number(formData.get("boostStonePrice")) / 1000 : Number(formData.get("boostStonePrice")) : 9999999;
                const startBoost = Number(formData.get("startBoost"));
                const endBoost = Number(formData.get("endBoost"));
                if (startBoost > endBoost) {
                    alert("O boost inicial não pode ser maior do que o final");
                    return;
                }
                if (specialBoost == "on") {
                    result = calcExceptionBoost(startBoost, endBoost, boostType, stonePrice, boostStonePrice);
                    resultArea.innerHTML = `
                      Pedras comuns: <span class=""> ${result[result.length - 1].normal_stones} </span>
                      Pedras de boost: <span class=""> ${result[result.length - 1].boost_stones} </span>
                      Custo total: <span class=""> ${result[result.length - 1].price >= 1000 ? `${formatNumber(result[result.length - 1].price / 1000)} KK` : `${formatNumber(result[result.length - 1].price)} K`}</span>
                    `;
                } else {
                    result = calcNormalBoost(startBoost, endBoost, boostType, stonePrice, boostStonePrice);
                    resultArea.innerHTML = `
                      Pedras comuns: <span class=""> ${result[result.length - 1].normal_stones} </span>
                      Pedras de boost: <span class=""> ${result[result.length - 1].boost_stones} </span>
                      Custo total: <span class=""> ${result[result.length - 1].price >= 1000 ? `${formatNumber(result[result.length - 1].price / 1000)} KK` : `${formatNumber(result[result.length - 1].price / 1000)} K`}</span>
                    `;
                }
              // console.log("Relação de boost a boost:");
              // console.log(result);
              document.querySelector("[data-target='boostCalc-resultContainer']").classList.remove("d-none");
            });
        });       
</script>
Disponível em “https://wiki.pokexgames.com/index.php/Especial:MobileDiff/61265...67897”