feat: wynnatlas mini
This commit is contained in:
reschan
parent
f4e60bf5dd
commit
bafb2b1662
7 changed files with 254 additions and 145 deletions
BIN
media/icons/new/copy.png
Normal file
BIN
media/icons/new/copy.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 300 B |
15
sq2bs.css
15
sq2bs.css
|
|
@ -293,10 +293,6 @@ input.equipment-input {
|
||||||
.spell-display b {
|
.spell-display b {
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mobile-only {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (min-width: 1400px) {
|
@media screen and (min-width: 1400px) {
|
||||||
|
|
@ -337,10 +333,13 @@ input.equipment-input {
|
||||||
.spell-display b {
|
.spell-display b {
|
||||||
font-size: 1.2rem;
|
font-size: 1.2rem;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
.mobile-only {
|
/* WynnAtlas Mini */
|
||||||
display: none;
|
.search-field {
|
||||||
}
|
background-color: hsl(0, 0%, 14%) !important;
|
||||||
|
color: white;
|
||||||
|
font-weight: bold;
|
||||||
|
border-color: hsl(0, 0%, 8%);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Fake button for build stats */
|
/* Fake button for build stats */
|
||||||
|
|
|
||||||
149
sq2bs.html
149
sq2bs.html
|
|
@ -22,11 +22,8 @@
|
||||||
<!-- main -->
|
<!-- main -->
|
||||||
<div id="main-sidebar" class="sidebar dark-7 dark-shadow">
|
<div id="main-sidebar" class="sidebar dark-7 dark-shadow">
|
||||||
<a href=""><img src="media/icons/new/atlas64.png" alt="place" title="WynnBuilder"><b>WynnBuilder</b></a>
|
<a href=""><img src="media/icons/new/atlas64.png" alt="place" title="WynnBuilder"><b>WynnBuilder</b></a>
|
||||||
<a href=""><img src="media/icons/new/searcher.png" alt="" title="Item Search"><b>WynnAtlas Mini</b></a>
|
<a onclick="document.querySelector('#search-container').style.display = '';"><img src="media/icons/new/searcher.png" alt="" title="Item Search"><b>WynnAtlas Mini</b></a>
|
||||||
<hr/>
|
<hr/>
|
||||||
<a onclick="shareBuild()" style="cursor: pointer;"><img src="media/items/new/generic-scroll.png" alt="" title="Item Search"><b>Copy For Sharing</b></a>
|
|
||||||
<a onclick="copyBuild()" style="cursor: pointer;"><img src="media/icons/new/save.png" alt="" title="Item Search"><b>Copy build</b></a>
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="container py-5 vh-100 mx-0 mx-lg-auto">
|
<div class="container py-5 vh-100 mx-0 mx-lg-auto">
|
||||||
<div class="row h-100 row-cols-1">
|
<div class="row h-100 row-cols-1">
|
||||||
|
|
@ -284,40 +281,21 @@
|
||||||
<div class="col-auto g-0 dark-7 rounded-end my-auto text-center dark-shadow-sm scaled-item-icon" id="weapon-img-loc">
|
<div class="col-auto g-0 dark-7 rounded-end my-auto text-center dark-shadow-sm scaled-item-icon" id="weapon-img-loc">
|
||||||
<img class="img-fluid" src="media/icons/new/Gears.png">
|
<img class="img-fluid" src="media/icons/new/Gears.png">
|
||||||
</div>
|
</div>
|
||||||
<div class="col-3">
|
<div class="col">
|
||||||
<div class="row row-cols-1 h-100 align-items-center">
|
<div class="row align-items-center">
|
||||||
<div class="col text-nowrap scaled-font">
|
<div class="col-3 text-nowrap scaled-font">
|
||||||
Level:
|
Level:
|
||||||
</div>
|
</div>
|
||||||
<div class="col text-nowrap scaled-font">
|
|
||||||
Load:
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col g-0 rounded">
|
|
||||||
<div class="row row-cols-1 h-100 align-items-center">
|
|
||||||
<div class="col d-flex justify-content-end">
|
<div class="col d-flex justify-content-end">
|
||||||
<input class="border-dark text-light dark-5 rounded scaled-font form-control form-control-sm" id="level-choice" name="level-choice" value="106" placeholder="Build level" value="" tabindex="2"/>
|
<input class="border-dark text-light dark-5 rounded scaled-font form-control form-control-sm" id="level-choice" name="level-choice" value="106" placeholder="Build level" value="" tabindex="2"/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col d-flex justify-content-end">
|
|
||||||
<input class="border-dark text-light dark-5 rounded scaled-font form-control form-control-sm" type="text" placeholder="Load from local" tabindex="2"/>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="row align-items-center">
|
||||||
|
<div class="col-auto px-1 text-nowrap scaled-font">
|
||||||
|
<button class="border-dark text-light dark-5 rounded scaled-font rounded" onclick="copyBuild()">Copy short</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="col-auto px-1 text-nowrap scaled-font">
|
||||||
</div>
|
<button class="border-dark text-light dark-5 rounded scaled-font rounded" onclick="shareBuild()">Copy for sharing</button>
|
||||||
</div>
|
|
||||||
<div class="col-auto rounded order-xl-0 order-1 mobile-only">
|
|
||||||
<div class="row h-100 dark-shadow dark-6 rounded">
|
|
||||||
<div class="col-auto g-0 dark-7 rounded-end my-auto text-center dark-shadow-sm scaled-item-icon" id="weapon-img-loc">
|
|
||||||
<img class="img-fluid" src="media/items/new/generic-scroll.png">
|
|
||||||
</div>
|
|
||||||
<div class="col g-0 rounded">
|
|
||||||
<div class="row gy-3 row-cols-1 h-100 align-items-center">
|
|
||||||
<div class="col d-flex justify-content-end">
|
|
||||||
<button class="border-dark text-light dark-5 rounded scaled-font w-75 rounded" onclick="copyBuild()">Copy short</button>
|
|
||||||
</div>
|
|
||||||
<div class="col d-flex justify-content-end">
|
|
||||||
<button class="border-dark text-light dark-5 rounded scaled-font w-75 rounded" onclick="shareBuild()">Copy For Sharing</button>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -775,6 +753,56 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="container h-75 mx-0 mx-lg-auto dark-2 border border-4 scaled-font align-self-center" style="position: fixed; z-index: 2; overflow: auto; display: none;" id="search-container">
|
||||||
|
<div class="row justify-content-end">
|
||||||
|
<div class="col-auto">
|
||||||
|
<button type="button" class="btn-close btn-close-white" aria-label="Close" onclick="document.querySelector('#search-container').style.display = 'none';"></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row row-cols-1 justify-content-center">
|
||||||
|
<div class="col-8 dark-5 p-2 dark-shadow rounded-top">
|
||||||
|
<div class="row row-cols-1 row-cols-xl-4 justify-content-center">
|
||||||
|
<div class="col-auto">
|
||||||
|
<label for="name-choice">Name:</label>
|
||||||
|
<input class="search-field" type="text" id="name-choice" name="name-choice" placeholder="Name" oninput="doSearchSchedule();"/>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
|
<label for="category-choice">Category:</label>
|
||||||
|
<input class="search-field" id="category-choice" name="category-choice" placeholder="Category"/>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
|
<label for="rarity-choice">Rarity:</label>
|
||||||
|
<input class="search-field" id="rarity-choice" name="rarity-choice" placeholder="Rarity"/>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
|
<label for="search-level-choice">Level:</label>
|
||||||
|
<input class="search-field" type="text" id="search-level-choice" name="search-level-choice" value="1-106"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row row-cols-1 row-cols-xl-4 justify-content-center mt-1">
|
||||||
|
<div class="col-auto" id="filter1-dropdown">
|
||||||
|
<label for="filter1-choice">Filter 1:</label>
|
||||||
|
<input class="search-field" list="filter-items" id="filter1-choice" name="filter1-choice" placeholder="Filter"/>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto" id="filter2-dropdown">
|
||||||
|
<label for="filter2-choice">Filter 2:</label>
|
||||||
|
<input class="search-field" list="filter-items" id="filter2-choice" name="filter2-choice" placeholder="Filter"/>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto" id="filter3-dropdown">
|
||||||
|
<label for="filter3-choice">Filter 3:</label>
|
||||||
|
<input class="search-field" list="filter-items" id="filter3-choice" name="filter3-choice" placeholder="Filter"/>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto" id="filter4-dropdown">
|
||||||
|
<label for="filter4-choice">Filter 4:</label>
|
||||||
|
<input class="search-field" list="filter-items" id="filter4-choice" name="filter4-choice" placeholder="Filter"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col p-4">
|
||||||
|
<div class="row justify-content-center" id="search-results"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<!--div id="drag-edit-ids" style="display: none;">
|
<!--div id="drag-edit-ids" style="display: none;">
|
||||||
<div class="id-box fade-in" id="id-edit" style="display: none">
|
<div class="id-box fade-in" id="id-edit" style="display: none">
|
||||||
<div class="id-edit1">
|
<div class="id-edit1">
|
||||||
|
|
@ -1171,65 +1199,6 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div-->
|
</div-->
|
||||||
<div style="display: none;">
|
|
||||||
<div id="search-container" class="draggable full-border window-container" style="border-top: none;">
|
|
||||||
<div id="search-container-header" class="window-header">
|
|
||||||
<div style="flex: 1"></div>
|
|
||||||
<div style="flex: 2; text-align: center;">sq2-Search</div>
|
|
||||||
<div style="flex: 1; text-align: right;"><button onclick="$('#search-container').toggle()">[x]</button></div>
|
|
||||||
</div>
|
|
||||||
<div style="display: inline-flex;">
|
|
||||||
<div style="display: inline-flex; flex-direction: column; flex: 1">
|
|
||||||
<input class="search-field" type="text" id="name-choice" name="name-choice" placeholder="Name"/>
|
|
||||||
<input class="search-field" list="category-items" id="category-choice" name="category-choice" placeholder="Category"/>
|
|
||||||
<datalist id="category-items">
|
|
||||||
<option value="ALL">
|
|
||||||
<option value="armor">
|
|
||||||
<option value="helmet">
|
|
||||||
<option value="chestplate">
|
|
||||||
<option value="leggings">
|
|
||||||
<option value="boots">
|
|
||||||
<option value="accessory">
|
|
||||||
<option value="ring">
|
|
||||||
<option value="bracelet">
|
|
||||||
<option value="necklace">
|
|
||||||
<option value="weapon">
|
|
||||||
<option value="wand">
|
|
||||||
<option value="spear">
|
|
||||||
<option value="bow">
|
|
||||||
<option value="dagger">
|
|
||||||
<option value="relik">
|
|
||||||
</datalist>
|
|
||||||
|
|
||||||
<input class="search-field" list="rarity-items" id="rarity-choice" name="rarity-choice" placeholder="Rarity"/>
|
|
||||||
<datalist id="rarity-items">
|
|
||||||
<option value="ANY">
|
|
||||||
<option value="Normal">
|
|
||||||
<option value="Unique">
|
|
||||||
<option value="Set">
|
|
||||||
<option value="Rare">
|
|
||||||
<option value="Legendary">
|
|
||||||
<option value="Fabled">
|
|
||||||
<option value="Mythic">
|
|
||||||
<option value="Sane">
|
|
||||||
</datalist>
|
|
||||||
|
|
||||||
<input class="search-field" type="text" id="search-level-choice" name="search-level-choice" value="1-106"/>
|
|
||||||
</div>
|
|
||||||
<div style="display: inline-flex; flex: 2;"></div>
|
|
||||||
<div style="display: inline-flex; flex-direction: column; flex: 1; justify-content: right;">
|
|
||||||
<datalist id="filter-items">
|
|
||||||
</datalist>
|
|
||||||
<input class="search-field" list="filter-items" id="filter1-choice" name="filter1-choice" placeholder="Filter"/>
|
|
||||||
<input class="search-field" list="filter-items" id="filter2-choice" name="filter2-choice" placeholder="Filter"/>
|
|
||||||
<input class="search-field" list="filter-items" id="filter3-choice" name="filter3-choice" placeholder="Filter"/>
|
|
||||||
<input class="search-field" list="filter-items" id="filter4-choice" name="filter4-choice" placeholder="Filter"/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="search-result-container" id='main'>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@10.2.6/dist/autoComplete.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@10.2.6/dist/autoComplete.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/macy@2"></script>
|
<script src="https://cdn.jsdelivr.net/npm/macy@2"></script>
|
||||||
|
|
|
||||||
117
sq2bs.js
117
sq2bs.js
|
|
@ -10,7 +10,7 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||||
for (const eq of equipment_keys) {
|
for (const eq of equipment_keys) {
|
||||||
document.querySelector("#"+eq+"-choice").setAttribute("oninput", "update_field('"+ eq +"'); calcBuildSchedule();");
|
document.querySelector("#"+eq+"-choice").setAttribute("oninput", "update_field('"+ eq +"'); calcBuildSchedule();");
|
||||||
document.querySelector("#"+eq+"-powder").setAttribute("oninput", "calcBuildSchedule();");
|
document.querySelector("#"+eq+"-powder").setAttribute("oninput", "calcBuildSchedule();");
|
||||||
document.querySelector("#"+eq+"-tooltip").setAttribute("onclick", "collapse_element('"+ eq +"')");
|
document.querySelector("#"+eq+"-tooltip").setAttribute("onclick", "collapse_element('#"+ eq +"-tooltip')");
|
||||||
}
|
}
|
||||||
|
|
||||||
for (const i of spell_disp) {
|
for (const i of spell_disp) {
|
||||||
|
|
@ -39,7 +39,25 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
let search_masonry = Macy({
|
||||||
|
container: "#search-results",
|
||||||
|
columns: 1,
|
||||||
|
mobileFirst: true,
|
||||||
|
breakAt: {
|
||||||
|
1200: 4,
|
||||||
|
},
|
||||||
|
margin: {
|
||||||
|
x: 20,
|
||||||
|
y: 20,
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
document.querySelector("#search-container").addEventListener("keyup", function(event) {
|
||||||
|
if (event.key === "Escape") {
|
||||||
|
document.querySelector("#search-container").style.display = "none";
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
@ -75,6 +93,7 @@ function doSearchSchedule(){
|
||||||
doSearchTask = setTimeout(function(){
|
doSearchTask = setTimeout(function(){
|
||||||
doSearchTask = null;
|
doSearchTask = null;
|
||||||
doItemSearch();
|
doItemSearch();
|
||||||
|
window.dispatchEvent(new Event('resize'));
|
||||||
}, 500);
|
}, 500);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -122,6 +141,14 @@ function update_field(field) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if ((type != field.replace(/[0-9]/g, '')) && (category != field.replace(/[0-9]/g, ''))) {
|
||||||
|
document.querySelector("#"+field+"-choice").classList.add("text-light");
|
||||||
|
if (item) { document.querySelector("#"+field+"-choice").classList.add("is-invalid"); }
|
||||||
|
|
||||||
|
document.querySelector("#"+equipment_keys[i]+"-powder").disabled = true;
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
// set item color
|
// set item color
|
||||||
document.querySelector("#"+field+"-choice").classList.add(tier);
|
document.querySelector("#"+field+"-choice").classList.add(tier);
|
||||||
|
|
||||||
|
|
@ -141,11 +168,12 @@ function update_field(field) {
|
||||||
|
|
||||||
// call calc build
|
// call calc build
|
||||||
}
|
}
|
||||||
/* tabulars */
|
/* tabulars | man i hate this code but too lazy to fix /shrug */
|
||||||
|
|
||||||
let tabs = ['all-stats', 'minimal-offensive-stats', 'minimal-defensive-stats'];
|
let tabs = ['all-stats', 'minimal-offensive-stats', 'minimal-defensive-stats'];
|
||||||
|
|
||||||
function show_tab(tab) {
|
function show_tab(tab) {
|
||||||
|
console.log(itemFilters)
|
||||||
for (const i in tabs) {
|
for (const i in tabs) {
|
||||||
document.querySelector("#"+tabs[i]).style.display = "none";
|
document.querySelector("#"+tabs[i]).style.display = "none";
|
||||||
}
|
}
|
||||||
|
|
@ -176,19 +204,9 @@ function toggle_tab(tab) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function toggle_edit(id) {
|
function collapse_element(elmnt) {
|
||||||
if (document.querySelector("#"+id).style.display == "none") {
|
elem_list = document.querySelector(elmnt).children;
|
||||||
document.querySelector("#"+id+"-val").style.display = "none";
|
|
||||||
document.querySelector("#"+id).style.display = "";
|
|
||||||
} else {
|
|
||||||
document.querySelector("#"+id+"-val").style.display = "";
|
|
||||||
document.querySelector("#"+id).style.display = "none";
|
|
||||||
updateStatSchedule();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function collapse_element(eq) {
|
|
||||||
elem_list = document.querySelector("#"+eq+"-tooltip").children
|
|
||||||
for (elem of elem_list) {
|
for (elem of elem_list) {
|
||||||
if (elem.classList.contains("no-collapse")) { continue; }
|
if (elem.classList.contains("no-collapse")) { continue; }
|
||||||
if (elem.style.display == "none") {
|
if (elem.style.display == "none") {
|
||||||
|
|
@ -200,7 +218,28 @@ function collapse_element(eq) {
|
||||||
// macy quirk
|
// macy quirk
|
||||||
window.dispatchEvent(new Event('resize'));
|
window.dispatchEvent(new Event('resize'));
|
||||||
// weird bug where display: none overrides??
|
// weird bug where display: none overrides??
|
||||||
document.querySelector("#"+eq+"-tooltip").style.display = "";
|
document.querySelector(elmnt).style.display = "";
|
||||||
|
}
|
||||||
|
|
||||||
|
// search misc
|
||||||
|
function set_item(item) {
|
||||||
|
document.querySelector("#search-container").style.display = "none";
|
||||||
|
let type;
|
||||||
|
// if (!player_build) {return false;}
|
||||||
|
if (item.get("category") === "weapon") {
|
||||||
|
type = "weapon";
|
||||||
|
} else if (item.get("type") === "ring") {
|
||||||
|
if (!document.querySelector("#ring1-choice").value) {
|
||||||
|
type = "ring1";
|
||||||
|
} else {
|
||||||
|
type = "ring2";
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
type = item.get("type");
|
||||||
|
}
|
||||||
|
document.querySelector("#"+type+"-choice").value = item.get("displayName");
|
||||||
|
calcBuildSchedule();
|
||||||
|
update_field(type);
|
||||||
}
|
}
|
||||||
|
|
||||||
// disable boosts
|
// disable boosts
|
||||||
|
|
@ -295,4 +334,52 @@ function init_autocomplete() {
|
||||||
}
|
}
|
||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
|
let filter_loc = ["filter1", "filter2", "filter3", "filter4"];
|
||||||
|
for (const i of filter_loc) {
|
||||||
|
console.log(i);
|
||||||
|
console.log('init dropdown for '+i+"-choice" )
|
||||||
|
dropdowns.set(i+"-choice", new autoComplete({
|
||||||
|
data: {
|
||||||
|
src: itemFilters,
|
||||||
|
},
|
||||||
|
selector: "#"+i+"-choice",
|
||||||
|
wrapper: false,
|
||||||
|
resultsList: {
|
||||||
|
tabSelect: true,
|
||||||
|
noResults: true,
|
||||||
|
class: "search-box dark-7 rounded-bottom px-2 fw-bold dark-shadow-sm",
|
||||||
|
element: (list, data) => {
|
||||||
|
// dynamic result loc
|
||||||
|
console.log(i);
|
||||||
|
list.style.zIndex = "100";
|
||||||
|
let position = document.getElementById(i+"-dropdown").getBoundingClientRect();
|
||||||
|
window_pos = document.getElementById("search-container").getBoundingClientRect();
|
||||||
|
list.style.top = position.bottom - window_pos.top + 5 +"px";
|
||||||
|
list.style.left = position.x - window_pos.x +"px";
|
||||||
|
list.style.width = position.width+"px";
|
||||||
|
|
||||||
|
if (!data.results.length) {
|
||||||
|
message = document.createElement('li');
|
||||||
|
message.classList.add('scaled-font');
|
||||||
|
message.textContent = "No filters found!";
|
||||||
|
list.prepend(message);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
resultItem: {
|
||||||
|
class: "scaled-font search-item",
|
||||||
|
selected: "dark-5",
|
||||||
|
},
|
||||||
|
events: {
|
||||||
|
input: {
|
||||||
|
selection: (event) => {
|
||||||
|
if (event.detail.selection.value) {
|
||||||
|
event.target.value = event.detail.selection.value;
|
||||||
|
}
|
||||||
|
doSearchSchedule();
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}));
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -743,14 +743,14 @@ function calculateBuildStats() {
|
||||||
if (player_build.items[i].get("id") > 9999) {
|
if (player_build.items[i].get("id") > 9999) {
|
||||||
continue;
|
continue;
|
||||||
}
|
}
|
||||||
displaysq2ExpandedItem(player_build.items[i], buildFields[i], false);
|
displaysq2ExpandedItem(player_build.items[i], buildFields[i]);
|
||||||
collapse_element(equipment_keys[i]);
|
collapse_element("#"+equipment_keys[i]+"-tooltip");
|
||||||
}
|
}
|
||||||
|
|
||||||
displaysq2ArmorStats(player_build);
|
displaysq2ArmorStats(player_build);
|
||||||
displaysq2BuildStats("all-stats", player_build, build_all_display_commands);
|
displaysq2BuildStats("all-stats", player_build, build_all_display_commands);
|
||||||
displaysq2BuildStats("minimal-offensive-stats",player_build, build_offensive_display_commands);
|
displaysq2BuildStats("minimal-offensive-stats",player_build, build_offensive_display_commands);
|
||||||
displaySetBonuses("set-info",player_build);
|
displaysq2SetBonuses("set-info",player_build);
|
||||||
|
|
||||||
let meleeStats = player_build.getMeleeStats();
|
let meleeStats = player_build.getMeleeStats();
|
||||||
displaysq2MeleeDamage(document.getElementById("build-melee-stats"), document.getElementById("build-melee-statsAvg"), meleeStats);
|
displaysq2MeleeDamage(document.getElementById("build-melee-stats"), document.getElementById("build-melee-statsAvg"), meleeStats);
|
||||||
|
|
@ -795,18 +795,34 @@ function shareBuild() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function populateBuildList() {
|
||||||
|
const buildList = document.getElementById("build-choice");
|
||||||
|
const savedBuilds = window.localStorage.getItem("builds") === null ? {} : JSON.parse(window.localStorage.getItem("builds"));
|
||||||
|
|
||||||
|
for (const buildName of Object.keys(savedBuilds).sort()) {
|
||||||
|
const buildOption = document.createElement("option");
|
||||||
|
buildOption.setAttribute("value", buildName);
|
||||||
|
buildList.appendChild(buildOption);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function saveBuild() {
|
function saveBuild() {
|
||||||
if (player_build) {
|
if (player_build) {
|
||||||
let savedBuilds = window.localStorage.getItem("builds") === null ? {} : JSON.parse(window.localStorage.getItem("builds"));
|
const savedBuilds = window.localStorage.getItem("builds") === null ? {} : JSON.parse(window.localStorage.getItem("builds"));
|
||||||
let saveName = document.getElementById("build-name").value;
|
const saveName = document.getElementById("build-name").value;
|
||||||
let encodedBuild = encodeBuild();
|
const encodedBuild = encodeBuild();
|
||||||
if ((!Object.keys(savedBuilds).includes(saveName)
|
if ((!Object.keys(savedBuilds).includes(saveName)
|
||||||
|| document.getElementById("saved-error").textContent !== "") && encodedBuild !== "") {
|
|| document.getElementById("saved-error").textContent !== "") && encodedBuild !== "") {
|
||||||
savedBuilds[saveName] = encodedBuild.replace("#", "");
|
savedBuilds[saveName] = encodedBuild.replace("#", "");
|
||||||
window.localStorage.setItem("builds", JSON.stringify(savedBuilds));
|
window.localStorage.setItem("builds", JSON.stringify(savedBuilds));
|
||||||
|
|
||||||
document.getElementById("saved-error").textContent = "";
|
document.getElementById("saved-error").textContent = "";
|
||||||
document.getElementById("saved-build").textContent = "Build saved Locally";
|
document.getElementById("saved-build").textContent = "Build saved locally";
|
||||||
|
|
||||||
|
const buildList = document.getElementById("build-choice");
|
||||||
|
const buildOption = document.createElement("option");
|
||||||
|
buildOption.setAttribute("value", saveName);
|
||||||
|
buildList.appendChild(buildOption);
|
||||||
} else {
|
} else {
|
||||||
document.getElementById("saved-build").textContent = "";
|
document.getElementById("saved-build").textContent = "";
|
||||||
if (encodedBuild === "") {
|
if (encodedBuild === "") {
|
||||||
|
|
@ -868,6 +884,8 @@ function optimizeStrDex() {
|
||||||
const base_skillpoints = player_build.base_skillpoints;
|
const base_skillpoints = player_build.base_skillpoints;
|
||||||
const max_str_boost = 100 - base_skillpoints[0];
|
const max_str_boost = 100 - base_skillpoints[0];
|
||||||
const max_dex_boost = 100 - base_skillpoints[1];
|
const max_dex_boost = 100 - base_skillpoints[1];
|
||||||
|
if (Math.min(remaining, max_str_boost, max_dex_boost) < 0) return; // Unwearable
|
||||||
|
|
||||||
const base_total_skillpoints = player_build.total_skillpoints;
|
const base_total_skillpoints = player_build.total_skillpoints;
|
||||||
let str_bonus = remaining;
|
let str_bonus = remaining;
|
||||||
let dex_bonus = 0;
|
let dex_bonus = 0;
|
||||||
|
|
@ -951,7 +969,7 @@ function optimizeStrDex() {
|
||||||
|
|
||||||
try {
|
try {
|
||||||
calculateBuildStats();
|
calculateBuildStats();
|
||||||
// setTitle();
|
setTitle();
|
||||||
if (player_build.errored)
|
if (player_build.errored)
|
||||||
throw new ListError(player_build.errors);
|
throw new ListError(player_build.errors);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -96,7 +96,7 @@ function displaysq2BuildStats(parent_id,build,command_group){
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function displaysq2ExpandedItem(item, parent_id, mini=false){
|
function displaysq2ExpandedItem(item, parent_id){
|
||||||
// Commands to "script" the creation of nice formatting.
|
// Commands to "script" the creation of nice formatting.
|
||||||
// #commands create a new element.
|
// #commands create a new element.
|
||||||
// !elemental is some janky hack for elemental damage.
|
// !elemental is some janky hack for elemental damage.
|
||||||
|
|
@ -259,19 +259,11 @@ function displaysq2ExpandedItem(item, parent_id, mini=false){
|
||||||
if (item && item.has("type")) {
|
if (item && item.has("type")) {
|
||||||
img.src = "./media/items/" + (newIcons ? "new/":"old/") + "generic-" + item.get("type") + ".png";
|
img.src = "./media/items/" + (newIcons ? "new/":"old/") + "generic-" + item.get("type") + ".png";
|
||||||
img.alt = item.get("type");
|
img.alt = item.get("type");
|
||||||
if (mini) {
|
|
||||||
img.style = " z=index: 1; position: relative;";
|
img.style = " z=index: 1; position: relative;";
|
||||||
} else {
|
|
||||||
img.style = " z=index: 1; position: relative;";
|
|
||||||
}
|
|
||||||
let bckgrd = document.createElement("div");
|
let bckgrd = document.createElement("div");
|
||||||
bckgrd.classList.add("col", "px-0", "d-flex", "align-items-center", "justify-content-center", "no-collapse");
|
bckgrd.classList.add("col", "px-0", "d-flex", "align-items-center", "justify-content-center", "no-collapse");
|
||||||
if (mini) {
|
|
||||||
bckgrd.style = "border-radius: 50%;background-image: radial-gradient(closest-side, " + colorMap.get(item.get("tier")) + " 20%," + "hsl(0, 0%, 16%) 80%); margin-left: auto; margin-right: auto;"
|
|
||||||
} else {
|
|
||||||
bckgrd.style = "border-radius: 50%;background-image: radial-gradient(closest-side, " + colorMap.get(item.get("tier")) + " 20%," + "hsl(0, 0%, 16%) 80%); margin-left: auto; margin-right: auto;"
|
bckgrd.style = "border-radius: 50%;background-image: radial-gradient(closest-side, " + colorMap.get(item.get("tier")) + " 20%," + "hsl(0, 0%, 16%) 80%); margin-left: auto; margin-right: auto;"
|
||||||
bckgrd.classList.add("scaled-bckgrd");
|
bckgrd.classList.add("scaled-bckgrd");
|
||||||
}
|
|
||||||
parent_div.appendChild(bckgrd);
|
parent_div.appendChild(bckgrd);
|
||||||
bckgrd.appendChild(img);
|
bckgrd.appendChild(img);
|
||||||
}
|
}
|
||||||
|
|
@ -1428,3 +1420,49 @@ function apply_sq2_elemental_format(p_elem, id, suffix) {
|
||||||
i_elem2.textContent = " " + desc + suffix;
|
i_elem2.textContent = " " + desc + suffix;
|
||||||
p_elem.appendChild(i_elem2);
|
p_elem.appendChild(i_elem2);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function displaysq2SetBonuses(parent_id,build) {
|
||||||
|
setHTML(parent_id, "");
|
||||||
|
let parent_div = document.getElementById(parent_id);
|
||||||
|
|
||||||
|
let set_summary_elem = document.createElement('p');
|
||||||
|
set_summary_elem.classList.add('text-center');
|
||||||
|
set_summary_elem.textContent = "Set Bonuses";
|
||||||
|
parent_div.append(set_summary_elem);
|
||||||
|
|
||||||
|
if (build.activeSetCounts.size) {
|
||||||
|
parent_div.parentElement.style.display = "block";
|
||||||
|
} else {
|
||||||
|
parent_div.parentElement.style.display = "none";
|
||||||
|
}
|
||||||
|
|
||||||
|
for (const [setName, count] of build.activeSetCounts) {
|
||||||
|
const active_set = sets[setName];
|
||||||
|
if (active_set["hidden"]) { continue; }
|
||||||
|
|
||||||
|
let set_elem = document.createElement('p');
|
||||||
|
set_elem.id = "set-"+setName;
|
||||||
|
set_summary_elem.append(set_elem);
|
||||||
|
|
||||||
|
const bonus = active_set.bonuses[count-1];
|
||||||
|
let mock_item = new Map();
|
||||||
|
mock_item.set("fixID", true);
|
||||||
|
mock_item.set("displayName", setName+" Set: "+count+"/"+sets[setName].items.length);
|
||||||
|
let mock_minRolls = new Map();
|
||||||
|
let mock_maxRolls = new Map();
|
||||||
|
mock_item.set("minRolls", mock_minRolls);
|
||||||
|
mock_item.set("maxRolls", mock_maxRolls);
|
||||||
|
for (const id in bonus) {
|
||||||
|
if (rolledIDs.includes(id)) {
|
||||||
|
mock_minRolls.set(id, bonus[id]);
|
||||||
|
mock_maxRolls.set(id, bonus[id]);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
mock_item.set(id, bonus[id]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
mock_item.set("powders", []);
|
||||||
|
displaysq2ExpandedItem(mock_item, set_elem.id);
|
||||||
|
console.log(mock_item);
|
||||||
|
}
|
||||||
|
}
|
||||||
20
sq2items.js
20
sq2items.js
|
|
@ -104,16 +104,12 @@ const special_mappings = {
|
||||||
"No Defense Req": new NegateQuery("defReq"),
|
"No Defense Req": new NegateQuery("defReq"),
|
||||||
};
|
};
|
||||||
|
|
||||||
let itemFilters = document.getElementById("filter-items");
|
let itemFilters = []
|
||||||
for (let x in translate_mappings) {
|
for (let x in translate_mappings) {
|
||||||
let el = document.createElement("option");
|
itemFilters.push(x);
|
||||||
el.value = x;
|
|
||||||
itemFilters.appendChild(el);
|
|
||||||
}
|
}
|
||||||
for (let x in special_mappings) {
|
for (let x in special_mappings) {
|
||||||
let el = document.createElement("option");
|
itemFilters.push(x);
|
||||||
el.value = x;
|
|
||||||
itemFilters.appendChild(el);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
let itemCategories = [ "armor", "accessory", "weapon" ];
|
let itemCategories = [ "armor", "accessory", "weapon" ];
|
||||||
|
|
@ -123,13 +119,15 @@ function applyQuery(items, query) {
|
||||||
}
|
}
|
||||||
|
|
||||||
function displayItems(items_copy) {
|
function displayItems(items_copy) {
|
||||||
let items_parent = document.getElementById("main");
|
let items_parent = document.getElementById("search-results");
|
||||||
for (let i in items_copy) {
|
for (let i in items_copy) {
|
||||||
|
if (i > 200) {break;}
|
||||||
let item = items_copy[i];
|
let item = items_copy[i];
|
||||||
let box = document.createElement("div");
|
let box = document.createElement("div");
|
||||||
box.style.flex = "1";
|
box.classList.add("col-auto", "dark-7", "dark-shadow");
|
||||||
box.classList.add("box");
|
box.style.position = "absolute";
|
||||||
box.id = "item"+i;
|
box.id = "item"+i;
|
||||||
|
box.addEventListener("dblclick", function() {set_item(item);});
|
||||||
items_parent.appendChild(box);
|
items_parent.appendChild(box);
|
||||||
displaysq2ExpandedItem(item, box.id);
|
displaysq2ExpandedItem(item, box.id);
|
||||||
}
|
}
|
||||||
|
|
@ -178,7 +176,7 @@ function doItemSearch() {
|
||||||
}
|
}
|
||||||
|
|
||||||
let items_copy = items_expanded.slice();
|
let items_copy = items_expanded.slice();
|
||||||
document.getElementById("main").textContent = "";
|
document.getElementById("search-results").textContent = "";
|
||||||
for (const query of queries) {
|
for (const query of queries) {
|
||||||
console.log(items_copy.length);
|
console.log(items_copy.length);
|
||||||
console.log(query);
|
console.log(query);
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue