nicer display for melee + spell + poison summaries

This commit is contained in:
ferricles 2021-01-15 00:23:55 -08:00
parent 61f1e3aa1b
commit 682e3b7c66
3 changed files with 61 additions and 9 deletions

View file

@ -628,8 +628,15 @@ function displayPoisonDamage(overallparent_elem, build) {
let overallpoisonDamage = document.createElement("p"); let overallpoisonDamage = document.createElement("p");
overallpoisonDamage.classList.add("itemp"); overallpoisonDamage.classList.add("itemp");
let overallpoisonDamageFirst = document.createElement("b");
let overallpoisonDamageSecond = document.createElement("b");
let poison_tick = Math.round(build.statMap.get("poison") * (1+skillPointsToPercentage(build.total_skillpoints[0])) * (build.statMap.get("poisonPct") + build.externalStats.get("poisonPct"))/100 /3); let poison_tick = Math.round(build.statMap.get("poison") * (1+skillPointsToPercentage(build.total_skillpoints[0])) * (build.statMap.get("poisonPct") + build.externalStats.get("poisonPct"))/100 /3);
overallpoisonDamage.textContent = "Poison Tick: " + Math.max(poison_tick,0); overallpoisonDamageFirst.textContent = "Poison Tick: ";
overallpoisonDamageSecond.textContent = Math.max(poison_tick,0);
overallpoisonDamageSecond.classList.add("Damage");
overallpoisonDamage.appendChild(overallpoisonDamageFirst);
overallpoisonDamage.appendChild(overallpoisonDamageSecond);
overallparent_elem.append(overallpoisonDamage); overallparent_elem.append(overallpoisonDamage);
overallparent_elem.append(document.createElement("br")); overallparent_elem.append(document.createElement("br"));
} }
@ -681,7 +688,15 @@ function displayMeleeDamage(parent_elem, overallparent_elem, meleeStats){
//overall average DPS //overall average DPS
let overallaverageDamage = document.createElement("p"); let overallaverageDamage = document.createElement("p");
overallaverageDamage.classList.add("itemp"); overallaverageDamage.classList.add("itemp");
overallaverageDamage.textContent = "Average DPS: " + stats[10]; let overallaverageDamageFirst = document.createElement("b");
overallaverageDamageFirst.textContent = "Average DPS: "
let overallaverageDamageSecond = document.createElement("b");
overallaverageDamageSecond.classList.add("Damage");
overallaverageDamageSecond.textContent = stats[10];
overallaverageDamage.appendChild(overallaverageDamageFirst);
overallaverageDamage.appendChild(overallaverageDamageSecond);
overallparent_elem.append(overallaverageDamage); overallparent_elem.append(overallaverageDamage);
overallparent_elem.append(document.createElement("br")); overallparent_elem.append(document.createElement("br"));
@ -697,7 +712,13 @@ function displayMeleeDamage(parent_elem, overallparent_elem, meleeStats){
let overallatkSpd = document.createElement("p"); let overallatkSpd = document.createElement("p");
overallatkSpd.classList.add("center"); overallatkSpd.classList.add("center");
overallatkSpd.classList.add("itemp"); overallatkSpd.classList.add("itemp");
overallatkSpd.textContent = "Attack Speed: " + attackSpeeds[stats[11]]; let overallatkSpdFirst = document.createElement("b");
overallatkSpdFirst.textContent = "Attack Speed: ";
let overallatkSpdSecond = document.createElement("b");
overallatkSpdSecond.classList.add("Damage");
overallatkSpdSecond.textContent = attackSpeeds[stats[11]];
overallatkSpd.appendChild(overallatkSpdFirst);
overallatkSpd.appendChild(overallatkSpdSecond);
overallparent_elem.append(overallatkSpd); overallparent_elem.append(overallatkSpd);
overallparent_elem.append(document.createElement("br")); overallparent_elem.append(document.createElement("br"));
@ -730,7 +751,14 @@ function displayMeleeDamage(parent_elem, overallparent_elem, meleeStats){
//overall average DPS //overall average DPS
let singleHitDamage = document.createElement("p"); let singleHitDamage = document.createElement("p");
singleHitDamage.classList.add("itemp"); singleHitDamage.classList.add("itemp");
singleHitDamage.textContent = "Single Hit Average: " + stats[12].toFixed(2); let singleHitDamageFirst = document.createElement("b");
singleHitDamageFirst.textContent = "Single Hit Average: ";
let singleHitDamageSecond = document.createElement("b");
singleHitDamageSecond.classList.add("Damage");
singleHitDamageSecond.textContent = stats[12].toFixed(2);
singleHitDamage.appendChild(singleHitDamageFirst);
singleHitDamage.appendChild(singleHitDamageSecond);
overallparent_elem.append(singleHitDamage); overallparent_elem.append(singleHitDamage);
overallparent_elem.append(document.createElement("br")); overallparent_elem.append(document.createElement("br"));
@ -1104,7 +1132,22 @@ function displaySpellDamage(parent_elem, overallparent_elem, build, spell, spell
if (spellIdx != 0) { if (spellIdx != 0) {
title_elem.textContent = spell.title + " (" + build.getSpellCost(spellIdx, spell.cost) + ")"; title_elem.textContent = spell.title + " (" + build.getSpellCost(spellIdx, spell.cost) + ")";
title_elemavg.textContent = spell.title + " (" + build.getSpellCost(spellIdx, spell.cost) + ")"; let first = document.createElement("b");
first.classList.add("space");
first.textContent = spell.title + " (";
title_elemavg.appendChild(first);
let second = document.createElement("b");
second.textContent = build.getSpellCost(spellIdx, spell.cost);
second.classList.add("Legendary");
title_elemavg.appendChild(second);
let third = document.createElement("b");
third.classList.add("Water");
title_elemavg.appendChild(third);
let fourth = document.createElement("b");
fourth.textContent = ")";
title_elemavg.appendChild(fourth);
//title_elemavg.textContent = spell.title + " (" + build.getSpellCost(spellIdx, spell.cost) + ")";
} }
else { else {
title_elem.textContent = spell.title; title_elem.textContent = spell.title;
@ -1124,6 +1167,7 @@ function displaySpellDamage(parent_elem, overallparent_elem, build, spell, spell
parent_elem.append(part_div); parent_elem.append(part_div);
let part_divavg = document.createElement("p"); let part_divavg = document.createElement("p");
//part_divavg.classList.add("Normal");
overallparent_elem.append(part_divavg); overallparent_elem.append(part_divavg);
let subtitle_elem = document.createElement("p"); let subtitle_elem = document.createElement("p");
@ -1159,7 +1203,13 @@ function displaySpellDamage(parent_elem, overallparent_elem, build, spell, spell
if (part.summary == true) { if (part.summary == true) {
let overallaverageLabel = document.createElement("p"); let overallaverageLabel = document.createElement("p");
overallaverageLabel.textContent = "Average: "+averageDamage.toFixed(2); let first = document.createElement("b");
let second = document.createElement("b");
first.textContent = "Average: ";
second.textContent = averageDamage.toFixed(2);
overallaverageLabel.appendChild(first);
overallaverageLabel.appendChild(second);
second.classList.add("Damage");
overallaverageLabel.classList.add("damageSubtitle"); overallaverageLabel.classList.add("damageSubtitle");
part_divavg.append(overallaverageLabel); part_divavg.append(overallaverageLabel);
} }
@ -1204,7 +1254,8 @@ function displaySpellDamage(parent_elem, overallparent_elem, build, spell, spell
if (part.summary == true) { if (part.summary == true) {
let overallhealLabel = document.createElement("p"); let overallhealLabel = document.createElement("p");
overallhealLabel.textContent = heal_amount; overallhealLabel.textContent = heal_amount;
overallhealLabel.classList.add("damagep") overallhealLabel.classList.add("damagep");
overallhealLabel.classList.add("Set");
part_divavg.append(overallhealLabel); part_divavg.append(overallhealLabel);
} }
} }

View file

@ -159,6 +159,7 @@ a.link{
.Neutral { color: #fa0; } .Neutral { color: #fa0; }
.Neutral:before { content: "\2724" ' '; } .Neutral:before { content: "\2724" ' '; }
.Damage { color: rgb(255, 198, 85)}
.Health { .Health {
color: #a00; color: #a00;
@ -227,7 +228,7 @@ button:hover {
button:active { button:active {
background-color: #558; background-color: #558;
box-shadow: 0 5px #666; box-shadow: 0 3px #666;
transform: translateY(1px); transform: translateY(1px);
} }
input { input {