feat: wynnatlas mini
This commit is contained in:
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 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.mobile-only {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1400px) {
|
||||
|
@ -337,10 +333,13 @@ input.equipment-input {
|
|||
.spell-display b {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.mobile-only {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
/* WynnAtlas Mini */
|
||||
.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 */
|
||||
|
|
149
sq2bs.html
149
sq2bs.html
|
@ -22,11 +22,8 @@
|
|||
<!-- main -->
|
||||
<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/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/>
|
||||
<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 class="container py-5 vh-100 mx-0 mx-lg-auto">
|
||||
<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">
|
||||
<img class="img-fluid" src="media/icons/new/Gears.png">
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<div class="row row-cols-1 h-100 align-items-center">
|
||||
<div class="col text-nowrap scaled-font">
|
||||
<div class="col">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-3 text-nowrap scaled-font">
|
||||
Level:
|
||||
</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">
|
||||
<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 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>
|
||||
</div>
|
||||
</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 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 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 class="col-auto px-1 text-nowrap scaled-font">
|
||||
<button class="border-dark text-light dark-5 rounded scaled-font rounded" onclick="shareBuild()">Copy for sharing</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -775,6 +753,56 @@
|
|||
</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 class="id-box fade-in" id="id-edit" style="display: none">
|
||||
<div class="id-edit1">
|
||||
|
@ -1171,65 +1199,6 @@
|
|||
</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/@tarekraafat/autocomplete.js@10.2.6/dist/autoComplete.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/macy@2"></script>
|
||||
|
|
119
sq2bs.js
119
sq2bs.js
|
@ -10,7 +10,7 @@ document.addEventListener('DOMContentLoaded', function() {
|
|||
for (const eq of equipment_keys) {
|
||||
document.querySelector("#"+eq+"-choice").setAttribute("oninput", "update_field('"+ eq +"'); 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) {
|
||||
|
@ -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 = null;
|
||||
doItemSearch();
|
||||
window.dispatchEvent(new Event('resize'));
|
||||
}, 500);
|
||||
}
|
||||
|
||||
|
@ -122,6 +141,14 @@ function update_field(field) {
|
|||
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
|
||||
document.querySelector("#"+field+"-choice").classList.add(tier);
|
||||
|
||||
|
@ -141,11 +168,12 @@ function update_field(field) {
|
|||
|
||||
// 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'];
|
||||
|
||||
function show_tab(tab) {
|
||||
console.log(itemFilters)
|
||||
for (const i in tabs) {
|
||||
document.querySelector("#"+tabs[i]).style.display = "none";
|
||||
}
|
||||
|
@ -176,19 +204,9 @@ function toggle_tab(tab) {
|
|||
}
|
||||
}
|
||||
|
||||
function toggle_edit(id) {
|
||||
if (document.querySelector("#"+id).style.display == "none") {
|
||||
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(elmnt) {
|
||||
elem_list = document.querySelector(elmnt).children;
|
||||
|
||||
function collapse_element(eq) {
|
||||
elem_list = document.querySelector("#"+eq+"-tooltip").children
|
||||
for (elem of elem_list) {
|
||||
if (elem.classList.contains("no-collapse")) { continue; }
|
||||
if (elem.style.display == "none") {
|
||||
|
@ -200,7 +218,28 @@ function collapse_element(eq) {
|
|||
// macy quirk
|
||||
window.dispatchEvent(new Event('resize'));
|
||||
// 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
|
||||
|
@ -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) {
|
||||
continue;
|
||||
}
|
||||
displaysq2ExpandedItem(player_build.items[i], buildFields[i], false);
|
||||
collapse_element(equipment_keys[i]);
|
||||
displaysq2ExpandedItem(player_build.items[i], buildFields[i]);
|
||||
collapse_element("#"+equipment_keys[i]+"-tooltip");
|
||||
}
|
||||
|
||||
displaysq2ArmorStats(player_build);
|
||||
displaysq2BuildStats("all-stats", player_build, build_all_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();
|
||||
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() {
|
||||
if (player_build) {
|
||||
let savedBuilds = window.localStorage.getItem("builds") === null ? {} : JSON.parse(window.localStorage.getItem("builds"));
|
||||
let saveName = document.getElementById("build-name").value;
|
||||
let encodedBuild = encodeBuild();
|
||||
const savedBuilds = window.localStorage.getItem("builds") === null ? {} : JSON.parse(window.localStorage.getItem("builds"));
|
||||
const saveName = document.getElementById("build-name").value;
|
||||
const encodedBuild = encodeBuild();
|
||||
if ((!Object.keys(savedBuilds).includes(saveName)
|
||||
|| document.getElementById("saved-error").textContent !== "") && encodedBuild !== "") {
|
||||
savedBuilds[saveName] = encodedBuild.replace("#", "");
|
||||
window.localStorage.setItem("builds", JSON.stringify(savedBuilds));
|
||||
|
||||
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 {
|
||||
document.getElementById("saved-build").textContent = "";
|
||||
if (encodedBuild === "") {
|
||||
|
@ -868,6 +884,8 @@ function optimizeStrDex() {
|
|||
const base_skillpoints = player_build.base_skillpoints;
|
||||
const max_str_boost = 100 - base_skillpoints[0];
|
||||
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;
|
||||
let str_bonus = remaining;
|
||||
let dex_bonus = 0;
|
||||
|
@ -951,7 +969,7 @@ function optimizeStrDex() {
|
|||
|
||||
try {
|
||||
calculateBuildStats();
|
||||
// setTitle();
|
||||
setTitle();
|
||||
if (player_build.errored)
|
||||
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 create a new element.
|
||||
// !elemental is some janky hack for elemental damage.
|
||||
|
@ -259,19 +259,11 @@ function displaysq2ExpandedItem(item, parent_id, mini=false){
|
|||
if (item && item.has("type")) {
|
||||
img.src = "./media/items/" + (newIcons ? "new/":"old/") + "generic-" + item.get("type") + ".png";
|
||||
img.alt = item.get("type");
|
||||
if (mini) {
|
||||
img.style = " z=index: 1; position: relative;";
|
||||
} else {
|
||||
img.style = " z=index: 1; position: relative;";
|
||||
}
|
||||
img.style = " z=index: 1; position: relative;";
|
||||
let bckgrd = document.createElement("div");
|
||||
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.classList.add("scaled-bckgrd");
|
||||
}
|
||||
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");
|
||||
parent_div.appendChild(bckgrd);
|
||||
bckgrd.appendChild(img);
|
||||
}
|
||||
|
@ -1427,4 +1419,50 @@ function apply_sq2_elemental_format(p_elem, id, suffix) {
|
|||
let i_elem2 = document.createElement('span');
|
||||
i_elem2.textContent = " " + desc + suffix;
|
||||
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"),
|
||||
};
|
||||
|
||||
let itemFilters = document.getElementById("filter-items");
|
||||
let itemFilters = []
|
||||
for (let x in translate_mappings) {
|
||||
let el = document.createElement("option");
|
||||
el.value = x;
|
||||
itemFilters.appendChild(el);
|
||||
itemFilters.push(x);
|
||||
}
|
||||
for (let x in special_mappings) {
|
||||
let el = document.createElement("option");
|
||||
el.value = x;
|
||||
itemFilters.appendChild(el);
|
||||
itemFilters.push(x);
|
||||
}
|
||||
|
||||
let itemCategories = [ "armor", "accessory", "weapon" ];
|
||||
|
@ -123,13 +119,15 @@ function applyQuery(items, query) {
|
|||
}
|
||||
|
||||
function displayItems(items_copy) {
|
||||
let items_parent = document.getElementById("main");
|
||||
let items_parent = document.getElementById("search-results");
|
||||
for (let i in items_copy) {
|
||||
if (i > 200) {break;}
|
||||
let item = items_copy[i];
|
||||
let box = document.createElement("div");
|
||||
box.style.flex = "1";
|
||||
box.classList.add("box");
|
||||
box.classList.add("col-auto", "dark-7", "dark-shadow");
|
||||
box.style.position = "absolute";
|
||||
box.id = "item"+i;
|
||||
box.addEventListener("dblclick", function() {set_item(item);});
|
||||
items_parent.appendChild(box);
|
||||
displaysq2ExpandedItem(item, box.id);
|
||||
}
|
||||
|
@ -178,7 +176,7 @@ function doItemSearch() {
|
|||
}
|
||||
|
||||
let items_copy = items_expanded.slice();
|
||||
document.getElementById("main").textContent = "";
|
||||
document.getElementById("search-results").textContent = "";
|
||||
for (const query of queries) {
|
||||
console.log(items_copy.length);
|
||||
console.log(query);
|
||||
|
|
Loading…
Reference in a new issue