Copying code
from sq2display.js to display.js
This commit is contained in:
parent
e5b653619f
commit
fd97eb45e0
1 changed files with 297 additions and 294 deletions
591
js/display.js
591
js/display.js
|
@ -1,23 +1,10 @@
|
|||
/**
|
||||
* Apply armor powdering.
|
||||
* Applies twice for crafted items because wynn.
|
||||
* Also for jeweling for crafted items.
|
||||
*/
|
||||
function applyArmorPowders(expandedItem, powders) {
|
||||
applyArmorPowdersOnce(expandedItem, powders);
|
||||
// NOTE: armor powder only applies once!
|
||||
//if (expandedItem.get("crafted")) {
|
||||
// applyArmorPowdersOnce(expandedItem, powders);
|
||||
//}
|
||||
}
|
||||
|
||||
/**
|
||||
* Apply armor powders once only.
|
||||
* Apply armor powders.
|
||||
* Encoding shortcut assumes that all powders give +def to one element
|
||||
* and -def to the element "behind" it in cycle ETWFA, which is true
|
||||
* as of now and unlikely to change in the near future.
|
||||
*/
|
||||
function applyArmorPowdersOnce(expandedItem, powders) {
|
||||
function applyArmorPowders(expandedItem, powders) {
|
||||
for(const id of powders){
|
||||
let powder = powderStats[id];
|
||||
let name = powderNames.get(id).charAt(0);
|
||||
|
@ -33,12 +20,12 @@ function apply_elemental_format(p_elem, id, suffix) {
|
|||
let parts = idPrefixes[id].split(/ (.*)/);
|
||||
let element_prefix = parts[0];
|
||||
let desc = parts[1];
|
||||
let i_elem = document.createElement('b');
|
||||
let i_elem = document.createElement('span');
|
||||
i_elem.classList.add(element_prefix);
|
||||
i_elem.textContent = element_prefix;
|
||||
p_elem.appendChild(i_elem);
|
||||
|
||||
let i_elem2 = document.createElement('b');
|
||||
let i_elem2 = document.createElement('span');
|
||||
i_elem2.textContent = " " + desc + suffix;
|
||||
p_elem.appendChild(i_elem2);
|
||||
}
|
||||
|
@ -90,48 +77,20 @@ function displaySetBonuses(parent_id,build) {
|
|||
}
|
||||
|
||||
|
||||
function displayBuildStats(parent_id,build){
|
||||
function displayBuildStats(parent_id,build,command_group){
|
||||
// Commands to "script" the creation of nice formatting.
|
||||
// #commands create a new element.
|
||||
// !elemental is some janky hack for elemental damage.
|
||||
// normals just display a thing.
|
||||
|
||||
let display_commands = build_overall_display_commands;
|
||||
|
||||
// Clear the parent div.
|
||||
setHTML(parent_id, "");
|
||||
let display_commands = command_group;
|
||||
let parent_div = document.getElementById(parent_id);
|
||||
let title = document.createElement("p");
|
||||
title.classList.add("itemcenter");
|
||||
title.classList.add("itemp");
|
||||
title.classList.add("title");
|
||||
title.classList.add("Normal");
|
||||
title.textContent = "Overall Build Stats";
|
||||
parent_div.append(title);
|
||||
parent_div.append(document.createElement("br"));
|
||||
|
||||
if (build.activeSetCounts.size > 0) {
|
||||
let set_summary_elem = document.createElement('p');
|
||||
set_summary_elem.classList.add('itemp');
|
||||
set_summary_elem.classList.add('left');
|
||||
set_summary_elem.textContent = "Set Summary:";
|
||||
parent_div.append(set_summary_elem);
|
||||
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.classList.add('itemp');
|
||||
set_elem.classList.add('left');
|
||||
set_elem.textContent = " "+setName+" Set: "+count+"/"+sets[setName].items.length;
|
||||
set_summary_elem.append(set_elem);
|
||||
}
|
||||
// Clear the parent div.
|
||||
if (parent_div != null) {
|
||||
setHTML(parent_id, "");
|
||||
}
|
||||
|
||||
displayDefenseStats(parent_div, build, true);
|
||||
|
||||
let stats = build.statMap;
|
||||
//console.log(build.statMap);
|
||||
|
||||
let active_elem;
|
||||
let elemental_format = false;
|
||||
|
@ -140,37 +99,35 @@ function displayBuildStats(parent_id,build){
|
|||
let staticIDs = ["hp", "eDef", "tDef", "wDef", "fDef", "aDef"];
|
||||
|
||||
for (const command of display_commands) {
|
||||
// style instructions
|
||||
|
||||
if (command.charAt(0) === "#") {
|
||||
if (command === "#cdiv") {
|
||||
active_elem = document.createElement('div');
|
||||
active_elem.classList.add('itemcenter');
|
||||
if (command === "#defense-stats") {
|
||||
displayDefenseStats(parent_div, build, true);
|
||||
}
|
||||
else if (command === "#ldiv") {
|
||||
active_elem = document.createElement('div');
|
||||
active_elem.classList.add('itemleft');
|
||||
}
|
||||
else if (command === "#table") {
|
||||
active_elem = document.createElement('table');
|
||||
active_elem.classList.add('itemtable');
|
||||
}
|
||||
parent_div.appendChild(active_elem);
|
||||
}
|
||||
else if (command.charAt(0) === "!") {
|
||||
if (command.charAt(0) === "!") {
|
||||
// TODO: This is sooo incredibly janky.....
|
||||
if (command === "!elemental") {
|
||||
elemental_format = !elemental_format;
|
||||
}
|
||||
}
|
||||
|
||||
// id instruction
|
||||
else {
|
||||
let id = command;
|
||||
if (stats.get(id)) {
|
||||
let style = null;
|
||||
|
||||
// TODO: add pos and neg style
|
||||
if (!staticIDs.includes(id)) {
|
||||
style = "positive";
|
||||
if (stats.get(id) < 0) {
|
||||
style = "negative";
|
||||
}
|
||||
}
|
||||
|
||||
// ignore
|
||||
let id_val = stats.get(id);
|
||||
if (reversedIDs.includes(id)) {
|
||||
style === "positive" ? style = "negative" : style = "positive";
|
||||
|
@ -178,12 +135,14 @@ function displayBuildStats(parent_id,build){
|
|||
if (id === "poison" && id_val > 0) {
|
||||
id_val = Math.ceil(id_val*build.statMap.get("poisonPct")/100);
|
||||
}
|
||||
displayFixedID(active_elem, id, id_val, elemental_format, style);
|
||||
displayFixedID(parent_div, id, id_val, elemental_format, style);
|
||||
if (id === "poison" && id_val > 0) {
|
||||
let row = document.createElement('tr');
|
||||
let value_elem = document.createElement('td');
|
||||
value_elem.classList.add('right');
|
||||
value_elem.setAttribute("colspan", "2");
|
||||
let row = document.createElement('div');
|
||||
row.classList.add("row")
|
||||
let value_elem = document.createElement('div');
|
||||
value_elem.classList.add('col');
|
||||
value_elem.classList.add('text-end');
|
||||
|
||||
let prefix_elem = document.createElement('b');
|
||||
prefix_elem.textContent = "\u279C With Strength: ";
|
||||
let number_elem = document.createElement('b');
|
||||
|
@ -192,23 +151,30 @@ function displayBuildStats(parent_id,build){
|
|||
value_elem.append(prefix_elem);
|
||||
value_elem.append(number_elem);
|
||||
row.appendChild(value_elem);
|
||||
|
||||
active_elem.appendChild(row);
|
||||
} else if (id === "ls" && id_val != 0) {
|
||||
let row = document.createElement("tr");
|
||||
let title = document.createElement("td");
|
||||
title.classList.add("left");
|
||||
title.textContent = "Effective Life Steal:"
|
||||
let value = document.createElement("td");
|
||||
let defStats = build.getDefenseStats();
|
||||
value.textContent = Math.round(defStats[1][0]*id_val/defStats[0]) + "/3s";
|
||||
value.classList.add("right");
|
||||
value.classList.add(style);
|
||||
row.appendChild(title);
|
||||
row.appendChild(value);
|
||||
active_elem.appendChild(row);
|
||||
parent_div.appendChild(row);
|
||||
}
|
||||
} else if (skp_order.includes(id)) {
|
||||
else if (id === "ls" && id_val != 0) {
|
||||
let row = document.createElement('div');
|
||||
row.classList.add("row")
|
||||
let value_elem = document.createElement('div');
|
||||
value_elem.classList.add('col');
|
||||
value_elem.classList.add('text-end');
|
||||
|
||||
let prefix_elem = document.createElement('b');
|
||||
prefix_elem.textContent = "\u279C Effective LS: ";
|
||||
|
||||
let defStats = build.getDefenseStats();
|
||||
let number_elem = document.createElement('b');
|
||||
number_elem.classList.add(style);
|
||||
number_elem.textContent = Math.round(defStats[1][0]*id_val/defStats[0]) + "/3s";
|
||||
value_elem.append(prefix_elem);
|
||||
value_elem.append(number_elem);
|
||||
row.appendChild(value_elem);
|
||||
parent_div.appendChild(row);
|
||||
}
|
||||
}
|
||||
// sp thingy (WHY IS THIS HANDLED SEPARATELY TODO
|
||||
else if (skp_order.includes(id)) {
|
||||
let total_assigned = build.total_skillpoints[skp_order.indexOf(id)];
|
||||
let base_assigned = build.base_skillpoints[skp_order.indexOf(id)];
|
||||
let diff = total_assigned - base_assigned;
|
||||
|
@ -219,7 +185,7 @@ function displayBuildStats(parent_id,build){
|
|||
style = "negative";
|
||||
}
|
||||
if (diff != 0) {
|
||||
displayFixedID(active_elem, id, diff, false, style);
|
||||
displayFixedID(parent_div, id, diff, false, style);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -276,38 +242,28 @@ function displayExpandedItem(item, parent_id){
|
|||
} else if (item.get("category") === "armor") {
|
||||
}
|
||||
|
||||
let display_commands = item_display_commands;
|
||||
let display_commands = sq2_item_display_commands;
|
||||
|
||||
// Clear the parent div.
|
||||
setHTML(parent_id, "");
|
||||
let parent_div = document.getElementById(parent_id);
|
||||
parent_div.classList.add("border", "border-2", "border-dark");
|
||||
|
||||
let active_elem;
|
||||
let fix_id = item.has("fixID") && item.get("fixID");
|
||||
let elemental_format = false;
|
||||
for (let i = 0; i < display_commands.length; i++) {
|
||||
const command = display_commands[i];
|
||||
if (command.charAt(0) === "#") {
|
||||
if (command === "#cdiv") {
|
||||
active_elem = document.createElement('div');
|
||||
active_elem.classList.add('itemcenter');
|
||||
}
|
||||
else if (command === "#ldiv") {
|
||||
active_elem = document.createElement('div');
|
||||
active_elem.classList.add('itemleft');
|
||||
}
|
||||
else if (command === "#table") {
|
||||
active_elem = document.createElement('table');
|
||||
active_elem.classList.add('itemtable');
|
||||
}
|
||||
active_elem.style.maxWidth = "100%";
|
||||
parent_div.appendChild(active_elem);
|
||||
}
|
||||
else if (command.charAt(0) === "!") {
|
||||
if (command.charAt(0) === "!") {
|
||||
// TODO: This is sooo incredibly janky.....
|
||||
if (command === "!elemental") {
|
||||
elemental_format = !elemental_format;
|
||||
}
|
||||
}
|
||||
else if (command === "!spacer") {
|
||||
let spacer = document.createElement('div');
|
||||
spacer.classList.add("row", "my-2");
|
||||
parent_div.appendChild(spacer);
|
||||
continue;
|
||||
}
|
||||
}
|
||||
else {
|
||||
let id = command;
|
||||
|
@ -319,12 +275,13 @@ function displayExpandedItem(item, parent_id){
|
|||
}
|
||||
}
|
||||
if (id === "slots") {
|
||||
let p_elem = document.createElement("p");
|
||||
let p_elem = document.createElement("div");
|
||||
p_elem.classList.add("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.classList.add("powderLeft"); powderPrefix.classList.add("left");
|
||||
powderPrefix.textContent = "Powder Slots: " + item.get(id) + " [";
|
||||
p_elem.appendChild(powderPrefix);
|
||||
|
||||
|
@ -337,21 +294,21 @@ function displayExpandedItem(item, parent_id){
|
|||
}
|
||||
|
||||
let powderSuffix = document.createElement("b");
|
||||
powderSuffix.classList.add("powderRight"); powderSuffix.classList.add("left");
|
||||
powderSuffix.textContent = "]";
|
||||
p_elem.appendChild(powderSuffix);
|
||||
active_elem.appendChild(p_elem);
|
||||
parent_div.appendChild(p_elem);
|
||||
} else if (id === "set") {
|
||||
if (item.get("hideSet")) { continue; }
|
||||
|
||||
let p_elem = document.createElement("p");
|
||||
p_elem.classList.add("itemp");
|
||||
let p_elem = document.createElement("div");
|
||||
p_elem.classList.add("col");
|
||||
p_elem.textContent = "Set: " + item.get(id).toString();
|
||||
active_elem.appendChild(p_elem);
|
||||
parent_div.appendChild(p_elem);
|
||||
} else if (id === "majorIds") {
|
||||
//console.log(item.get(id));
|
||||
for (let majorID of item.get(id)) {
|
||||
let p_elem = document.createElement("p");
|
||||
p_elem.classList.add("itemp");
|
||||
let p_elem = document.createElement("div");
|
||||
p_elem.classList.add("col");
|
||||
|
||||
let title_elem = document.createElement("b");
|
||||
let b_elem = document.createElement("b");
|
||||
|
@ -372,60 +329,94 @@ function displayExpandedItem(item, parent_id){
|
|||
b_elem.textContent = name;
|
||||
p_elem.appendChild(b_elem);
|
||||
}
|
||||
active_elem.appendChild(p_elem);
|
||||
parent_div.appendChild(p_elem);
|
||||
}
|
||||
} else if (id === "lvl" && item.get("tier") === "Crafted") {
|
||||
let p_elem = document.createElement("p");
|
||||
p_elem.classList.add("itemp");
|
||||
let p_elem = document.createElement("div");
|
||||
p_elem.classList.add("col");
|
||||
p_elem.textContent = "Combat Level Min: " + item.get("lvlLow") + "-" + item.get(id);
|
||||
active_elem.appendChild(p_elem);
|
||||
parent_div.appendChild(p_elem);
|
||||
} else if (id === "displayName") {
|
||||
let p_elem = document.createElement("a");
|
||||
p_elem.classList.add('itemp');
|
||||
p_elem.classList.add("smalltitle");
|
||||
p_elem.classList.add(item.has("tier") ? item.get("tier").replace(" ","") : "none");
|
||||
let row = document.createElement("div");
|
||||
|
||||
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);
|
||||
|
||||
/*
|
||||
FUNCTIONALITY FOR THIS FEATURE HAS SINCE BEEN REMOVED (WITH SQ2).
|
||||
IF WE WANT TO USE IT IN THE FUTURE, I'VE LEFT THE CODE TO ADD IT IN HERE
|
||||
*/
|
||||
|
||||
//allow the plus minus element to toggle upon click: ➕➖
|
||||
let plusminus = document.createElement("div");
|
||||
plusminus.id = parent_div.id.split("-")[0] + "-pm";
|
||||
plusminus.classList.add("col", "plus_minus", "text_end");
|
||||
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.href = url_base.replace(/\w+.html/, "") + "customizer.html#" + item.get("hash");
|
||||
p_elem.textContent = item.get("displayName");
|
||||
} else if (item.get("crafted")) {
|
||||
p_elem.href = url_base.replace(/\w+.html/, "") + "crafter.html#" + item.get("hash");
|
||||
p_elem.textContent = item.get(id);
|
||||
} else {
|
||||
p_elem.href = url_base.replace(/\w+.html/, "") + "item.html#" + item.get("displayName");
|
||||
p_elem.textContent = item.get("displayName");
|
||||
}
|
||||
|
||||
nolink_row.appendChild(p_elem);
|
||||
parent_div.appendChild(nolink_row);
|
||||
|
||||
p_elem.target = "_blank";
|
||||
active_elem.appendChild(p_elem);
|
||||
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;max-width: 64px; max-height: 64px; position: relative; top: 50%; transform: translateY(-50%);";
|
||||
let bckgrd = document.createElement("p");
|
||||
bckgrd.style = "width: 96px; height: 96px; border-radius: 50%;background-image: radial-gradient(closest-side, " + colorMap.get(item.get("tier")) + " 20%," + "#121516 80%); margin-left: auto; margin-right: auto;"
|
||||
bckgrd.classList.add("center");
|
||||
bckgrd.classList.add("itemp");
|
||||
active_elem.appendChild(bckgrd);
|
||||
img.style = " z=index: 1; position: relative;";
|
||||
let container = 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.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);
|
||||
bckgrd.appendChild(img);
|
||||
}
|
||||
} else {
|
||||
let p_elem;
|
||||
if ( !(item.get("tier") === "Crafted" && item.get("category") === "armor" && id === "hp") && (!skp_order.includes(id)) || (skp_order.includes(id) && item.get("tier") !== "Crafted" && active_elem.nodeName === "DIV") ) { //skp warp
|
||||
p_elem = displayFixedID(active_elem, id, item.get(id), elemental_format);
|
||||
if ( !(item.get("tier") === "Crafted" && item.get("category") === "armor" && id === "hp") && (!skp_order.includes(id)) || (skp_order.includes(id) && item.get("tier") !== "Crafted" && parent_div.nodeName === "table") ) { //skp warp
|
||||
p_elem = displayFixedID(parent_div, id, item.get(id), elemental_format);
|
||||
} else if (item.get("tier") === "Crafted" && item.get("category") === "armor" && id === "hp") {
|
||||
p_elem = displayFixedID(active_elem, id, item.get(id+"Low")+"-"+item.get(id), elemental_format);
|
||||
p_elem = displayFixedID(parent_div, id, item.get(id+"Low")+"-"+item.get(id), elemental_format);
|
||||
}
|
||||
if (id === "lore") {
|
||||
p_elem.style = "font-style: italic";
|
||||
p_elem.classList.add("lore");
|
||||
} else if (skp_order.includes(id)) { //id = str, dex, int, def, or agi
|
||||
if ( item.get("tier") !== "Crafted" && active_elem.nodeName === "DIV") {
|
||||
p_elem.textContent = "";
|
||||
p_elem.classList.add("itemp");
|
||||
row = document.createElement("p");
|
||||
row.classList.add("left");
|
||||
if ( item.get("tier") !== "Crafted") {
|
||||
row = document.createElement("div");
|
||||
row.classList.add("col");
|
||||
|
||||
let title = document.createElement("b");
|
||||
title.textContent = idPrefixes[id] + " ";
|
||||
|
@ -438,10 +429,10 @@ function displayExpandedItem(item, parent_id){
|
|||
boost.textContent = item.get(id);
|
||||
row.appendChild(title);
|
||||
row.appendChild(boost);
|
||||
p_elem.appendChild(row);
|
||||
} else if ( item.get("tier") === "Crafted" && active_elem.nodeName === "TABLE") {
|
||||
parent_div.appendChild(row);
|
||||
} else if ( item.get("tier") === "Crafted") {
|
||||
let row = displayRolledID(item, id, elemental_format);
|
||||
active_elem.appendChild(row);
|
||||
parent_div.appendChild(row);
|
||||
}
|
||||
} else if (id === "restrict") {
|
||||
p_elem.classList.add("restrict");
|
||||
|
@ -459,11 +450,17 @@ function displayExpandedItem(item, parent_id){
|
|||
style === "positive" ? style = "negative" : style = "positive";
|
||||
}
|
||||
if (fix_id) {
|
||||
displayFixedID(active_elem, id, item.get("minRolls").get(id), elemental_format, style);
|
||||
p_elem = document.createElement("div");
|
||||
p_elem.classList.add("col", "text-nowrap");
|
||||
if (id == "dex") {
|
||||
console.log("dex activated at fix_id")
|
||||
}
|
||||
displayFixedID(p_elem, id, item.get("minRolls").get(id), elemental_format, style);
|
||||
parent_div.appendChild(p_elem);
|
||||
}
|
||||
else {
|
||||
let row = displayRolledID(item, id, elemental_format);
|
||||
active_elem.appendChild(row);
|
||||
parent_div.appendChild(row);
|
||||
}
|
||||
}else{
|
||||
// :/
|
||||
|
@ -473,8 +470,8 @@ function displayExpandedItem(item, parent_id){
|
|||
//Show powder specials ;-;
|
||||
let nonConsumables = ["relik", "wand", "bow", "spear", "dagger", "chestplate", "helmet", "leggings", "boots", "ring", "bracelet", "necklace"];
|
||||
if(nonConsumables.includes(item.get("type"))) {
|
||||
let powder_special = document.createElement("p");
|
||||
powder_special.classList.add("left");
|
||||
let powder_special = document.createElement("div");
|
||||
powder_special.classList.add("col");
|
||||
let powders = item.get("powders");
|
||||
let element = "";
|
||||
let power = 0;
|
||||
|
@ -495,10 +492,9 @@ function displayExpandedItem(item, parent_id){
|
|||
if (element !== "") {//powder special is "[e,t,w,f,a]+[0,1,2,3,4]"
|
||||
let powderSpecial = powderSpecialStats[ skp_elements.indexOf(element)];
|
||||
let specialSuffixes = new Map([ ["Duration", " sec"], ["Radius", " blocks"], ["Chains", ""], ["Damage", "%"], ["Damage Boost", "%"], ["Knockback", " blocks"] ]);
|
||||
let specialTitle = document.createElement("p");
|
||||
let specialEffects = document.createElement("p");
|
||||
addClasses(specialTitle, ["left", "itemp", damageClasses[skp_elements.indexOf(element) + 1]]);
|
||||
addClasses(specialEffects, ["left", "itemp", "nocolor"]);
|
||||
let specialTitle = document.createElement("span");
|
||||
let specialEffects = document.createElement("span");
|
||||
addClasses(specialTitle, [damageClasses[skp_elements.indexOf(element) + 1]]);
|
||||
let effects;
|
||||
if (item.get("category") === "weapon") {//weapon
|
||||
effects = powderSpecial["weaponSpecialEffects"];
|
||||
|
@ -510,7 +506,7 @@ function displayExpandedItem(item, parent_id){
|
|||
for (const [key,value] of effects.entries()) {
|
||||
if (key !== "Description") {
|
||||
let effect = document.createElement("p");
|
||||
effect.classList.add("itemp");
|
||||
effect.classList.add("m-0");
|
||||
effect.textContent = key + ": " + value[power] + specialSuffixes.get(key);
|
||||
if(key === "Damage"){
|
||||
effect.textContent += elementIcons[skp_elements.indexOf(element)];
|
||||
|
@ -530,8 +526,8 @@ function displayExpandedItem(item, parent_id){
|
|||
}
|
||||
|
||||
if(item.get("tier") && item.get("tier") === "Crafted") {
|
||||
let dura_elem = document.createElement("p");
|
||||
dura_elem.classList.add("itemp");
|
||||
let dura_elem = document.createElement("div");
|
||||
dura_elem.classList.add("col");
|
||||
let dura = [];
|
||||
let suffix = "";
|
||||
if(nonConsumables.includes(item.get("type"))) {
|
||||
|
@ -543,8 +539,7 @@ function displayExpandedItem(item, parent_id){
|
|||
suffix = " sec."
|
||||
let charges = document.createElement("b");
|
||||
charges.textContent = "Charges: " + item.get("charges");
|
||||
charges.classList.add("spaceleft");
|
||||
active_elem.appendChild(charges);
|
||||
parent_div.appendChild(charges);
|
||||
}
|
||||
|
||||
if (typeof(dura) === "string") {
|
||||
|
@ -552,16 +547,21 @@ function displayExpandedItem(item, parent_id){
|
|||
} else {
|
||||
dura_elem.textContent += dura[0]+"-"+dura[1] + suffix;
|
||||
}
|
||||
active_elem.append(dura_elem);
|
||||
parent_div.append(dura_elem);
|
||||
|
||||
}
|
||||
//Show item tier
|
||||
if (item.get("tier") && item.get("tier") !== " ") {
|
||||
let item_desc_elem = document.createElement("p");
|
||||
item_desc_elem.classList.add('itemp');
|
||||
let item_desc_elem = document.createElement("div");
|
||||
item_desc_elem.classList.add("col");
|
||||
item_desc_elem.classList.add(item.get("tier"));
|
||||
item_desc_elem.textContent = item.get("tier")+" "+item.get("type");
|
||||
active_elem.append(item_desc_elem);
|
||||
if (tome_types.includes(item.get("type"))) {
|
||||
tome_type_map = new Map([["weaponTome", "Weapon Tome"],["armorTome", "Armor Tome"],["guildTome", "Guild Tome"]]);
|
||||
item_desc_elem.textContent = item.get("tier")+" "+tome_type_map.get(item.get("type"));
|
||||
} else {
|
||||
item_desc_elem.textContent = item.get("tier")+" "+item.get("type");
|
||||
}
|
||||
parent_div.append(item_desc_elem);
|
||||
}
|
||||
|
||||
//Show item hash if applicable
|
||||
|
@ -572,7 +572,7 @@ function displayExpandedItem(item, parent_id){
|
|||
item_desc_elem.style.wordWrap = "break-word";
|
||||
item_desc_elem.style.wordBreak = "break-word";
|
||||
item_desc_elem.textContent = item.get("hash");
|
||||
active_elem.append(item_desc_elem);
|
||||
parent_div.append(item_desc_elem);
|
||||
}
|
||||
|
||||
if (item.get("category") === "weapon") {
|
||||
|
@ -1021,9 +1021,12 @@ function displayRolledID(item, id, elemental_format) {
|
|||
|
||||
function displayFixedID(active, id, value, elemental_format, style) {
|
||||
if (style) {
|
||||
let row = document.createElement('tr');
|
||||
let desc_elem = document.createElement('td');
|
||||
desc_elem.classList.add('left');
|
||||
let row = document.createElement('div');
|
||||
row.classList.add("row");
|
||||
let desc_elem = document.createElement('div');
|
||||
desc_elem.classList.add('col');
|
||||
desc_elem.classList.add('text-start');
|
||||
|
||||
if (elemental_format) {
|
||||
apply_elemental_format(desc_elem, id);
|
||||
}
|
||||
|
@ -1032,8 +1035,9 @@ function displayFixedID(active, id, value, elemental_format, style) {
|
|||
}
|
||||
row.appendChild(desc_elem);
|
||||
|
||||
let value_elem = document.createElement('td');
|
||||
value_elem.classList.add('right');
|
||||
let value_elem = document.createElement('div');
|
||||
value_elem.classList.add('col');
|
||||
value_elem.classList.add('text-end');
|
||||
value_elem.classList.add(style);
|
||||
value_elem.textContent = value + idSuffixes[id];
|
||||
row.appendChild(value_elem);
|
||||
|
@ -1045,8 +1049,8 @@ function displayFixedID(active, id, value, elemental_format, style) {
|
|||
if (value === "0-0" || value === "0-0\u279c0-0") {
|
||||
return;
|
||||
}
|
||||
let p_elem = document.createElement('p');
|
||||
p_elem.classList.add('itemp');
|
||||
let p_elem = document.createElement('div');
|
||||
p_elem.classList.add('col');
|
||||
if (elemental_format) {
|
||||
apply_elemental_format(p_elem, id, value);
|
||||
}
|
||||
|
@ -1057,6 +1061,28 @@ function displayFixedID(active, id, value, elemental_format, style) {
|
|||
return p_elem;
|
||||
}
|
||||
}
|
||||
|
||||
function displayPoisonDamage(overallparent_elem, build) {
|
||||
overallparent_elem.textContent = "";
|
||||
|
||||
//Title
|
||||
let title_elemavg = document.createElement("b");
|
||||
title_elemavg.textContent = "Poison Stats";
|
||||
overallparent_elem.append(title_elemavg);
|
||||
|
||||
let overallpoisonDamage = document.createElement("p");
|
||||
let overallpoisonDamageFirst = document.createElement("span");
|
||||
let overallpoisonDamageSecond = document.createElement("span");
|
||||
let poison_tick = Math.ceil(build.statMap.get("poison") * (1+skillPointsToPercentage(build.total_skillpoints[0])) * (build.statMap.get("poisonPct"))/100 /3);
|
||||
overallpoisonDamageFirst.textContent = "Poison Tick: ";
|
||||
overallpoisonDamageSecond.textContent = Math.max(poison_tick,0);
|
||||
overallpoisonDamageSecond.classList.add("Damage");
|
||||
|
||||
overallpoisonDamage.appendChild(overallpoisonDamageFirst);
|
||||
overallpoisonDamage.appendChild(overallpoisonDamageSecond);
|
||||
overallparent_elem.append(overallpoisonDamage);
|
||||
}
|
||||
|
||||
function displayEquipOrder(parent_elem,buildOrder){
|
||||
parent_elem.textContent = "";
|
||||
const order = buildOrder.slice();
|
||||
|
@ -1076,29 +1102,6 @@ function displayEquipOrder(parent_elem,buildOrder){
|
|||
}
|
||||
}
|
||||
|
||||
function displayPoisonDamage(overallparent_elem, build) {
|
||||
overallparent_elem.textContent = "";
|
||||
|
||||
//Title
|
||||
let title_elemavg = document.createElement("p");
|
||||
title_elemavg.classList.add("smalltitle");
|
||||
title_elemavg.classList.add("Normal");
|
||||
title_elemavg.textContent = "Poison Stats";
|
||||
overallparent_elem.append(title_elemavg);
|
||||
|
||||
let overallpoisonDamage = document.createElement("p");
|
||||
overallpoisonDamage.classList.add("lessbottom");
|
||||
let overallpoisonDamageFirst = document.createElement("b");
|
||||
let overallpoisonDamageSecond = document.createElement("b");
|
||||
let poison_tick = Math.ceil(build.statMap.get("poison") * (1+skillPointsToPercentage(build.total_skillpoints[0])) * (build.statMap.get("poisonPct") + build.externalStats.get("poisonPct"))/100 /3);
|
||||
overallpoisonDamageFirst.textContent = "Poison Tick: ";
|
||||
overallpoisonDamageSecond.textContent = Math.max(poison_tick,0);
|
||||
overallpoisonDamageSecond.classList.add("Damage");
|
||||
|
||||
overallpoisonDamage.appendChild(overallpoisonDamageFirst);
|
||||
overallpoisonDamage.appendChild(overallpoisonDamageSecond);
|
||||
overallparent_elem.append(overallpoisonDamage);
|
||||
}
|
||||
|
||||
function displayMeleeDamage(parent_elem, overallparent_elem, meleeStats){
|
||||
console.log("Melee Stats");
|
||||
|
@ -1314,40 +1317,8 @@ function displayDefenseStats(parent_elem, build, insertSummary){
|
|||
}
|
||||
const stats = defenseStats.slice();
|
||||
|
||||
if (!insertSummary) {
|
||||
let title_elem = document.createElement("p");
|
||||
title_elem.textContent = "Defense Stats";
|
||||
title_elem.classList.add("title");
|
||||
title_elem.classList.add("Normal");
|
||||
title_elem.classList.add("itemp");
|
||||
parent_elem.append(title_elem);
|
||||
|
||||
let base_stat_elem = document.createElement("p");
|
||||
base_stat_elem.id = "base-stat";
|
||||
parent_elem.append(base_stat_elem);
|
||||
|
||||
let mock_item = new Map();
|
||||
|
||||
mock_item.set("fixID", true);
|
||||
let mock_minRolls = new Map();
|
||||
mock_item.set("minRolls", mock_minRolls);
|
||||
const stats = ["hp", "hpBonus", "hprRaw", "hprPct", "fDef", "wDef", "aDef", "tDef", "eDef",
|
||||
"fDefPct", "wDefPct", "aDefPct", "tDefPct", "eDefPct"];
|
||||
for (const stat of stats) {
|
||||
if (rolledIDs.includes(stat)) {
|
||||
mock_minRolls.set(stat, build.statMap.get(stat));
|
||||
}
|
||||
else {
|
||||
mock_item.set(stat, build.statMap.get(stat));
|
||||
}
|
||||
}
|
||||
mock_item.set("powders", []);
|
||||
displayExpandedItem(mock_item, base_stat_elem.id);
|
||||
}
|
||||
|
||||
parent_elem.append(document.createElement("br"));
|
||||
let statsTable = document.createElement("table");
|
||||
statsTable.classList.add("itemtable");
|
||||
// parent_elem.append(document.createElement("br"));
|
||||
let statsTable = document.createElement("div");
|
||||
|
||||
//[total hp, ehp, total hpr, ehpr, [def%, agi%], [edef,tdef,wdef,fdef,adef]]
|
||||
for(const i in stats){
|
||||
|
@ -1361,18 +1332,26 @@ function displayDefenseStats(parent_elem, build, insertSummary){
|
|||
}
|
||||
|
||||
//total HP
|
||||
let hpRow = document.createElement("tr");
|
||||
let hp = document.createElement("td");
|
||||
let hpRow = document.createElement("div");
|
||||
hpRow.classList.add('row');
|
||||
let hp = document.createElement("div");
|
||||
hp.classList.add('col');
|
||||
hp.classList.add("Health");
|
||||
hp.classList.add("left");
|
||||
hp.classList.add("text-start");
|
||||
hp.textContent = "Total HP:";
|
||||
let boost = document.createElement("td");
|
||||
let boost = document.createElement("div");
|
||||
boost.classList.add('col');
|
||||
boost.textContent = stats[0];
|
||||
boost.classList.add("right");
|
||||
boost.classList.add("text-end");
|
||||
|
||||
hpRow.appendChild(hp);
|
||||
hpRow.append(boost);
|
||||
statsTable.appendChild(hpRow);
|
||||
|
||||
if (insertSummary) {
|
||||
parent_elem.appendChild(hpRow);
|
||||
} else {
|
||||
statsTable.appendChild(hpRow);
|
||||
}
|
||||
|
||||
let tooltip; let tooltiptext;
|
||||
|
||||
|
@ -1380,100 +1359,113 @@ function displayDefenseStats(parent_elem, build, insertSummary){
|
|||
if (!defMult) {defMult = 1}
|
||||
|
||||
//EHP
|
||||
let ehpRow = document.createElement("tr");
|
||||
let ehp = document.createElement("td");
|
||||
ehp.classList.add("left");
|
||||
let ehpRow = document.createElement("div");
|
||||
ehpRow.classList.add("row");
|
||||
let ehp = document.createElement("div");
|
||||
ehp.classList.add("col");
|
||||
ehp.classList.add("text-start");
|
||||
ehp.textContent = "Effective HP:";
|
||||
|
||||
boost = document.createElement("td");
|
||||
boost = document.createElement("div");
|
||||
boost.textContent = stats[1][0];
|
||||
boost.classList.add("right");
|
||||
boost.classList.add("col");
|
||||
boost.classList.add("text-end");
|
||||
tooltiptext = `= ${stats[0]} / ((1 - ${skillPointsToPercentage(build.total_skillpoints[3]).toFixed(3)}) * (1 - ${skillPointsToPercentage(build.total_skillpoints[4]).toFixed(3)}) * (2 - ${defMult}) * (2 - ${build.defenseMultiplier}))`
|
||||
tooltip = createTooltip(tooltip, "p", tooltiptext, boost, ["def-tooltip"]);
|
||||
// tooltip = createTooltip(tooltip, "p", tooltiptext, boost, ["def-tooltip"]);
|
||||
|
||||
ehpRow.appendChild(ehp);
|
||||
ehpRow.append(boost);
|
||||
statsTable.append(ehpRow);
|
||||
|
||||
ehpRow = document.createElement("tr");
|
||||
ehp = document.createElement("td");
|
||||
ehp.classList.add("left");
|
||||
if (insertSummary) {
|
||||
parent_elem.appendChild(ehpRow)
|
||||
} else {
|
||||
statsTable.append(ehpRow);
|
||||
}
|
||||
|
||||
ehpRow = document.createElement("div");
|
||||
ehpRow.classList.add("row");
|
||||
ehp = document.createElement("div");
|
||||
ehp.classList.add("col");
|
||||
ehp.classList.add("text-start");
|
||||
ehp.textContent = "Effective HP (no agi):";
|
||||
|
||||
boost = document.createElement("td");
|
||||
boost = document.createElement("div");
|
||||
boost.textContent = stats[1][1];
|
||||
boost.classList.add("right");
|
||||
boost.classList.add("col");
|
||||
boost.classList.add("text-end");
|
||||
tooltiptext = `= ${stats[0]} / ((1 - ${skillPointsToPercentage(build.total_skillpoints[3]).toFixed(3)}) * (2 - ${defMult}) * (2 - ${build.defenseMultiplier}))`
|
||||
tooltip = createTooltip(tooltip, "p", tooltiptext, boost, ["def-tooltip"]);
|
||||
// tooltip = createTooltip(tooltip, "p", tooltiptext, boost, ["def-tooltip"]);
|
||||
|
||||
ehpRow.appendChild(ehp);
|
||||
ehpRow.append(boost);
|
||||
statsTable.append(ehpRow);
|
||||
|
||||
//total HPR
|
||||
let hprRow = document.createElement("tr");
|
||||
let hpr = document.createElement("td");
|
||||
let hprRow = document.createElement("div");
|
||||
hprRow.classList.add("row")
|
||||
let hpr = document.createElement("div");
|
||||
hpr.classList.add("Health");
|
||||
hpr.classList.add("left");
|
||||
hpr.classList.add("col");
|
||||
hpr.classList.add("text-start");
|
||||
hpr.textContent = "HP Regen (Total):";
|
||||
boost = document.createElement("td");
|
||||
boost = document.createElement("div");
|
||||
boost.textContent = stats[2];
|
||||
boost.classList.add("right");
|
||||
boost.classList.add("col");
|
||||
boost.classList.add("text-end");
|
||||
|
||||
hprRow.appendChild(hpr);
|
||||
hprRow.appendChild(boost);
|
||||
statsTable.appendChild(hprRow);
|
||||
|
||||
if (insertSummary) {
|
||||
parent_elem.appendChild(hprRow);
|
||||
} else {
|
||||
statsTable.appendChild(hprRow);
|
||||
}
|
||||
|
||||
//EHPR
|
||||
let ehprRow = document.createElement("tr");
|
||||
let ehpr = document.createElement("td");
|
||||
ehpr.classList.add("left");
|
||||
let ehprRow = document.createElement("div");
|
||||
ehprRow.classList.add("row")
|
||||
let ehpr = document.createElement("div");
|
||||
ehpr.classList.add("col");
|
||||
ehpr.classList.add("text-start");
|
||||
ehpr.textContent = "Effective HP Regen:";
|
||||
|
||||
boost = document.createElement("td");
|
||||
boost = document.createElement("div");
|
||||
boost.textContent = stats[3][0];
|
||||
boost.classList.add("right");
|
||||
boost.classList.add("col");
|
||||
boost.classList.add("text-end");
|
||||
tooltiptext = `= ${stats[2]} / ((1 - ${skillPointsToPercentage(build.total_skillpoints[3]).toFixed(3)}) * (1 - ${skillPointsToPercentage(build.total_skillpoints[4]).toFixed(3)}) * (2 - ${defMult}) * (2 - ${build.defenseMultiplier}))`
|
||||
tooltip = createTooltip(tooltip, "p", tooltiptext, boost, ["def-tooltip"]);
|
||||
// tooltip = createTooltip(tooltip, "p", tooltiptext, boost, ["def-tooltip"]);
|
||||
|
||||
ehprRow.appendChild(ehpr);
|
||||
ehprRow.append(boost);
|
||||
statsTable.append(ehprRow);
|
||||
/*
|
||||
ehprRow = document.createElement("tr");
|
||||
ehpr = document.createElement("td");
|
||||
ehpr.classList.add("left");
|
||||
ehpr.textContent = "Effective HP Regen (no agi):";
|
||||
|
||||
boost = document.createElement("td");
|
||||
boost.textContent = stats[3][1];
|
||||
boost.classList.add("right");
|
||||
|
||||
ehprRow.appendChild(ehpr);
|
||||
ehprRow.append(boost);
|
||||
statsTable.append(ehprRow); */
|
||||
|
||||
//eledefs
|
||||
let eledefs = stats[5];
|
||||
for (let i = 0; i < eledefs.length; i++){
|
||||
let eledefElemRow = document.createElement("tr");
|
||||
let eledefElemRow = document.createElement("div");
|
||||
eledefElemRow.classList.add("row")
|
||||
|
||||
let eledef = document.createElement("td");
|
||||
eledef.classList.add("left")
|
||||
let eledefTitle = document.createElement("b");
|
||||
let eledef = document.createElement("div");
|
||||
eledef.classList.add("col");
|
||||
eledef.classList.add("text-start");
|
||||
let eledefTitle = document.createElement("span");
|
||||
eledefTitle.textContent = damageClasses[i+1];
|
||||
eledefTitle.classList.add(damageClasses[i+1]);
|
||||
|
||||
let defense = document.createElement("b");
|
||||
let defense = document.createElement("span");
|
||||
defense.textContent = " Def (Total): ";
|
||||
|
||||
eledef.appendChild(eledefTitle);
|
||||
eledef.appendChild(defense);
|
||||
eledefElemRow.appendChild(eledef);
|
||||
|
||||
let boost = document.createElement("td");
|
||||
let boost = document.createElement("div");
|
||||
boost.textContent = eledefs[i];
|
||||
boost.classList.add(eledefs[i] >= 0 ? "positive" : "negative");
|
||||
boost.classList.add("right");
|
||||
boost.classList.add("col");
|
||||
boost.classList.add("text-end");
|
||||
|
||||
let defRaw = build.statMap.get("defRaw")[i];
|
||||
let defPct = build.statMap.get("defBonus")[i]/100;
|
||||
|
@ -1484,39 +1476,51 @@ function displayDefenseStats(parent_elem, build, insertSummary){
|
|||
defPct >= 0 ? defPct = "+ " + defPct: defPct = "- " + defPct;
|
||||
tooltiptext = `= ${defRaw} * (1 ${defPct})`
|
||||
}
|
||||
tooltip = createTooltip(tooltip, "p", tooltiptext, boost, ["def-tooltip"]);
|
||||
// tooltip = createTooltip(tooltip, "p", tooltiptext, boost, ["def-tooltip"]);
|
||||
|
||||
eledefElemRow.appendChild(boost);
|
||||
|
||||
statsTable.appendChild(eledefElemRow);
|
||||
|
||||
if (insertSummary) {
|
||||
parent_elem.appendChild(eledefElemRow);
|
||||
} else {
|
||||
statsTable.appendChild(eledefElemRow);
|
||||
}
|
||||
}
|
||||
|
||||
if (!insertSummary) {
|
||||
//skp
|
||||
let defRow = document.createElement("tr");
|
||||
let defElem = document.createElement("td");
|
||||
defElem.classList.add("left");
|
||||
let defRow = document.createElement("div");
|
||||
defRow.classList.add("row");
|
||||
let defElem = document.createElement("div");
|
||||
defElem.classList.add("col");
|
||||
defElem.classList.add("text-start");
|
||||
defElem.textContent = "Damage Absorbed %:";
|
||||
boost = document.createElement("td");
|
||||
boost.classList.add("right");
|
||||
boost = document.createElement("div");
|
||||
boost.classList.add("col");
|
||||
boost.classList.add("text-end");
|
||||
boost.textContent = stats[4][0] + "%";
|
||||
defRow.appendChild(defElem);
|
||||
defRow.appendChild(boost);
|
||||
statsTable.append(defRow);
|
||||
|
||||
let agiRow = document.createElement("tr");
|
||||
let agiElem = document.createElement("td");
|
||||
agiElem.classList.add("left");
|
||||
let agiRow = document.createElement("div");
|
||||
agiRow.classList.add("row");
|
||||
let agiElem = document.createElement("div");
|
||||
agiElem.classList.add("col");
|
||||
agiElem.classList.add("text-start");
|
||||
agiElem.textContent = "Dodge Chance %:";
|
||||
boost = document.createElement("td");
|
||||
boost.classList.add("right");
|
||||
boost = document.createElement("div");
|
||||
boost.classList.add("col");
|
||||
boost.classList.add("text-end");
|
||||
boost.textContent = stats[4][1] + "%";
|
||||
agiRow.appendChild(agiElem);
|
||||
agiRow.appendChild(boost);
|
||||
statsTable.append(agiRow);
|
||||
}
|
||||
|
||||
parent_elem.append(statsTable);
|
||||
if (!insertSummary) {
|
||||
parent_elem.append(statsTable);
|
||||
}
|
||||
}
|
||||
|
||||
function displayPowderSpecials(parent_elem, powderSpecials, build) {
|
||||
|
@ -1691,7 +1695,6 @@ function displaySpellDamage(parent_elem, overallparent_elem, build, spell, spell
|
|||
|
||||
overallparent_elem.append(displayNextCosts(spell, build, build.weapon.statMap));
|
||||
|
||||
|
||||
let critChance = skillPointsToPercentage(build.total_skillpoints[1]);
|
||||
|
||||
let save_damages = [];
|
||||
|
|
Loading…
Add table
Reference in a new issue