critcalc.html

<script>

function calculate() {
    let cr = document.getElementById('cr').value; // crit rate
    let cdmg = document.getElementById('cdmg').value; // cri tdamage
    let br = document.getElementById('br').value; // break rate
    let ig = document.getElementById('ig').value; // block ignoring
    let brs = document.getElementById('brs').value; // block recovery suppression

    let ten = document.getElementById('ten').value;
    let cdmgr = document.getElementById('cdmgr').value; // crit dmg reduction
    let block = document.getElementById('blk').value;
    let brecov = document.getElementById('brecov').value; // block recovery
    let bdr = document.getElementById('bdr').value; // block dmg reduction

    cr = Number(cr);
    br = Number(br);
    ig = Number(ig);
    brs = Number(brs);
    cdmg = 150 + Number(cdmg);
    ten = Number(ten);
    block = Number(block);
    brecov = Number(brecov);
    bdr = Number(bdr);

    if (cdmgr) cdmg -= cdmgr;
    if (cdmg < 100) cdmg = 100;
    if (bdr) ig -= bdr;
    if (brs) brecov -= brs;
    if (brecov > 100) brecov = 100;

    let net_cr = cr - ten;
    let net_bl = block - br;

    net_cr = net_cr < 0 ? 0 : net_cr;
    net_bl = net_bl < 0 ? 0 : net_bl; 

    // console.log(cr, br, ten, block)
    // console.log(net_cr, net_bl)

    let output = '', analysis = '';

    // new formula for over 100 <strong>total</strong>
    if (net_cr + net_bl > 100) {
        // box 1

        let crit_rate = net_cr / (net_cr + net_bl);
        let block_rate = net_bl / (net_cr + net_bl)

        let crit_chance = crit_rate > 100 ? 100 : crit_rate;
        // console.log('fin', crit_rate, block_rate);

        output += `Chance of landing a <strong>critical hit</strong>: ${(crit_chance * 100).toFixed(2)}%<br />`;
        output += `If an attack does not crit, chance of landing a <strong>blocked hit</strong>: ${((block_rate > 100 ? 100 : block_rate) * 100).toFixed(2)}%<br />`;
        
        output +="<br />"
        output += `Overall chances:<br />`


        let white_chance = (1 - crit_chance) * (1 - block_rate);
        let block_chance = (1 - crit_chance) * block_rate;
        let blocked_damage = (1 - (0.5 * (1 - (ig / 100)))) * (1 - brecov / 100)
        let total_dmg = (crit_chance) * (cdmg / 100) + (white_chance) + (block_chance) * (blocked_damage);

        output += `Crit (yellow): ${(crit_chance * 100).toFixed(2)}%<br />`
        output += `Regular (white): ${(white_chance * 100).toFixed(2)}%<br />`
        output += `Blocked (gray): ${(block_chance * 100).toFixed(2)}%<br />`;
        output += `You will do ${(total_dmg * 100).toFixed(2)}% of your base (white) damage.`
        document.getElementById('results').innerHTML = output;

        // box 2
        let crit_chance_o = net_cr / 100;
        if (crit_chance_o > 1) crit_chance_o = 1;

        let white_chance_o = (1 - crit_chance_o) * (1 - (net_bl / 100));
        if (white_chance_o < 0) white_chance_o = 0

        let block_chance_o = (1 - crit_chance_o) * (net_bl / 100);
        if (block_chance_o > 1) block_chance_o = 1

        let total_dmg_o = (crit_chance_o) * (cdmg / 100) + (white_chance_o) + (block_chance_o) * (blocked_damage);

        analysis += "As the final crit rate and final block rate have a sum greater than 100, the block rate will thus have an effect on crit rate calculations, and vice versa for block."

        analysis += `<br /><br />Old overall chances (before patch 1.32):<br />`;

        analysis += `Crit (yellow): ${(crit_chance_o * 100).toFixed(2)}%<br />`
        analysis += `Regular (white): ${(white_chance_o * 100).toFixed(2)}%<br />`
        analysis += `Blocked (gray): ${(block_chance_o * 100).toFixed(2)}%<br />`;
        analysis += `Average damage: ${(total_dmg_o * 100).toFixed(2)}% of base.`
        
        analysis += `<br /><br /> <strong>total</strong> damage lost with new crit formula: ${((1 - (total_dmg / total_dmg_o)) * 100).toFixed(2)}%`;
        document.getElementById('results2').innerHTML = analysis + `<div style="position: absolute; top: 5px; right: 5px; font-size: 10pt; color: red;">(These calculations assume both parties are of the same level.)</div>`;


        // old formula for under 100 <strong>total</strong>
    } else {

        // box 1
        output += `Chance of landing a <strong>critical hit</strong>: ${(net_cr > 100 ? 100 : net_cr).toFixed(2)}%<br />`;
        output += `If an attack does not crit, chance of landing a <strong>blocked hit</strong>: ${(net_bl > 100 ? 100 : net_bl).toFixed(2)}%<br />`;
        
        output +="<br />"
        output += `Overall chances:<br />`

        let crit_chance = net_cr / 100;
        if (crit_chance > 1) crit_chance = 1;

        let white_chance = (1 - crit_chance) * (1 - (net_bl / 100));
        let block_chance = (1 - crit_chance) * (net_bl / 100);
        let blocked_damage = (1 - (0.5 * (1 - (ig / 100)))) * (1 - brecov / 100)
        let total_dmg = (crit_chance) * (cdmg / 100) + (white_chance) + (block_chance) * (blocked_damage);

        output += `Crit (yellow): ${(crit_chance * 100).toFixed(2)}%<br />`
        output += `Regular (white): ${(white_chance * 100).toFixed(2)}%<br />`
        output += `Blocked (gray): ${(block_chance * 100).toFixed(2)}%<br />`;
        output += `You will do ${(total_dmg * 100).toFixed(2)}% of your base (white) damage.`
        document.getElementById('results').innerHTML = output;

        // box 2
        analysis += "As the final crit rate and final block rate have a sum less than 100, the block rate thus has no effect on crit rate calculations"
        document.getElementById('results2').innerHTML = analysis + `<div style="position: absolute; top: 5px; right: 5px; font-size: 10pt; color: red;">(These calculations assume both parties are of the same level.)</div>`;
    }

}

