Display Spell Boosts and Next Spell Costs only after build calculated; only display Powder Specials if weapon is present

This commit is contained in:
dr-carlos 2021-01-18 20:44:08 +10:30
parent 68d8ce2a8b
commit de215c6db5
6 changed files with 43 additions and 69 deletions

View file

@ -225,10 +225,16 @@ class Build{
const weapon = itemMap.get(equipment[8]);
this.powders[4] = this.powders[4].slice(0,weapon.slots);
this.weapon = expandItem(weapon, this.powders[4]);
if (equipment[8] !== "No Weapon") {
document.getElementsByClassName("powder-specials")[0].style.display = "grid";
} else {
document.getElementsByClassName("powder-specials")[0].style.display = "none";
}
}else{
const weapon = itemMap.get("No Weapon");
this.powders[4] = this.powders[4].slice(0,weapon.slots);
this.weapon = expandItem(weapon, this.powders[4]);
document.getElementsByClassName("powder-specials")[0].style.display = "none";
errors.push(new ItemNotFound(equipment[8], "weapon", true));
}

View file

@ -464,7 +464,7 @@ function calculateBuild(save_skp, skp){
}
for (let i of document.getElementsByClassName("hide-container-grid")) {
i.style.display = "grid";
}
}
console.log(player_build.toString());
displayEquipOrder(document.getElementById("build-order"),player_build.equip_order);

View file

@ -191,7 +191,7 @@
</div>
<br><br>
<div class="externalBuffs" id="buff-box">
<div class="externalBuffs hide-container-block" id="buff-box" style="display: none;">
<table class="externalBuffs">
<tr>
<p class = "buffs-title itemp title">
@ -226,7 +226,7 @@
</td>
</tr>
</table>
<div class = "powder-specials">
<div class = "powder-specials" style="display: none;">
<div class = "powder-special-stats" style = "grid-column:1;grid-row:1">
<div class = "center" id = "powder-special-stats">
<p class = "itemp">Powder Specials</p>
@ -569,7 +569,7 @@
<div class = "center set-info" id = "set-info-div" style = "grid-column:1;grid-row:1; display: none;">
<div class = "center" id = "set-info">Set info</div>
</div>
<div class = "center int-info" id = "int-info-div" style = "grid-column:4;grid-row:1;visibility:visible;">
<div class = "center int-info hide-container-block" id = "int-info-div" style = "grid-column:4;grid-row:1; display: none;">
<div class = "center" id = "int-info">Next Spell Costs</div>
</div>
</div>

View file

@ -35,35 +35,3 @@
height: 7vw;
max-height: 30px;
}
.hide-container-block {
animation-duration: 0.5s;
animation-name: fadeInFromNone;
animation-fill-mode: forwards;
}
.hide-container-grid {
animation-duration: 0.5s;
animation-name: fadeInFromNone;
animation-fill-mode: forwards;
}
.set-info-div {
animation-duration: 0.5s;
animation-name: fadeInFromNone;
animation-fill-mode: forwards;
}
@keyframes fadeInFromNone {
0% {
opacity: 0;
}
1% {
opacity: 0;
}
100% {
opacity: 1;
}
}

View file

@ -290,3 +290,35 @@ button.toggleOn{
.externalBuffs {
width: 100%;
}
.hide-container-block {
animation-duration: 0.5s;
animation-name: fadeInFromNone;
animation-fill-mode: forwards;
}
.hide-container-grid {
animation-duration: 0.5s;
animation-name: fadeInFromNone;
animation-fill-mode: forwards;
}
.misc {
animation-duration: 0.5s;
animation-name: fadeInFromNone;
animation-fill-mode: forwards;
}
@keyframes fadeInFromNone {
0% {
opacity: 0;
}
1% {
opacity: 0;
}
100% {
opacity: 1;
}
}

View file

@ -30,35 +30,3 @@
.skp-input {
}
.hide-container-block {
animation-duration: 0.5s;
animation-name: fadeInFromNone;
animation-fill-mode: forwards;
}
.hide-container-grid {
animation-duration: 0.5s;
animation-name: fadeInFromNone;
animation-fill-mode: forwards;
}
.set-info-div {
animation-duration: 0.5s;
animation-name: fadeInFromNone;
animation-fill-mode: forwards;
}
@keyframes fadeInFromNone {
0% {
opacity: 0;
}
1% {
opacity: 0;
}
100% {
opacity: 1;
}
}