Style fixes

This commit is contained in:
hppeng 2022-08-03 00:54:40 -07:00
parent 9d7ce1ede8
commit 57c6426d50
2 changed files with 29 additions and 28 deletions

View file

@ -115,12 +115,12 @@
</div> </div>
<div class = "row"> <div class = "row">
<div class = "col-auto"> <div class = "col-auto">
<button class = "button rounded scaled-font fw-bold text-light dark-5" id = "search-button" onclick = "doItemSearch()"> <button class = "button rounded scaled-font fw-bold text-light dark-5" id = "search-button" onclick = "do_item_search()">
Search! Search!
</button> </button>
</div> </div>
<div class = "col-auto"> <div class = "col-auto">
<button class = "button rounded scaled-font fw-bold text-light dark-5" id = "reset-button" onclick = "resetItemSearch()"> <button class = "button rounded scaled-font fw-bold text-light dark-5" id = "reset-button" onclick = "reset_item_search()">
Reset Reset
</button> </button>
</div> </div>

View file

@ -139,19 +139,20 @@ function displayItems(items_copy) {
} }
} }
let searchDb; let search_db;
let expr_parser;
function doItemSearch() { function do_item_search() {
window.scrollTo(0, 0); window.scrollTo(0, 0);
let queries = []; let queries = [];
queries.push('f:name?="'+document.getElementById("item-name-choice").value.trim()+'"'); queries.push('f:name?="'+document.getElementById("item-name-choice").value.trim()+'"');
let categoryOrType = document.getElementById("item-category-choice").value; const cat_or_type = document.getElementById("item-category-choice").value;
if (item_types.includes(categoryOrType)) { if (item_types.includes(cat_or_type)) {
queries.push('f:type="'+categoryOrType+'"'); queries.push('f:type="'+cat_or_type+'"');
} }
else if (item_categories.includes(categoryOrType)) { else if (item_categories.includes(cat_or_type)) {
queries.push('f:cat="'+categoryOrType+'"'); queries.push('f:cat="'+cat_or_type+'"');
} }
let rarity = document.getElementById("item-rarity-choice").value; let rarity = document.getElementById("item-rarity-choice").value;
@ -187,27 +188,27 @@ function doItemSearch() {
} }
} }
let filterQuery = "true"; let filter_query = "true";
let sortQueries = []; let sort_queries = [];
console.log(queries); console.log(queries);
for (const query of queries) { for (const query of queries) {
if (query.startsWith("s:")) { if (query.startsWith("s:")) {
sortQueries.push(query.slice(2)); sort_queries.push(query.slice(2));
} }
else if (query.startsWith("f:")) { else if (query.startsWith("f:")) {
filterQuery = filterQuery + "&" + query.slice(2); filter_query = filter_query + "&" + query.slice(2);
} }
} }
document.getElementById("search-results").textContent = ""; document.getElementById("search-results").textContent = "";
let results = []; let results = [];
try { try {
const filterExpr = exprParser.parse(filterQuery); const filter_expr = expr_parser.parse(filter_query);
const sortExprs = sortQueries.map(q => exprParser.parse(q)); const sort_exprs = sort_queries.map(q => expr_parser.parse(q));
for (let i = 0; i < searchDb.length; ++i) { for (let i = 0; i < search_db.length; ++i) {
const item = searchDb[i][0]; const item = search_db[i][0];
const itemExp = searchDb[i][1]; const itemExp = search_db[i][1];
if (checkBool(filterExpr.resolve(item, itemExp))) { if (checkBool(filter_expr.resolve(item, itemExp))) {
results.push({ item, itemExp, sortKeys: sortExprs.map(e => e.resolve(item, itemExp)) }); results.push({ item, itemExp, sortKeys: sort_exprs.map(e => e.resolve(item, itemExp)) });
} }
} }
results.sort((a, b) => { results.sort((a, b) => {
@ -221,28 +222,28 @@ function doItemSearch() {
displayItems(results); displayItems(results);
} }
function resetItemSearch() { function reset_item_search() {
resetFields = ["item-name-choice", "item-category-choice", "item-rarity-choice", "item-level-choice", "filter1-choice", "filter2-choice", "filter3-choice", "filter4-choice"] const reset_fields = ["item-name-choice", "item-category-choice", "item-rarity-choice", "item-level-choice", "filter1-choice", "filter2-choice", "filter3-choice", "filter4-choice"]
for (const field of resetFields) { for (const field of reset_fields) {
document.getElementById(field).value = ""; document.getElementById(field).value = "";
} }
} }
function init_items() { function init_items() {
searchDb = items.filter( i => ! i.remapID ).map( i => [i, expandItem(i, [])] ); search_db = items.filter( i => ! i.remapID ).map( i => [i, expandItem(i, [])] );
exprParser = new ExprParser(itemQueryProps, itemQueryFuncs); expr_parser = new ExprParser(itemQueryProps, itemQueryFuncs);
//init dropdowns //init dropdowns
let filterInputs = new Map([["item-category", ["ALL", "armor", "helmet", "chestplate", "leggings", "boots", "accessory", "ring", "bracelet", "necklace", "weapon", "wand", "spear", "bow", "dagger", "relik"]], let filter_inputs = new Map([["item-category", ["ALL", "armor", "helmet", "chestplate", "leggings", "boots", "accessory", "ring", "bracelet", "necklace", "weapon", "wand", "spear", "bow", "dagger", "relik"]],
["item-rarity", ["ANY", "Normal", "Unique", "Set", "Rare", "Legendary", "Fabled", "Mythic", "Sane"]], ["item-rarity", ["ANY", "Normal", "Unique", "Set", "Rare", "Legendary", "Fabled", "Mythic", "Sane"]],
["filter1", item_filters], ["filter1", item_filters],
["filter2", item_filters], ["filter2", item_filters],
["filter3", item_filters], ["filter3", item_filters],
["filter4", item_filters]]); ["filter4", item_filters]]);
for (const [field, data] of filterInputs) { for (const [field, data] of filter_inputs) {
let field_choice = document.getElementById(field+"-choice"); let field_choice = document.getElementById(field+"-choice");
// show dropdown on click // show dropdown on click
field_choice.onclick = function() {field_choice.dispatchEvent(new Event('input', {bubbles:true}));}; field_choice.onclick = function() {field_choice.dispatchEvent(new Event('input', {bubbles:true}));};
filterInputs.set(field, new autoComplete({ filter_inputs.set(field, new autoComplete({
data: { data: {
src: data, src: data,
}, },