spell detail clickable indicator added
This commit is contained in:
parent
1c4042325d
commit
5ff9d6ff22
6 changed files with 55 additions and 18 deletions
|
@ -1240,31 +1240,31 @@
|
|||
</div>
|
||||
<div class="col-xl-3 mb-3">
|
||||
<div class="row row-cols-1 gy-3 mb-4 text-center scaled-font">
|
||||
<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 = "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-bottom py-2 dark-shadow" id = "build-melee-stats" style="display: none;"></div>
|
||||
</div>
|
||||
<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">
|
||||
<div class = "col spell-display dark-5 rounded dark-shadow py-2 border border-dark" id="build-poison-stats">poison</div>
|
||||
</div>
|
||||
<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 = "spell-display dark-5 rounded dark-shadow py-2" id = "spell0-info" style="display: none;">Spell 1</div>
|
||||
<div class = "col">
|
||||
<div class = "col spell-display spell-expand dark-5 rounded dark-shadow pt-2 border border-dark" id="spell0-infoAvg">spell1</div>
|
||||
<div class = "col spell-display dark-5 rounded dark-shadow py-2" id = "spell0-info" style="display: none;">Spell 1</div>
|
||||
</div>
|
||||
<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 = "spell-display dark-5 rounded dark-shadow py-2" id = "spell1-info" style="display: none;">Spell 2</div>
|
||||
<div class = "col">
|
||||
<div class = "col spell-display spell-expand dark-5 rounded dark-shadow pt-2 border border-dark" id="spell1-infoAvg">spell2</div>
|
||||
<div class = "col spell-display dark-5 rounded dark-shadow py-2" id = "spell1-info" style="display: none;">Spell 2</div>
|
||||
</div>
|
||||
<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 = "spell-display dark-5 rounded dark-shadow py-2" id = "spell2-info" style="display: none;">Spell 3</div>
|
||||
<div class = "col">
|
||||
<div class = "col spell-display spell-expand dark-5 rounded dark-shadow pt-2 border border-dark" id="spell2-infoAvg">spell3</div>
|
||||
<div class = "col spell-display dark-5 rounded dark-shadow py-2" id = "spell2-info" style="display: none;">Spell 3</div>
|
||||
</div>
|
||||
<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 = "spell-display dark-5 rounded dark-shadow py-2" id = "spell3-info" style="display: none;">Spell 4</div>
|
||||
<div class = "col">
|
||||
<div class = "col spell-display spell-expand dark-5 rounded dark-shadow pt-2 border border-dark" id="spell3-infoAvg">spell4</div>
|
||||
<div class = "col spell-display dark-5 rounded dark-shadow py-2" id = "spell3-info" style="display: none;">Spell 4</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="spell-display dark-5 rounded dark-shadow py-2 border border-dark" id = "powder-special-stats"></div>
|
||||
<div class = "col">
|
||||
<div class = "spell-display dark-5 rounded dark-shadow py-2 border border-dark" id = "powder-special-stats"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
|
@ -1411,6 +1411,43 @@ function displaysq2SpellDamage(parent_elem, overallparent_elem, build, spell, sp
|
|||
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){
|
||||
|
|
BIN
media/icons/new/toggle_down.png
Normal file
BIN
media/icons/new/toggle_down.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 834 B |
BIN
media/icons/new/toggle_up.png
Normal file
BIN
media/icons/new/toggle_up.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 809 B |
BIN
media/icons/old/toggle_down.png
Normal file
BIN
media/icons/old/toggle_down.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 834 B |
BIN
media/icons/old/toggle_up.png
Normal file
BIN
media/icons/old/toggle_up.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 809 B |
Loading…
Reference in a new issue