Merge pull request #143 from hppeng-wynn/display-cleanup

Display cleanup
This commit is contained in:
hppeng-wynn 2022-07-18 20:14:46 -07:00 committed by GitHub
commit 73423a66e7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 63 additions and 83 deletions

View file

@ -1048,9 +1048,6 @@ function builder_graph_init() {
// Phase 2/3: Set up editable IDs, skill points; use decodeBuild() skill points, calculate damage
let build_disp_node = new BuildDisplayNode()
build_disp_node.link_to(build_node, 'build');
// Create one node that will be the "aggregator node" (listen to all the editable id nodes, as well as the build_node (for non editable stats) and collect them into one statmap)
stat_agg_node = new AggregateStatsNode();
edit_agg_node = new AggregateEditableIDNode();
@ -1077,7 +1074,6 @@ function builder_graph_init() {
skp_inputs.push(node);
}
stat_agg_node.link_to(edit_agg_node);
build_disp_node.link_to(stat_agg_node, 'stats');
// Phase 3/3: Set up atree stuff.
@ -1127,10 +1123,14 @@ function builder_graph_init() {
// Also do something similar for skill points
let build_disp_node = new BuildDisplayNode()
build_disp_node.link_to(build_node, 'build');
build_disp_node.link_to(stat_agg_node, 'stats');
for (const node of edit_input_nodes) {
node.update();
}
let skp_output = new SkillPointSetterNode(edit_input_nodes);
skp_output.link_to(build_node);
@ -1146,5 +1146,6 @@ function builder_graph_init() {
// this will propagate the update to the `stat_agg_node`, and then to damage calc
console.log("Set up graph");
graph_live_update = true;
}

View file

@ -1,4 +1,5 @@
let all_nodes = [];
let node_debug_stack = [];
class ComputeNode {
/**
* Make a generic compute node.
@ -33,6 +34,7 @@ class ComputeNode {
if (this.dirty === 0) {
return;
}
node_debug_stack.push(this.name);
if (this.dirty == 2) {
let calc_inputs = new Map();
for (const input of this.inputs) {
@ -44,6 +46,7 @@ class ComputeNode {
for (const child of this.children) {
child.mark_input_clean(this.name, this.value);
}
node_debug_stack.pop();
return this;
}
@ -174,17 +177,20 @@ class ValueCheckComputeNode extends ComputeNode {
}
let graph_live_update = false;
/**
* Schedule a ComputeNode to be updated.
*
* @param node : ComputeNode to schedule an update for.
*/
function calcSchedule(node, timeout) {
if (!graph_live_update) return;
if (node.update_task !== null) {
clearTimeout(node.update_task);
}
node.mark_dirty();
node.update_task = setTimeout(function() {
node_debug_stack = [];
node.update();
node.update_task = null;
}, timeout);

View file

@ -124,7 +124,7 @@ function displayBuildStats(parent_id,build,command_group,stats){
let prefix_elem = make_elem('b', [], {textContent: "\u279C Effective LS: "});
let defStats = getDefenseStats(stats);
let number_elem = ('b', [style], {
let number_elem = make_elem('b', [style], {
textContent: Math.round(defStats[1][0]*id_val/defStats[0]) + "/3s"
});
value_elem.append(prefix_elem);
@ -181,8 +181,7 @@ function displayExpandedItem(item, parent_id){
elemental_format = !elemental_format;
}
else if (command === "!spacer") {
let spacer = document.createElement('div');
spacer.classList.add("row", "my-2");
let spacer = make_elem('div', ["row", "my-2"], {});
parent_div.appendChild(spacer);
continue;
}
@ -191,49 +190,41 @@ function displayExpandedItem(item, parent_id){
let id = command;
if(nonRolledIDs.includes(id)){//nonRolledID & non-0/non-null/non-und ID
if (!item.get(id)) {
if (! (item.get("crafted") && skp_order.includes(id) &&
if (!(item.get("crafted") && skp_order.includes(id) &&
(item.get("maxRolls").get(id) || item.get("minRolls").get(id)))) {
continue;
}
}
if (id === "slots") {
let p_elem = document.createElement("div");
p_elem.classList.add("col");
let p_elem = make_elem("div", ["col"]);
// PROPER POWDER DISPLAYING
let numerals = new Map([[1, "I"], [2, "II"], [3, "III"], [4, "IV"], [5, "V"], [6, "VI"]]);
let powderPrefix = document.createElement("b");
powderPrefix.textContent = "Powder Slots: " + item.get(id) + " [";
p_elem.appendChild(powderPrefix);
p_elem.appendChild(make_elem("b", [], {
textContent: "Powder Slots: " + item.get(id) + " ["
}));
let powders = item.get("powders");
for (let i = 0; i < powders.length; i++) {
let powder = document.createElement("b");
powder.textContent = numerals.get((powders[i]%6)+1)+" ";
powder.classList.add(damageClasses[Math.floor(powders[i]/6)+1]+"_powder");
p_elem.appendChild(powder);
p_elem.appendChild(make_elem("b", [damageClasses[Math.floor(powders[i]/6)+1]+"_powder"], {
textContent: numerals.get((powders[i]%6)+1)+" "
}));
}
let powderSuffix = document.createElement("b");
powderSuffix.textContent = "]";
p_elem.appendChild(powderSuffix);
p_elem.appendChild(make_elem("b", [], { textContent: "]" }));
parent_div.appendChild(p_elem);
} else if (id === "set") {
if (item.get("hideSet")) { continue; }
let p_elem = document.createElement("div");
p_elem.classList.add("col");
p_elem.textContent = "Set: " + item.get(id).toString();
parent_div.appendChild(p_elem);
parent_div.appendChild(make_elem("div", ["col"], { textContent: "Set: " + item.get(id).toString() }));
} else if (id === "majorIds") {
//console.log(item.get(id));
for (let majorID of item.get(id)) {
let p_elem = document.createElement("div");
p_elem.classList.add("col");
let p_elem = make_elem("div", ['col']);
let title_elem = document.createElement("b");
let b_elem = document.createElement("b");
let title_elem = make_elem("b");
let b_elem = make_elem("b");
if (majorID.includes(":")) {
let name = majorID.substring(0, majorID.indexOf(":")+1);
let mid = majorID.substring(majorID.indexOf(":")+1);
@ -254,20 +245,30 @@ function displayExpandedItem(item, parent_id){
parent_div.appendChild(p_elem);
}
} else if (id === "lvl" && item.get("tier") === "Crafted") {
let p_elem = document.createElement("div");
p_elem.classList.add("col");
p_elem.textContent = "Combat Level Min: " + item.get("lvlLow") + "-" + item.get(id);
parent_div.appendChild(p_elem);
parent_div.appendChild(make_elem("div", ["col"], {
textContent: "Combat Level Min: " + item.get("lvlLow") + "-" + item.get(id)
}));
} else if (id === "displayName") {
let row = document.createElement("div");
let row = make_elem("div", ["row", "justify-content-center"]);
let a_elem = document.createElement("a");
row.classList.add("row", "justify-content-center");
a_elem.classList.add("col-auto", "text-center", "item-title", "p-0");
a_elem.classList.add(item.has("tier") ? item.get("tier").replace(" ","") : "Normal");
// a_elem.style.textGrow = 1;
row.appendChild(a_elem);
let nolink_row = make_elem("div", ["row", "justify-content-center"]);
nolink_row.style.display = "none";
const tier_class = item.has("tier") ? item.get("tier").replace(" ","") : "Normal";
let item_link;
if (item.get("custom")) {
item_link = "../custom/#" + item.get("hash");
} else if (item.get("crafted")) {
a_item_link = "../crafter/#" + item.get("hash");
} else {
item_link = "../item/#" + item.get("displayName");
}
const item_name_elem = make_elem("a", ["col-auto", "text-center", "item-title", "p-0", tier_class], {
textContent: item.get('displayName')
});
nolink_row.appendChild(item_name_elem.cloneNode(true));
item_name_elem.href = item_link;
nolink_row.appendChild(item_name_elem);
/*
FUNCTIONALITY FOR THIS FEATURE HAS SINCE BEEN REMOVED (WITH SQ2).
@ -281,50 +282,23 @@ function displayExpandedItem(item, parent_id){
//plusminus.style.flexGrow = 0;
//plusminus.textContent = "\u2795";
//row.appendChild(plusminus);
if (item.get("custom")) {
a_elem.href = "../custom/#" + item.get("hash");
a_elem.textContent = item.get("displayName");
} else if (item.get("crafted")) {
a_elem.href = "../crafter/#" + item.get("hash");
a_elem.textContent = item.get(id);
} else {
a_elem.href = "../item/#" + item.get("displayName");
a_elem.textContent = item.get("displayName");
}
parent_div.appendChild(row);
let nolink_row = document.createElement("div");
let p_elem = document.createElement("p");
nolink_row.classList.add("row", "justify-content-center");
nolink_row.style.display = "none";
p_elem.classList.add("col-auto", "text-center", "item-title", "p-0");
p_elem.classList.add(item.has("tier") ? item.get("tier").replace(" ","") : "Normal");
if (item.get("custom")) {
p_elem.textContent = item.get("displayName");
} else if (item.get("crafted")) {
p_elem.textContent = item.get(id);
} else {
p_elem.textContent = item.get("displayName");
}
nolink_row.appendChild(p_elem);
parent_div.appendChild(nolink_row);
let img = document.createElement("img");
if (item && item.has("type")) {
img.src = "../media/items/" + (newIcons ? "new/":"old/") + "generic-" + item.get("type") + ".png";
img.alt = item.get("type");
img.style = " z=index: 1; position: relative;";
let container = document.createElement("div");
if (item.has("type")) {
let img = make_elem("img", [], {
src: "../media/items/" + (newIcons ? "new/":"old/") + "generic-" + item.get("type") + ".png",
alt: item.get("type"),
style: " z=index: 1; position: relative;"
});
let container = make_elem("div");
let bckgrd = document.createElement("div");
bckgrd.classList.add("col", "px-0", "d-flex", "align-items-center", "justify-content-center");// , "no-collapse");
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(container);
container.appendChild(bckgrd);
let bckgrd = make_elem("div", ["col", "px-0", "d-flex", "align-items-center", "justify-content-center", 'scaled-bckgrd'], { // , "no-collapse"
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.appendChild(img);
container.appendChild(bckgrd);
parent_div.appendChild(container);
}
} else {
if (id.endsWith('Dam_')) {
@ -351,8 +325,7 @@ function displayExpandedItem(item, parent_id){
p_elem.style = "font-style: italic";
} else if (skp_order.includes(id)) { //id = str, dex, int, def, or agi
if ( item.get("tier") !== "Crafted") {
row = document.createElement("div");
row.classList.add("col");
row = make_elem("div", ["col"]);
let title = document.createElement("b");
title.textContent = idPrefixes[id] + " ";