Unify melee stats boxes
remove poison stats box for now now melee stats box is correct with melee modifiers, and also neater in code
This commit is contained in:
hppeng
parent
2e4cbe9175
commit
538202e7ac
4 changed files with 38 additions and 274 deletions
File diff suppressed because one or more lines are too long
|
|
@ -6,17 +6,6 @@
|
|||
<meta name="MobileOptimized" content="320" />
|
||||
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, width=device-width, user-scalable=no" />
|
||||
|
||||
<!--OGP suite
|
||||
<meta property="og:title" content="Wynnbuilder" />
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:image" content="https://wynnbuilder.github.io/media/icons/new/builder.png" />
|
||||
<meta property="og:image:width" content="420" />
|
||||
<meta property="og:image:height" content="420" />
|
||||
<meta property="og:image:type" content="image/png" />
|
||||
<meta property="og:description" id = "ogp-build-list" content = "">
|
||||
<meta property="og:url" id = "ogp-url" content="" />
|
||||
-->
|
||||
|
||||
<title>WynnBuilder</title>
|
||||
<link rel="icon" href="../media/icons/new/builder.png" type="image/icon type">
|
||||
|
||||
|
|
@ -35,8 +24,6 @@
|
|||
<link rel="stylesheet" href="../css/wynnstyles.css">
|
||||
</head>
|
||||
<body class="text-light" id = "body">
|
||||
<!-- hover tooltip stuff -->
|
||||
|
||||
<!-- main -->
|
||||
<div id="main-sidebar" class="sidebar dark-7 dark-shadow">
|
||||
<a href = ""><img src="../media/icons/new/builder.png" alt = "WynnBuilder" title = "WynnBuilder"><b>WynnBuilder</b></a>
|
||||
|
|
@ -1158,23 +1145,15 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="col-xl-3 mb-3 px-0">
|
||||
<div class="row row-cols-1 gy-3 mb-4 text-center scaled-font">
|
||||
<div class = "col">
|
||||
<div class = "spell-display spell-expand dark-5 rounded dark-shadow py-2 border border-dark" id="build-melee-statsAvg">melee</div>
|
||||
<div class = "spell-display dark-5 rounded-bottom py-2 dark-shadow" id = "build-melee-stats" style="display: none;"></div>
|
||||
</div>
|
||||
<div class = "col">
|
||||
<div class = "col spell-display dark-5 rounded dark-shadow py-2 border border-dark" id="build-poison-stats">poison</div>
|
||||
</div>
|
||||
<div id="all-spells-display" class="row row-cols-1 gy-3 text-center scaled-font pe-0">
|
||||
<div id="all-spells-display" class="row row-cols-1 gy-3 mb-4 text-center scaled-font">
|
||||
<div class = "col pe-0">
|
||||
<div class = "col spell-display spell-expand dark-5 rounded dark-shadow pt-2 border border-dark" id="spell0-infoAvg">Input a weapon to see abilities!</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class = "col">
|
||||
<div class="row row-cols-1 gy-3 mb-4 text-center scaled-font">
|
||||
<div class = "col pe-0">
|
||||
<div class = "spell-display dark-5 rounded dark-shadow py-2 border border-dark" id = "powder-special-stats"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1198,20 +1177,6 @@
|
|||
</div>
|
||||
<div id="weapon-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
||||
</div>
|
||||
<!--div id="weaponTome1-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
||||
</div>
|
||||
<div id="weaponTome2-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
||||
</div>
|
||||
<div id="armorTome1-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
||||
</div>
|
||||
<div id="armorTome2-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
||||
</div>
|
||||
<div id="armorTome3-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
||||
</div>
|
||||
<div id="armorTome4-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
||||
</div>
|
||||
<div id="guildTome1-tooltip" class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3">
|
||||
</div-->
|
||||
<div class="rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark dark-shadow p-3" id = "build-order">
|
||||
</div>
|
||||
<div class = "rounded row row-cols-1 g-0 scaled-font float-tooltip border border-3 border-dark p-3" id = "set-info"></div>
|
||||
|
|
@ -1278,10 +1243,8 @@
|
|||
<div class = "row box-title justify-content-center my-1" id = "summary">
|
||||
</div>
|
||||
<div class = "row" id = "search-results">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -1290,7 +1253,6 @@
|
|||
<script type="text/javascript" src="../js/utils.js"></script>
|
||||
<script type="text/javascript" src="../js/build_utils.js"></script>
|
||||
<script type="text/javascript" src="../js/computation_graph.js"></script>
|
||||
<!-- <script type="text/javascript" src="../js/icons.js"></script> -->
|
||||
<script type="text/javascript" src="../js/sq2icons.js"></script>
|
||||
<script type="text/javascript" src="../js/powders.js"></script>
|
||||
<script type="text/javascript" src="../js/skillpoints.js"></script>
|
||||
|
|
|
|||
|
|
@ -656,59 +656,10 @@ class SpellDisplayNode extends ComputeNode {
|
|||
const i = this.spell_idx;
|
||||
let parent_elem = document.getElementById("spell"+i+"-info");
|
||||
let overallparent_elem = document.getElementById("spell"+i+"-infoAvg");
|
||||
displaySpellDamage(parent_elem, overallparent_elem, stats, spell, i+1, damages);
|
||||
displaySpellDamage(parent_elem, overallparent_elem, stats, spell, i, damages);
|
||||
}
|
||||
}
|
||||
|
||||
/* Get melee stats for build.
|
||||
Returns an array in the order:
|
||||
*/
|
||||
function getMeleeStats(stats, weapon) {
|
||||
stats = new Map(stats); // Shallow copy
|
||||
const weapon_stats = weapon.statMap;
|
||||
const skillpoints = [
|
||||
stats.get('str'),
|
||||
stats.get('dex'),
|
||||
stats.get('int'),
|
||||
stats.get('def'),
|
||||
stats.get('agi')
|
||||
];
|
||||
if (weapon_stats.get("tier") === "Crafted") {
|
||||
stats.set("damageBases", [weapon_stats.get("nDamBaseHigh"),weapon_stats.get("eDamBaseHigh"),weapon_stats.get("tDamBaseHigh"),weapon_stats.get("wDamBaseHigh"),weapon_stats.get("fDamBaseHigh"),weapon_stats.get("aDamBaseHigh")]);
|
||||
}
|
||||
let adjAtkSpd = attackSpeeds.indexOf(stats.get("atkSpd")) + stats.get("atkTier");
|
||||
if(adjAtkSpd > 6){
|
||||
adjAtkSpd = 6;
|
||||
}else if(adjAtkSpd < 0){
|
||||
adjAtkSpd = 0;
|
||||
}
|
||||
|
||||
if (weapon_stats.get("type") === "relik") {
|
||||
merge_stat(stats, 'damMult.ShamanMelee', 0.99); // CURSE YOU WYNNCRAFT
|
||||
//One day we will create WynnWynn and no longer have shaman 99% melee injustice.
|
||||
//In all seriousness 99% is because wynn uses 0.33 to estimate dividing the damage by 3 to split damage between 3 beams.
|
||||
}
|
||||
let results = calculateSpellDamage(stats, weapon_stats, [100, 0, 0, 0, 0, 0], false, true);
|
||||
|
||||
let dex = skillpoints[1];
|
||||
|
||||
let totalDamNorm = results[0];
|
||||
let totalDamCrit = results[1];
|
||||
totalDamNorm.push(1-skillPointsToPercentage(dex));
|
||||
totalDamCrit.push(skillPointsToPercentage(dex));
|
||||
let damages_results = results[2];
|
||||
|
||||
let singleHitTotal = ((totalDamNorm[0]+totalDamNorm[1])*(totalDamNorm[2])
|
||||
+(totalDamCrit[0]+totalDamCrit[1])*(totalDamCrit[2]))/2;
|
||||
|
||||
//Now do math
|
||||
let normDPS = (totalDamNorm[0]+totalDamNorm[1])/2 * baseDamageMultiplier[adjAtkSpd];
|
||||
let critDPS = (totalDamCrit[0]+totalDamCrit[1])/2 * baseDamageMultiplier[adjAtkSpd];
|
||||
let avgDPS = (normDPS * (1 - skillPointsToPercentage(dex))) + (critDPS * (skillPointsToPercentage(dex)));
|
||||
//[[n n n n] [e e e e] [t t t t] [w w w w] [f f f f] [a a a a] [lowtotal hightotal normalChance] [critlowtotal crithightotal critChance] normalDPS critCPS averageDPS adjAttackSpeed, singleHit]
|
||||
return damages_results.concat([totalDamNorm,totalDamCrit,normDPS,critDPS,avgDPS,adjAtkSpd, singleHitTotal]).concat(results[3]);
|
||||
}
|
||||
|
||||
/**
|
||||
* Display build stats.
|
||||
*
|
||||
|
|
@ -723,13 +674,10 @@ class BuildDisplayNode extends ComputeNode {
|
|||
displayBuildStats('overall-stats', build, build_all_display_commands, stats);
|
||||
displayBuildStats("offensive-stats", build, build_offensive_display_commands, stats);
|
||||
displaySetBonuses("set-info", build);
|
||||
let meleeStats = getMeleeStats(stats, build.weapon);
|
||||
// TODO: move weapon out?
|
||||
displayMeleeDamage(document.getElementById("build-melee-stats"), document.getElementById("build-melee-statsAvg"), meleeStats);
|
||||
|
||||
displayDefenseStats(document.getElementById("defensive-stats"), stats);
|
||||
|
||||
displayPoisonDamage(document.getElementById("build-poison-stats"), build);
|
||||
//displayPoisonDamage(document.getElementById("build-poison-stats"), build);
|
||||
displayEquipOrder(document.getElementById("build-order"), build.equip_order);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
202
js/display.js
202
js/display.js
|
|
@ -1022,152 +1022,6 @@ function displayEquipOrder(parent_elem, buildOrder){
|
|||
}
|
||||
}
|
||||
|
||||
function displayMeleeDamage(parent_elem, overallparent_elem, meleeStats) {
|
||||
let attackSpeeds = ["Super Slow", "Very Slow", "Slow", "Normal", "Fast", "Very Fast", "Super Fast"];
|
||||
//let damagePrefixes = ["Neutral Damage: ","Earth Damage: ","Thunder Damage: ","Water Damage: ","Fire Damage: ","Air Damage: "];
|
||||
parent_elem.textContent = "";
|
||||
overallparent_elem.textContent = "";
|
||||
const stats = meleeStats.slice();
|
||||
|
||||
for (let i = 0; i < 6; ++i) {
|
||||
for (let j in stats[i]) {
|
||||
stats[i][j] = stats[i][j].toFixed(2);
|
||||
}
|
||||
}
|
||||
for (let i = 6; i < 8; ++i) {
|
||||
for (let j = 0; j < 2; j++) {
|
||||
stats[i][j] = stats[i][j].toFixed(2);
|
||||
}
|
||||
}
|
||||
for (let i = 8; i < 11; ++i) {
|
||||
stats[i] = stats[i].toFixed(2);
|
||||
}
|
||||
|
||||
//title
|
||||
let title_elem = document.createElement("p");
|
||||
title_elem.classList.add("title");
|
||||
title_elem.textContent = "Melee Stats";
|
||||
parent_elem.append(title_elem);
|
||||
parent_elem.append(document.createElement("br"));
|
||||
|
||||
//overall title
|
||||
let title_elemavg = document.createElement("b");
|
||||
title_elemavg.textContent = "Melee Stats";
|
||||
overallparent_elem.append(title_elemavg);
|
||||
|
||||
//average DPS
|
||||
let averageDamage = document.createElement("p");
|
||||
averageDamage.classList.add("left");
|
||||
averageDamage.textContent = "Average DPS: " + stats[10];
|
||||
parent_elem.append(averageDamage);
|
||||
|
||||
//overall average DPS
|
||||
let overallaverageDamage = document.createElement("p");
|
||||
let overallaverageDamageFirst = document.createElement("span");
|
||||
overallaverageDamageFirst.textContent = "Average DPS: "
|
||||
|
||||
let overallaverageDamageSecond = document.createElement("span");
|
||||
overallaverageDamageSecond.classList.add("Damage");
|
||||
overallaverageDamageSecond.textContent = stats[10];
|
||||
overallaverageDamage.appendChild(overallaverageDamageFirst);
|
||||
overallaverageDamage.appendChild(overallaverageDamageSecond);
|
||||
|
||||
overallparent_elem.append(overallaverageDamage);
|
||||
//overallparent_elem.append(document.createElement("br"));
|
||||
|
||||
//attack speed
|
||||
let atkSpd = document.createElement("p");
|
||||
atkSpd.classList.add("left");
|
||||
atkSpd.textContent = "Attack Speed: " + attackSpeeds[stats[11]];
|
||||
parent_elem.append(atkSpd);
|
||||
parent_elem.append(document.createElement("br"));
|
||||
|
||||
//overall attack speed
|
||||
let overallatkSpd = document.createElement("p");
|
||||
let overallatkSpdFirst = document.createElement("span");
|
||||
overallatkSpdFirst.textContent = "Attack Speed: ";
|
||||
let overallatkSpdSecond = document.createElement("span");
|
||||
overallatkSpdSecond.classList.add("Damage");
|
||||
overallatkSpdSecond.textContent = attackSpeeds[stats[11]];
|
||||
overallatkSpd.appendChild(overallatkSpdFirst);
|
||||
overallatkSpd.appendChild(overallatkSpdSecond);
|
||||
overallparent_elem.append(overallatkSpd);
|
||||
|
||||
//Non-Crit: n->elem, total dmg, DPS
|
||||
let nonCritStats = document.createElement("p");
|
||||
nonCritStats.classList.add("left");
|
||||
nonCritStats.textContent = "Non-Crit Stats: ";
|
||||
nonCritStats.append(document.createElement("br"));
|
||||
for (let i = 0; i < 6; i++) {
|
||||
if (stats[i][1] != 0) {
|
||||
let dmg = document.createElement("p");
|
||||
dmg.textContent = stats[i][0] + " \u2013 " + stats[i][1];
|
||||
dmg.classList.add(damageClasses[i]);
|
||||
dmg.classList.add("itemp");
|
||||
nonCritStats.append(dmg);
|
||||
}
|
||||
}
|
||||
|
||||
let normalDamage = document.createElement("p");
|
||||
normalDamage.textContent = "Total: " + stats[6][0] + " \u2013 " + stats[6][1];
|
||||
nonCritStats.append(normalDamage);
|
||||
|
||||
let normalDPS = document.createElement("p");
|
||||
normalDPS.textContent = "Normal DPS: " + stats[8];
|
||||
nonCritStats.append(normalDPS);
|
||||
|
||||
//overall average DPS
|
||||
let singleHitDamage = document.createElement("p");
|
||||
let singleHitDamageFirst = document.createElement("span");
|
||||
singleHitDamageFirst.textContent = "Single Hit Average: ";
|
||||
let singleHitDamageSecond = document.createElement("span");
|
||||
singleHitDamageSecond.classList.add("Damage");
|
||||
singleHitDamageSecond.textContent = stats[12].toFixed(2);
|
||||
singleHitDamage.appendChild(singleHitDamageFirst);
|
||||
singleHitDamage.appendChild(singleHitDamageSecond);
|
||||
overallparent_elem.append(singleHitDamage);
|
||||
|
||||
let normalChance = document.createElement("p");
|
||||
normalChance.textContent = "Non-Crit Chance: " + (stats[6][2]*100).toFixed(2) + "%";
|
||||
normalChance.append(document.createElement("br"));
|
||||
normalChance.append(document.createElement("br"));
|
||||
nonCritStats.append(normalChance);
|
||||
|
||||
parent_elem.append(nonCritStats);
|
||||
parent_elem.append(document.createElement("br"));
|
||||
|
||||
//Crit: n->elem, total dmg, DPS
|
||||
let critStats = document.createElement("p");
|
||||
critStats.classList.add("left");
|
||||
critStats.textContent = "Crit Stats: ";
|
||||
critStats.append(document.createElement("br"));
|
||||
for (let i = 0; i < 6; i++){
|
||||
if(stats[i][3] != 0) {
|
||||
dmg = document.createElement("p");
|
||||
dmg.textContent = stats[i][2] + " \u2013 " + stats[i][3];
|
||||
dmg.classList.add(damageClasses[i]);
|
||||
dmg.classList.add("itemp");
|
||||
critStats.append(dmg);
|
||||
}
|
||||
}
|
||||
let critDamage = document.createElement("p");
|
||||
critDamage.textContent = "Total: " + stats[7][0] + " \u2013 " + stats[7][1];
|
||||
critStats.append(critDamage);
|
||||
|
||||
let critDPS = document.createElement("p");
|
||||
critDPS.textContent = "Crit DPS: " + stats[9];
|
||||
critStats.append(critDPS);
|
||||
|
||||
let critChance = document.createElement("p");
|
||||
critChance.textContent = "Crit Chance: " + (stats[7][2]*100).toFixed(2) + "%";
|
||||
critChance.append(document.createElement("br"));
|
||||
critChance.append(document.createElement("br"));
|
||||
critStats.append(critChance);
|
||||
|
||||
parent_elem.append(critStats);
|
||||
addClickableArrow(overallparent_elem, parent_elem);
|
||||
}
|
||||
|
||||
function displayDefenseStats(parent_elem, statMap, insertSummary){
|
||||
let defenseStats = getDefenseStats(statMap);
|
||||
insertSummary = (typeof insertSummary !== 'undefined') ? insertSummary : false;
|
||||
|
|
@ -1533,31 +1387,23 @@ function displaySpellDamage(parent_elem, overallparent_elem, stats, spell, spell
|
|||
// TODO: move cost calc out
|
||||
parent_elem.textContent = "";
|
||||
|
||||
let title_elem = document.createElement("p");
|
||||
let title_elem = make_elem("p");
|
||||
|
||||
overallparent_elem.textContent = "";
|
||||
let title_elemavg = document.createElement("b");
|
||||
|
||||
if ('cost' in spell) {
|
||||
let first = document.createElement("span");
|
||||
first.textContent = spell.name + " (";
|
||||
let first = make_elem("span", [], { textContent: spell.name + " (" });
|
||||
title_elem.appendChild(first.cloneNode(true)); //cloneNode is needed here.
|
||||
title_elemavg.appendChild(first);
|
||||
|
||||
let second = document.createElement("span");
|
||||
second.textContent = getSpellCost(stats, spell);
|
||||
second.classList.add("Mana");
|
||||
|
||||
let second = make_elem("span", ["Mana"], { textContent: getSpellCost(stats, spell) });
|
||||
title_elem.appendChild(second.cloneNode(true));
|
||||
title_elemavg.appendChild(second);
|
||||
|
||||
|
||||
let third = document.createElement("span");
|
||||
third.textContent = ")";// [Base: " + getBaseSpellCost(stats, spellIdx, spell.cost) + " ]";
|
||||
title_elem.appendChild(third);
|
||||
let third_summary = document.createElement("span");
|
||||
third_summary.textContent = ")";
|
||||
title_elemavg.appendChild(third_summary);
|
||||
let third = make_elem("span", [], { textContent: ")" });// " + getBaseSpellCost(stats, spellIdx, spell.cost) + " ]";
|
||||
title_elem.appendChild(third.cloneNode(true));
|
||||
title_elemavg.appendChild(third);
|
||||
}
|
||||
else {
|
||||
title_elem.textContent = spell.name;
|
||||
|
|
@ -1574,30 +1420,26 @@ function displaySpellDamage(parent_elem, overallparent_elem, stats, spell, spell
|
|||
|
||||
let critChance = skillPointsToPercentage(stats.get('dex'));
|
||||
|
||||
let part_divavg = document.createElement("p");
|
||||
let part_divavg = make_elem("p");
|
||||
overallparent_elem.append(part_divavg);
|
||||
|
||||
function _summary(text, val, fmt) {
|
||||
let overallaverageLabel = document.createElement("p");
|
||||
let first = document.createElement("span");
|
||||
let second = document.createElement("span");
|
||||
first.textContent = text;
|
||||
second.textContent = val.toFixed(2);
|
||||
if (typeof(val) === 'number') { val = val.toFixed(2); }
|
||||
let overallaverageLabel = make_elem("p");
|
||||
let first = make_elem("span", [], { textContent: text });
|
||||
let second = make_elem("span", [fmt], { textContent: val });
|
||||
overallaverageLabel.appendChild(first);
|
||||
overallaverageLabel.appendChild(second);
|
||||
second.classList.add(fmt);
|
||||
part_divavg.append(overallaverageLabel);
|
||||
}
|
||||
|
||||
for (let i = 0; i < spell_results.length; ++i) {
|
||||
const spell_info = spell_results[i];
|
||||
|
||||
let part_div = document.createElement("p");
|
||||
let part_div = make_elem("p", ["pt-3"]);
|
||||
parent_elem.append(part_div);
|
||||
|
||||
let subtitle_elem = document.createElement("p");
|
||||
subtitle_elem.textContent = spell_info.name
|
||||
part_div.append(subtitle_elem);
|
||||
part_div.append(make_elem("p", [], { textContent: spell_info.name }));
|
||||
|
||||
if (spell_info.type === "damage") {
|
||||
let totalDamNormal = spell_info.normal_total;
|
||||
|
|
@ -1607,15 +1449,27 @@ function displaySpellDamage(parent_elem, overallparent_elem, stats, spell, spell
|
|||
let critAverage = (totalDamCrit[0]+totalDamCrit[1])/2 || 0;
|
||||
let averageDamage = (1-critChance)*nonCritAverage+critChance*critAverage || 0;
|
||||
|
||||
let averageLabel = document.createElement("p");
|
||||
averageLabel.textContent = "Average: "+averageDamage.toFixed(2);
|
||||
let averageLabel = make_elem("p", [], { textContent: "Average: "+averageDamage.toFixed(2) });
|
||||
// averageLabel.classList.add("damageSubtitle");
|
||||
part_div.append(averageLabel);
|
||||
|
||||
|
||||
if (spell_info.name === spell.display) {
|
||||
if (spellIdx === 0) {
|
||||
let attackSpeeds = ["Super Slow", "Very Slow", "Slow", "Normal", "Fast", "Very Fast", "Super Fast"];
|
||||
let adjAtkSpd = attackSpeeds.indexOf(stats.get("atkSpd")) + stats.get("atkTier");
|
||||
if(adjAtkSpd > 6) {
|
||||
adjAtkSpd = 6;
|
||||
} else if(adjAtkSpd < 0) {
|
||||
adjAtkSpd = 0;
|
||||
}
|
||||
_summary("Average DPS: ", averageDamage * baseDamageMultiplier[adjAtkSpd], "Damage");
|
||||
_summary("Attack Speed: ", attackSpeeds[adjAtkSpd], "Damage");
|
||||
_summary("Per Attack: ", averageDamage, "Damage");
|
||||
}
|
||||
else {
|
||||
_summary(spell_info.name+ ": ", averageDamage, "Damage");
|
||||
}
|
||||
}
|
||||
|
||||
function _damage_display(label_text, average, dmg_min, dmg_max) {
|
||||
let label = document.createElement("p");
|
||||
|
|
|
|||
Loading…
Reference in a new issue