endernon/wynnbuilder-forked-for-changes
1
0
Fork 0
forked from morphNon/wynnbuilder-idk
Code Pull requests Activity

spell detail clickable indicator added

Browse source
This commit is contained in:
ferricles 2022-05-22 00:50:53 -07:00
parent 1c4042325d
commit 5ff9d6ff22
6 changed files with 55 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
builder/index.html
View file

@ -1240,31 +1240,31 @@
</div> </div>
<div class="col-xl-3 mb-3"> <div class="col-xl-3 mb-3">
<div class="row row-cols-1 gy-3 mb-4 text-center scaled-font"> <div class="row row-cols-1 gy-3 mb-4 text-center scaled-font">
<div class="col"> <div class = "col">
<div class="spell-display dark-5 rounded dark-shadow py-2 border border-dark" id="build-melee-statsAvg">melee</div> <div class = "spell-display 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 class = "spell-display dark-5 rounded-bottom py-2 dark-shadow" id = "build-melee-stats" style="display: none;"></div>
</div> </div>
<div class="col"> <div class = "col">
<div class="spell-display dark-5 rounded dark-shadow py-2 border border-dark" id="build-poison-stats">poison</div> <div class = "col spell-display dark-5 rounded dark-shadow py-2 border border-dark" id="build-poison-stats">poison</div>
</div> </div>
<div class="col"> <div class = "col">
<div class="spell-display spell-expand dark-5 rounded dark-shadow py-2 border border-dark" id="spell0-infoAvg">spell1</div> <div class = "col spell-display spell-expand dark-5 rounded dark-shadow pt-2 border border-dark" id="spell0-infoAvg">spell1</div>
<div class = "spell-display dark-5 rounded dark-shadow py-2" id = "spell0-info" style="display: none;">Spell 1</div> <div class = "col spell-display dark-5 rounded dark-shadow py-2" id = "spell0-info" style="display: none;">Spell 1</div>
</div> </div>
<div class="col"> <div class = "col">
<div class="spell-display spell-expand dark-5 rounded dark-shadow py-2 border border-dark" id="spell1-infoAvg">spell2</div> <div class = "col spell-display spell-expand dark-5 rounded dark-shadow pt-2 border border-dark" id="spell1-infoAvg">spell2</div>
<div class = "spell-display dark-5 rounded dark-shadow py-2" id = "spell1-info" style="display: none;">Spell 2</div> <div class = "col spell-display dark-5 rounded dark-shadow py-2" id = "spell1-info" style="display: none;">Spell 2</div>
</div> </div>
<div class="col"> <div class = "col">
<div class="spell-display spell-expand dark-5 rounded dark-shadow py-2 border border-dark" id="spell2-infoAvg">spell3</div> <div class = "col spell-display spell-expand dark-5 rounded dark-shadow pt-2 border border-dark" id="spell2-infoAvg">spell3</div>
<div class = "spell-display dark-5 rounded dark-shadow py-2" id = "spell2-info" style="display: none;">Spell 3</div> <div class = "col spell-display dark-5 rounded dark-shadow py-2" id = "spell2-info" style="display: none;">Spell 3</div>
</div> </div>
<div class="col"> <div class = "col">
<div class="spell-display spell-expand dark-5 rounded dark-shadow py-2 border border-dark" id="spell3-infoAvg">spell4</div> <div class = "col spell-display spell-expand dark-5 rounded dark-shadow pt-2 border border-dark" id="spell3-infoAvg">spell4</div>
<div class = "spell-display dark-5 rounded dark-shadow py-2" id = "spell3-info" style="display: none;">Spell 4</div> <div class = "col spell-display dark-5 rounded dark-shadow py-2" id = "spell3-info" style="display: none;">Spell 4</div>
</div> </div>
<div class="col"> <div class = "col">
<div class="spell-display dark-5 rounded dark-shadow py-2 border border-dark" id = "powder-special-stats"></div> <div class = "spell-display dark-5 rounded dark-shadow py-2 border border-dark" id = "powder-special-stats"></div>
</div> </div>
</div> </div>

37
js/sq2display.js
View file

@ -1411,6 +1411,43 @@ function displaysq2SpellDamage(parent_elem, overallparent_elem, build, spell, sp
part_divavg.append(overallaverageLabel); part_divavg.append(overallaverageLabel);
} }
} }
//up and down arrow - done ugly
let down_arrow = document.createElement("img");
down_arrow.id = "down_arrow_" + overallparent_elem.id;
down_arrow.style.maxWidth = document.body.clientWidth > 900 ? "3rem" : "10rem";
down_arrow.src = "../media/icons/" + (newIcons ? "new" : "old") + "/toggle_down.png";
overallparent_elem.appendChild(down_arrow);
let up_arrow = document.createElement("img");
up_arrow.id = "up_arrow_" + overallparent_elem.id;
up_arrow.style.maxWidth = document.body.clientWidth > 900 ? "3rem" : "10rem";
up_arrow.src = "../media/icons/" + (newIcons ? "new" : "old") + "/toggle_up.png";
up_arrow.style.display = "none";
overallparent_elem.appendChild(up_arrow);
overallparent_elem.setAttribute("onclick", overallparent_elem.getAttribute("onclick") + `;toggleUpDownArrow("${overallparent_elem.id}")`);
}
function toggleUpDownArrow(parent_id) {
parent_elem = document.getElementById(parent_id);
if (parent_elem) {
let down_arrow = document.getElementById("down_arrow_" + parent_id);
if (down_arrow.style.display === "none") {
down_arrow.style.display = "";
} else {
down_arrow.style.display = "none";
}
let up_arrow = document.getElementById("up_arrow_" + parent_id);
if (up_arrow.style.display === "none") {
up_arrow.style.display = "";
} else {
up_arrow.style.display = "none";
}
}
} }
function displaysq2EquipOrder(parent_elem, buildOrder){ function displaysq2EquipOrder(parent_elem, buildOrder){

BIN
media/icons/new/toggle_down.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 834 B

BIN
media/icons/new/toggle_up.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 809 B

BIN
media/icons/old/toggle_down.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 834 B

BIN
media/icons/old/toggle_up.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 809 B