function update() {
    let cdmg = document.getElementById('cdmg').value;

    cdmg = 150 + Number(cdmg);

    document.getElementById('<strong>total</strong>_cdmg').innerHTML = cdmg;
    
}
</script>
    
    
    <body onload="calculate()">
        <br />
        <center><h2>Crit calculator</h2></center>
        <br />
        <div style="position: absolute; top: 5px; right: 5px; font-size: 10pt; color: red;">(These calculations assume both parties are of the same level.)</div>
        <table style="width: 100%">
            <tr>
                <td style="border: 1px dashed black; border-radius: 10px; padding: 10px; width: 50%; vertical-align: top" rowspan=2>
                        <strong>Your stats:</strong><br />
                        Critical Rate: <input id="cr" value=100 type="number"></input>%<br />
                        Critical Damage: <input id="cdmg" value="0" type="number" step="any" oninput="update()"></input>% <span style="color: gray">(<strong>total</strong>: <span id="<strong>total</strong>_cdmg">150</span>%)</span><br />
                        <br />
                        Break Rate: <input id="br" value=100 type="number" step="any"></input>%<br />
                        Ignores Block: <input id="ig" value=0 type="number" step="any"></input>%<br />
                        Block Recovery Suppression: <input id="brs" value=0 type="number" step="any"></input>%
                        <br /><br /><br />
                        <strong>Opponent's stats: </strong><br />
                        Crit Immunity Rate: <input id="ten" value=100 type="number" step="any"></input>%<br />
                        Crit Damage Reduction: <input id="cdmgr" value=0 type="number" step="any"></input>%<br /><br />
                        Block Rate: <input id="blk" value=100 type="number" step="any"></input>%<br />
                        Block Damage Reduction: <input id="bdr" value=0 type="number" step="any"></input>%<br />
                        Block Recovery: <input id="brecov" value=0 type="number" step="any"></input>%
                        <br /><br />

                        <button onclick="calculate()" style="color: green; background-color: lightgreen; border: 1px solid green; padding: 5px;">Calculate!</button>
                </td>
                <td id="results" style="border: 1px dashed blue; border-radius: 10px; padding: 10px; position: relative; vertical-align: top;" >
                    ...
                </td>
            </tr>
            <tr>
                <td id="results2" style="border: 1px dashed red; border-radius: 10px; padding: 10px; vertical-align: top;" >
                    ...
                </td>
            </tr>
            <tr>
                <td colspan=2 style="border: 1px dashed red; border-radius: 10px; padding: 10px;">
                    <h4>Patch 1.32 Crit/Block Mechanics</h4>
                    <strong><span style="color: orange">net_crit</span></strong> = your_crit - enemy_crit_immunity; 0 &lt; <strong><span style="color: orange">net_crit</span></strong><br />
                    <strong><span style="color: gray">net_block</span></strong> = enemy_block - your_break; 0 &lt; <strong><span style="color: gray">net_block</span></strong><br />
                    <strong>total</strong> = (<strong><span style="color: orange">net_crit</span></strong> + <strong><span style="color: gray">net_block</span></strong>)<br />
<br />
                    <strong>total</strong> &lt;= 100?<br />
                    <strong>final_crit</strong> = <strong><span style="color: orange">net_crit</span></strong><br />
                    <strong>final_block</strong> = <strong><span style="color: gray">net_block</span></strong><br />
<br />
                    <strong>total</strong> &gt; 100? <br />
                    <strong>final_crit</strong> = <strong><span style="color: orange">net_crit</span></strong> / (<strong><span style="color: orange">net_crit</span></strong> + <strong><span style="color: gray">net_block</span></strong>)<br />
                    <strong>final_block</strong> = <strong><span style="color: gray">net_block</span></strong> / (<strong><span style="color: orange">net_crit</span></strong> + <strong><span style="color: gray">net_block</span></strong>)<br />
                </td>
            </tr>
        </table>
    </body>