bugged passive powder sliders

This commit is contained in:
ferricles 2022-01-10 01:16:24 -05:00
parent 3ed14763bf
commit b58e992f92
4 changed files with 69 additions and 14 deletions

View file

@ -128,6 +128,46 @@
.aDam:before, .Air:before, .Air_powder:before { content: "\274b" ' '; }
.e_slider, .t_slider, .w_slider, .f_slider, .a_slider {
-webkit-appearance: none;
background: #AAAAAA;
border-radius: 30px;
height: 0.5rem;
}
/***** Chrome, Safari, Opera, and Edge Chromium *****/
.e_slider::-webkit-slider-runnable-track, .t_slider::-webkit-slider-runnable-track, .w_slider::-webkit-slider-runnable-track, .f_slider::-webkit-slider-runnable-track, .a_slider::-webkit-slider-runnable-track {
-webkit-appeareance: none;
background:transparent;
height: 0.5rem;
}
/******** Firefox **** **/
.e_slider::-moz-range-track, .t_slider::-moz-range-track, .w_slider::-moz-range-track, .f_slider::-moz-range-track, .a_slider::-moz-range-track {
-webkit-appearance: none;
background-color: transparent;
border-radius: 30px;
height: 0.5rem;
}
.e_slider::-webkit-slider-thumb, .t_slider::-webkit-slider-thumb, .w_slider::-webkit-slider-thumb, .f_slider::-webkit-slider-thumb, .a_slider::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
height: 0.75rem;
width: 0.75rem;
border-radius: 0.375rem;
margin-top: -0.125rem;
background-color: #FFFFFF;
border: solid 2px #82CFD0;
}
input[type=range]:focus {
outline: none; /* Removes the border. */
}
.nDam, .Neutral {
color: #FFAA00;
}

View file

@ -491,7 +491,7 @@
Rage (Passive)
</div>
<div class="col">
<input type = "range" id = "str_boost_armor" name = "str-boost-armor" min = '0' max = '396' value = '0' step = '1' onchange = "updateArmorPowderSpecials('dex_boost_armor')">
<input type = "range" class = "e_slider" id = "str_boost_armor" name = "str-boost-armor" min = '0' max = '396' value = '0' step = '1' onchange = "updateArmorPowderSpecials('str_boost_armor')">
<label id = "str_boost_armor_label" for="str-boost-armor">% Earth Dmg Boost: 0</label>
</div>
</div>
@ -534,7 +534,7 @@
Kill Streak (Passive)
</div>
<div class="col">
<input type = "range" id = "dex_boost_armor" name = "dex-boost-armor" min = '0' max = '200' value = '0' step = '1' onchange = "updateArmorPowderSpecials('dex_boost_armor')">
<input type = "range" class = "t_slider" id = "dex_boost_armor" name = "dex-boost-armor" min = '0' max = '200' value = '0' step = '1' onchange = "updateArmorPowderSpecials('dex_boost_armor')">
<label id = "dex_boost_armor_label" for="dex-boost-armor">% Thunder Dmg Boost: 0</label>
</div>
</div>
@ -577,7 +577,7 @@
Concentration (Passive)
</div>
<div class="col">
<input type = "range" id = "int_boost_armor" name = "dex-boost-armor" min = '0' max = '150' value = '0' step = '1' onchange = "updateArmorPowderSpecials('int_boost_armor')">
<input type = "range" class = "w_slider" id = "int_boost_armor" name = "dex-boost-armor" min = '0' max = '150' value = '0' step = '1' onchange = "updateArmorPowderSpecials('int_boost_armor')">
<label id = "int_boost_armor_label" for="dex-boost-armor">% Water Dmg Boost: 0</label>
</div>
</div>
@ -620,7 +620,7 @@
Endurance (Passive)
</div>
<div class="col">
<input type = "range" id = "def_boost_armor" name = "def-boost-armor" min = '0' max = '200' value = '0' step = '1' onchange = "updateArmorPowderSpecials('def_boost_armor')">
<input type = "range" class = "f_slider" id = "def_boost_armor" name = "def-boost-armor" min = '0' max = '200' value = '0' step = '1' onchange = "updateArmorPowderSpecials('def_boost_armor')">
<label id = "def_boost_armor_label" for="def-boost-armor">% Fire Dmg Boost: 0</label>
</div>
</div>
@ -663,7 +663,7 @@
Dodge (Passive)
</div>
<div class="col">
<input type = "range" id = "agi_boost_armor" name = "agi-boost-armor" min = '0' max = '150' value = '0' step = '1' onchange = "updateArmorPowderSpecials('agi_boost_armor')">
<input type = "range" class = "a_slider" id = "agi_boost_armor" name = "agi-boost-armor" min = '0' max = '150' value = '0' step = '1' onchange = "updateArmorPowderSpecials('agi_boost_armor')">
<label id = "agi_boost_armor_label" for="agi-boost-armor">% Air Dmg Boost: 0</label>
</div>
</div>

View file

@ -655,19 +655,26 @@ function updateArmorPowderSpecials(elem_id) {
let elem = document.getElementById(elem_id);
let value = elem.value;
let label = document.getElementById(elem_id + "_label");
label.textContent = label.textContent.split(":")[0] + ": " + value;
if (player_build) {
let dmg_id = elem_chars[skp_names.indexOf(wynn_elem)] + "DamPct";
let new_dmgboost = player_build.externalStats.get(dmg_id) + (value - armor_powder_boosts[skp_names.indexOf(wynn_elem)]);
armor_powder_boosts[skp_names.indexOf(wynn_elem)] = value;
let label = document.getElementById(elem_id + "_label");
label.textContent = label.textContent.split(":")[0] + ": " + elem.value;
//update build stats
player_build.externalStats.set(dmg_id, new_dmgboost);
//calc build stats and display powder special
calculateBuildStats();
// displaysq2PowderSpecials(document.getElementById("powder-special-stats"), powderSpecials, player_build, true);
}
//update the slider's graphics
let bg_color = elem_colors[skp_names.indexOf(wynn_elem)];
let pct = Math.round(100 * value / powderSpecialStats[skp_names.indexOf(wynn_elem)].cap);
elem.setAttribute("style.background",`linear-gradient(to right, ${bg_color}, ${bg_color} ${pct}%, #AAAAAA ${pct}%, #AAAAAA ${100 - pct}%)`);
}
/* Calculates all build statistics and updates the entire display.

View file

@ -30,6 +30,14 @@ let elem_chars = [
'a'
]
let elem_colors = [
"#00AA00",
"FFFF55",
"55FFFF",
"FF5555",
"FFFFFF"
]
/*
* Display commands
*/