finalize mobile ui compress changes
This commit is contained in:
reschan
parent
6bbe371180
commit
fb155bd3bc
4 changed files with 37 additions and 35 deletions
|
|
@ -43,18 +43,18 @@
|
|||
</div>
|
||||
<div class="row h-100 gx-lg-5 gy-3 mx-2 mx-lg-3 py-3 gx-0">
|
||||
<div class="col-xl-6">
|
||||
<div class="row my-2 g-5 dark-6 rounded-top d-flex d-lg-none">
|
||||
<div class="col text-center">
|
||||
<p class="dark-9 fake-button scaled-font" id="equipment-inputs-btn" onclick="show_tab_temp('equipment-inputs', ['equipment-inputs', 'adjust-id'])">Equipments</p>
|
||||
<div class="row my-2 dark-6 rounded text-center g-0 px-3 d-flex d-lg-none">
|
||||
<div class="col">
|
||||
<p class="fake-button scaled-font mb-0 selected-btn" id="equipment-inputs-btn" onclick="show_tab('equipment-inputs', ['equipment-inputs', 'adjust-id'])">Equipments</p>
|
||||
</div>
|
||||
<div class="col text-center">
|
||||
<p class="dark-9 fake-button scaled-font" id="adjust-id-btn" onclick="show_tab_temp('adjust-id', ['equipment-inputs', 'adjust-id'])">Boosts</p>
|
||||
<div class="col">
|
||||
<p class="fake-button scaled-font mb-0" id="adjust-id-btn" onclick="show_tab('adjust-id', ['equipment-inputs', 'adjust-id'])">Ability Tree</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row row-cols-1 mb-3 gy-4" id="equipment-inputs">
|
||||
<div class="col">
|
||||
<div class="row row-cols-1 row-cols-xl-2 dark-shadow dark-6 justify-content-center equipment-input">
|
||||
<div class="col-auto rounded order-xl-0 order-0">
|
||||
<div class="row row-cols-1 row-cols-xl-2 dark-shadow dark-6 justify-content-center equipment-input rounded gy-3 gy-lg-0 mt-auto">
|
||||
<div class="col-auto rounded order-xl-0 order-0 my-0">
|
||||
<div class="row h-100 px-1" id="helmet-dropdown">
|
||||
<div class="col-auto px-lg-1 g-0 dark-7 rounded-end my-auto text-center scaled-item-icon" id="helmet-img-loc">
|
||||
<div id="helmet-img" class="img-fluid rounded item-display-new-toggleable" style="background-image: url('../media/items/new.png'); background-position: 45.45454545454546% 0;"></div>
|
||||
|
|
@ -81,7 +81,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto order-xl-0 order-1">
|
||||
<div class="col-auto order-xl-0 order-1 my-0">
|
||||
<div class="row h-100 px-1" id="ring1-dropdown">
|
||||
<div class="col-auto px-lg-1 g-0 dark-7 rounded-end my-auto text-center scaled-item-icon" id="ring1-img-loc">
|
||||
<div id="ring1-img" class="img-fluid rounded item-display-new-toggleable" style="background-image: url('../media/items/new.png'); background-position: 81.81818181818181% 0;"></div>
|
||||
|
|
@ -1379,24 +1379,20 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-3 mb-3 order-2 order-lg-1">
|
||||
<div class="col-xl-3 mb-3 order-2 order-lg-0">
|
||||
<div class="row row-cols-1 rounded dark-shadow dark-6 scaled-font">
|
||||
<div class="col rounded-top">
|
||||
<div class="row">
|
||||
<div id="tab-offensive-btn" class="col-4 text-center fake-button border-bottom border-dark rounded-top dark-4u border border-2 border-dark-7" onclick="show_tab('offensive-stats')">
|
||||
Offense
|
||||
<div id="detailed-stats-btn" class="col text-center fake-button border-bottom border-dark rounded-top dark-4u border border-2 border-dark-7" onclick="show_tab('detailed-stats', ['detailed-stats', 'summary-stats'])">
|
||||
Detailed
|
||||
</div>
|
||||
<div id="tab-defensive-btn" class="col-4 text-center fake-button border-bottom border-dark rounded-top dark-4u border border-2 border-dark-7" onclick="show_tab('defensive-stats')">
|
||||
Defense
|
||||
</div>
|
||||
<div id="tab-overall-btn" class="col-4 text-center fake-button border-bottom border-dark rounded-top dark-4u border border-2 border-dark-7 selected-btn" onclick="show_tab('overall-stats')">
|
||||
Overall
|
||||
<div id="summary-stats-btn" class="col text-center fake-button border-bottom border-dark rounded-top dark-4u border border-2 border-dark-7 selected-btn" onclick="show_tab('summary-stats', ['detailed-stats', 'summary-stats'])">
|
||||
Summary
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: none;" id="offensive-stats" class="col text-nowrap"></div>
|
||||
<div style="display: none;" id="defensive-stats" class="col text-nowrap"></div>
|
||||
<div id="overall-stats" class="col text-nowrap"></div>
|
||||
<div style="display: none;" id="detailed-stats" class="col text-nowrap"></div>
|
||||
<div id="summary-stats" class="col text-nowrap"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xl-3 mb-3 px-0">
|
||||
|
|
|
|||
|
|
@ -142,18 +142,9 @@ function toggle_boost_tab(tab) {
|
|||
document.getElementById(tab + "-boost-tab").classList.add("selected-btn");
|
||||
}
|
||||
|
||||
let tabs = ['overall-stats', 'offensive-stats', 'defensive-stats'];
|
||||
function show_tab(tab) {
|
||||
//hide all tabs, then show the tab of the div clicked and highlight the correct button
|
||||
for (const i in tabs) {
|
||||
document.querySelector("#" + tabs[i]).style.display = "none";
|
||||
document.getElementById("tab-" + tabs[i].split("-")[0] + "-btn").classList.remove("selected-btn");
|
||||
}
|
||||
document.querySelector("#" + tab).style.display = "";
|
||||
document.getElementById("tab-" + tab.split("-")[0] + "-btn").classList.add("selected-btn");
|
||||
}
|
||||
// let tabs = ['overall-stats', 'offensive-stats', 'defensive-stats'];
|
||||
|
||||
function show_tab_temp(target, tabs) {
|
||||
function show_tab(target, tabs) {
|
||||
//console.log(itemFilters)
|
||||
|
||||
//hide all tabs, then show the tab of the div clicked and highlight the correct button
|
||||
|
|
|
|||
|
|
@ -705,11 +705,11 @@ class BuildDisplayNode extends ComputeNode {
|
|||
compute_func(input_map) {
|
||||
const build = input_map.get('build');
|
||||
const stats = input_map.get('stats');
|
||||
displayBuildStats('overall-stats', build, build_all_display_commands, stats);
|
||||
displayBuildStats("offensive-stats", build, build_offensive_display_commands, stats);
|
||||
displayBuildStats('summary-stats', build, build_overall_display_commands, stats);
|
||||
displayBuildStats("detailed-stats", build, build_detailed_display_commands, stats);
|
||||
displaySetBonuses("set-info", build);
|
||||
// TODO: move weapon out?
|
||||
displayDefenseStats(document.getElementById("defensive-stats"), stats);
|
||||
// displayDefenseStats(document.getElementById("defensive-stats"), stats);
|
||||
|
||||
displayPoisonDamage(document.getElementById("build-poison-stats"), build);
|
||||
displayEquipOrder(document.getElementById("build-order"), build.equip_order);
|
||||
|
|
|
|||
|
|
@ -209,7 +209,7 @@ let posModSuffixes = {
|
|||
/*
|
||||
* Display commands
|
||||
*/
|
||||
let build_all_display_commands = [
|
||||
let build_overall_display_commands = [
|
||||
"#defense-stats",
|
||||
"!spacer",
|
||||
"mr", "ms",
|
||||
|
|
@ -226,8 +226,13 @@ let build_all_display_commands = [
|
|||
"gXp", "gSpd",
|
||||
];
|
||||
|
||||
let build_offensive_display_commands = [
|
||||
let build_detailed_display_commands = [
|
||||
"#defense-stats",
|
||||
"str", "dex", "int", "def", "agi",
|
||||
"!spacer",
|
||||
"mr", "ms",
|
||||
"hprRaw", "hprPct",
|
||||
"ls",
|
||||
"sdRaw", "sdPct",
|
||||
"mdRaw", "mdPct",
|
||||
"!elemental",
|
||||
|
|
@ -235,7 +240,17 @@ let build_offensive_display_commands = [
|
|||
"!elemental",
|
||||
"spPct1", "spRaw1", "spPct2", "spRaw2", "spPct3", "spRaw3", "spPct4", "spRaw4",
|
||||
"atkTier",
|
||||
"poison",
|
||||
"ref", "thorns",
|
||||
"expd",
|
||||
"spd",
|
||||
"rainbowRaw",
|
||||
"sprint", "sprintReg",
|
||||
"jh",
|
||||
"xpb", "lb", "lq",
|
||||
"spRegen",
|
||||
"eSteal",
|
||||
"gXp", "gSpd",
|
||||
];
|
||||
|
||||
// full
|
||||
|
|
|
|||
Loading…
Reference in a new issue