Update item searcher stuff
This commit is contained in:
parent
ff5bca8276
commit
a78ecb800e
11 changed files with 131 additions and 41 deletions
10
crafter.html
10
crafter.html
|
@ -26,13 +26,15 @@
|
|||
</img>
|
||||
<div class = "tooltiptext center">WynnCrafter</div>
|
||||
</a>
|
||||
<a href = "./items.html" class = "nomarginp iconlink tooltip">
|
||||
<img src = "/media/icons/atlas64.png" class = "left linkoptions headericon">
|
||||
</img>
|
||||
<div class = "tooltiptext center">WynnAtlas</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class = "headercenter">
|
||||
<div >
|
||||
<p class = "itemp" id = "header">Wynn build calculator</p>
|
||||
<p class="itemp" id="help">
|
||||
<a class = "link" href="https://forums.wynncraft.com/threads/wynnbuilder-release-thread-and-some-damage-calculation-updates.281438">Forum thread (instructions/help)</a>
|
||||
</p>
|
||||
<p class = "itemp" id = "header">WynnCrafter</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class = "headerright">
|
||||
|
|
|
@ -27,7 +27,7 @@ let ingFields = ["fDefPct", "wDefPct", "aDefPct", "tDefPct", "eDefPct", "hprPct"
|
|||
let player_craft;
|
||||
|
||||
function setTitle() {
|
||||
document.getElementById("header").textContent = "WynnBuilder version "+BUILD_VERSION+" (ingredient db version "+ING_DB_VERSION+")";
|
||||
document.getElementById("header").textContent = "WynnCrafter version "+BUILD_VERSION+" (ingredient db version "+ING_DB_VERSION+")";
|
||||
document.getElementById("header").classList.add("funnynumber");
|
||||
}
|
||||
setTitle();
|
||||
|
|
|
@ -29,6 +29,11 @@
|
|||
</img>
|
||||
<div class = "tooltiptext center">WynnCrafter</div>
|
||||
</a>
|
||||
<a href = "./items.html" class = "nomarginp iconlink tooltip">
|
||||
<img src = "/media/icons/atlas64.png" class = "left linkoptions headericon">
|
||||
</img>
|
||||
<div class = "tooltiptext center">WynnAtlas</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class = "headercenter">
|
||||
<div >
|
||||
|
|
7
items-narrow.css
Normal file
7
items-narrow.css
Normal file
|
@ -0,0 +1,7 @@
|
|||
.items {
|
||||
padding: 0%;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(1, 1fr);
|
||||
width: 100%;
|
||||
gap: 5px;
|
||||
}
|
8
items-wide.css
Normal file
8
items-wide.css
Normal file
|
@ -0,0 +1,8 @@
|
|||
.items {
|
||||
padding: 0%;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(5, 1fr);
|
||||
width: 100%;
|
||||
gap: 5px;
|
||||
grid-template-rows: masonry;
|
||||
}
|
43
items.html
43
items.html
|
@ -1,35 +1,58 @@
|
|||
<!DOCTYPE html>
|
||||
<html scroll-behavior="smooth">
|
||||
<head>
|
||||
<meta name="HandheldFriendly" content="true" />
|
||||
<meta name="MobileOptimized" content="320" />
|
||||
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, width=device-width, user-scalable=no" />
|
||||
<!-- nunito font, copying wynndata -->
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Nunito&display=swap" rel="stylesheet">
|
||||
|
||||
<link rel="stylesheet" href="styles.css">
|
||||
<link rel="stylesheet" media="screen and (min-width: 1100px)" href="items-wide.css"/>
|
||||
<link rel="stylesheet" media="screen and (max-width: 1099px)" href="items-narrow.css"/>
|
||||
<link rel="icon" href="favicon.png">
|
||||
<link rel="manifest" href="manifest.json">
|
||||
<title>Wynn Clientside</title>
|
||||
</head>
|
||||
<body class="all">
|
||||
<div class="header" id="header">
|
||||
WynnAtlas
|
||||
<div class="center">
|
||||
<header class = "header nomarginp">
|
||||
<div class = "headerleft">
|
||||
<a href = "./" class = "nomarginp iconlink tooltip">
|
||||
<img src = "/media/icons/builder.png" class = "left linkoptions headericon">
|
||||
</img>
|
||||
<div class = "tooltiptext center">WynnBuilder</div>
|
||||
</a>
|
||||
<a href = "./crafter.html" class = "nomarginp iconlink tooltip">
|
||||
<img src = "/media/icons/crafter.png" class = "left linkoptions headericon">
|
||||
</img>
|
||||
<div class = "tooltiptext center">WynnCrafter</div>
|
||||
</a>
|
||||
<a href = "./items.html" class = "nomarginp iconlink tooltip">
|
||||
<img src = "/media/icons/atlas64.png" class = "left linkoptions headericon">
|
||||
</img>
|
||||
<div class = "tooltiptext center">WynnAtlas</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="center" id="header2">
|
||||
Made by: hppeng and ferricles
|
||||
<div class = "headercenter">
|
||||
<div >
|
||||
<p class = "itemp" id = "header">WynnAtlas</p>
|
||||
</div>
|
||||
<div class="center" id="credits">
|
||||
<a href="credits.txt">Additional credits</a>
|
||||
</div>
|
||||
<div class = "headerright">
|
||||
|
||||
</div>
|
||||
</header>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<div class="center" id="main">
|
||||
<div class="box" id="test" style="width: 25vw; margin: auto">
|
||||
<div class="center" id="test-inner">item</div>
|
||||
</div>
|
||||
<div class="center items" id="main">
|
||||
</div>
|
||||
<script type="text/javascript" src="/utils.js"></script>
|
||||
<script type="text/javascript" src="/build_utils.js"></script>
|
||||
<script type="text/javascript" src="/damage_calc.js"></script>
|
||||
<script type="text/javascript" src="/display.js"></script>
|
||||
<script type="text/javascript" src="/query.js"></script>
|
||||
|
|
29
items.js
29
items.js
|
@ -1,11 +1,30 @@
|
|||
|
||||
function applyQuery(items, query) {
|
||||
return items.filter(query.filter, query).sort(query.compare);
|
||||
}
|
||||
|
||||
function displayItems(items_copy) {
|
||||
let items_parent = document.getElementById("main");
|
||||
for (let i in items_copy) {
|
||||
let item = items_copy[i];
|
||||
let box = document.createElement("div");
|
||||
box.classList.add("box");
|
||||
box.id = "item"+i;
|
||||
items_parent.appendChild(box);
|
||||
displayExpandedItem(expandItem(item, []), box.id);
|
||||
}
|
||||
}
|
||||
|
||||
function init() {
|
||||
let items_copy = items.slice();
|
||||
let query = new NameQuery("Bob's");
|
||||
items_copy = items_copy.filter(query.filter, query).sort(query.compare);
|
||||
let item = items_copy[0];
|
||||
console.log(item);
|
||||
displayExpandedItem(expandItem(item, []), "test");
|
||||
//let query = new NameQuery("Bob's");
|
||||
let query1 = new IdQuery("poison");
|
||||
items_copy = applyQuery(items_copy, query1);
|
||||
|
||||
let query2 = new TypeQuery("boots");
|
||||
items_copy = applyQuery(items_copy, query2);
|
||||
|
||||
displayItems(items_copy);
|
||||
}
|
||||
|
||||
load_init(init);
|
||||
|
|
2
load.js
2
load.js
|
@ -64,7 +64,7 @@ function clean_item(item) {
|
|||
async function load(init_func) {
|
||||
|
||||
let getUrl = window.location;
|
||||
let baseUrl = getUrl.protocol + "//" + getUrl.host + "/" + getUrl.pathname.split('/')[1];
|
||||
let baseUrl = getUrl.protocol + "//" + getUrl.host + "/";// + getUrl.pathname.split('/')[1];
|
||||
let url = baseUrl + "/compress.json";
|
||||
let result = await (await fetch(url)).json();
|
||||
items = result.items;
|
||||
|
|
BIN
media/icons/atlas64.png
Executable file
BIN
media/icons/atlas64.png
Executable file
Binary file not shown.
After Width: | Height: | Size: 358 B |
34
query.js
34
query.js
|
@ -1,8 +1,4 @@
|
|||
|
||||
/**
|
||||
* @description A query into the item
|
||||
* @module ItemNotFound
|
||||
*/
|
||||
class NameQuery {
|
||||
constructor(string) {
|
||||
this.queryString = string;
|
||||
|
@ -19,3 +15,33 @@ class NameQuery {
|
|||
return a < b;
|
||||
}
|
||||
}
|
||||
|
||||
class TypeQuery {
|
||||
constructor(type) {
|
||||
this.type = type;
|
||||
}
|
||||
|
||||
filter(item) {
|
||||
if (item.remapID === undefined) {
|
||||
return (item.type === this.type);
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
compare(a, b) {
|
||||
return a < b;
|
||||
}
|
||||
}
|
||||
|
||||
class IdQuery {
|
||||
constructor(id) {
|
||||
this.id = id;
|
||||
this.compare = function(a, b) {
|
||||
return b[id] - a[id];
|
||||
};
|
||||
}
|
||||
|
||||
filter(item) {
|
||||
return (this.id in item) && (item[this.id]);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -257086,7 +257086,7 @@
|
|||
"tier": "Fabled",
|
||||
"type": "spear",
|
||||
"name": "Rhythm of Seasons",
|
||||
"displayName": "Rhythm of Seasons",
|
||||
"displayName": "Rhythm of the Seasons",
|
||||
"set": null,
|
||||
"quest": null,
|
||||
"classReq": null,
|
||||
|
|
Loading…
Reference in a new issue