feat: stuffs

This commit is contained in:
reschan 2021-10-21 21:11:04 +07:00
parent afb02b33dc
commit c651816392
6 changed files with 1185 additions and 260 deletions

121
sq2bs.css
View file

@ -1,4 +1,6 @@
* {
font-family: 'Nunito', sans-serif;
}
/* sidebar stuff */ /* sidebar stuff */
.sidebar { .sidebar {
@ -44,6 +46,14 @@
/* builder containers */ /* builder containers */
/* wynn-related css(es) */ /* wynn-related css(es) */
.positive {
color: #5f5;
}
.negative {
color: #f55;
}
.Health { .Health {
color: #AA0000 color: #AA0000
} }
@ -52,6 +62,14 @@
content: "\2764" ' '; content: "\2764" ' ';
} }
.lvl:before {
content: 'Lv. '
}
.Damage {
color: rgb(255, 198, 85)
}
.Normal { .Normal {
color: #FFFFFF; color: #FFFFFF;
} }
@ -73,7 +91,12 @@
} }
.Mythic { .Mythic {
color: #AA00AA color: #AA00AA;
}
.Set {
display: inline;
color: #5f5;
} }
.eDam, .Earth, .Earth_powder { .eDam, .Earth, .Earth_powder {
@ -110,9 +133,37 @@
color: #FFAA00; color: #FFAA00;
} }
.nDam:before, .Neutral:before { content: "\2724" ' '; } .nDam:before, .Neutral:before {
content: "\2724" ' ';
}
.Mana {
color: #5ff;
}
.Mana:after {
content: "\273A"
}
/* equipment field specifics */ /* equipment field specifics */
.text-right {
float: right;
}
.text-left {
float: left;
}
.spell-display p {
margin-bottom: 0;
}
.spell-display b {
font-size: 3rem;
font-weight: bold;
}
input { input {
min-width: 0; min-width: 0;
width: 100%; width: 100%;
@ -131,34 +182,72 @@ input.equipment-input {
font-weight: bold; font-weight: bold;
} }
.warning {
color: #ff8180;
font-size: 1.875rem;
margin-bottom: 0;
font-weight: bold;
}
.scaled-item-icon { .scaled-item-icon {
width: 128px; width: 8rem;
} }
.scaled-item-icon img { .scaled-item-icon img {
width: 104px; width: 6.5rem;
} }
@media screen and (min-width: 992px) { @media screen and (min-width: 1200px) and (max-width: 1400px) {
.scaled-font { .scaled-font {
font-size: 1rem; font-size: .8rem;
} }
.skp-tooltip { .skp-tooltip {
font-size: .875rem; font-size: .625rem;
font-weight: bold;
} }
.scaled-item-icon { .scaled-item-icon {
width: 64px; width: 3.2rem;
} }
.scaled-item-icon img { .scaled-item-icon img {
width: 56px; width: 2.8rem;
}
.warning {
font-size: .7rem;
}
.spell-display b {
font-size: 1rem;
} }
} }
@media screen and (min-width: 1400px) {
.scaled-font {
font-size: 1rem;
}
.skp-tooltip {
font-size: .78rem;
}
.scaled-item-icon {
width: 4rem;
}
.scaled-item-icon img {
width: 3.5rem;
}
.warning {
font-size: .8rem;
}
.spell-display b {
font-size: 1.2rem;
}
}
/* Fake button for build stats */ /* Fake button for build stats */
.fake-button { .fake-button {
@ -208,8 +297,8 @@ input.equipment-input {
.dark-shadow { .dark-shadow {
box-shadow: 0rem 0rem 1.25rem 0.1875rem black; box-shadow: 0rem 0rem 1.25rem 0.1875rem black;
} }
.dark-shadow-sm { .dark-shadow-sm {
box-shadow: 0rem 0rem 0.625rem 0.125rem black; box-shadow: 0rem 0rem 0.625rem 0.125rem black;
} }

File diff suppressed because it is too large Load diff

150
sq2bs.js
View file

@ -1,3 +1,153 @@
$().ready(function(){ $().ready(function(){
// sp fields
jQuery(document).on("input", '.skp-update', function(){
updateStatSchedule();
});
// equipment fields
$("#weapon-choice").on('input', function(e){
update_fields('weapon');
calcBuildSchedule();
});
$("#weapon-powder").on('input', function(e){
calcBuildSchedule();
});
$("#helmet-choice").on('input', function(e){
update_fields('helmet', '|example: t6t6');
calcBuildSchedule();
});
$("#helmet-powder").on('input', function(e){
calcBuildSchedule();
});
$("#chestplate-choice").on('input', function(e){
update_fields('chestplate');
calcBuildSchedule();
});
$("#chestplate-powder").on('input', function(e){
calcBuildSchedule();
});
$("#leggings-choice").on('input', function(e){
update_fields('leggings');
calcBuildSchedule();
});
$("#leggings-powder").on('input', function(e){
calcBuildSchedule();
});
$("#boots-choice").on('input', function(e){
update_fields('boots');
calcBuildSchedule();
});
$("#boots-powder").on('input', function(e){
calcBuildSchedule();
});
$("#ring1-choice").on('input', function(e){
update_fields('ring1');
calcBuildSchedule();
});
$("#ring2-choice").on('input', function(e){
update_fields('ring2');
calcBuildSchedule();
});
$("#bracelet-choice").on('input', function(e){
update_fields('bracelet');
calcBuildSchedule();
});
$("#necklace-choice").on('input', function(e){
update_fields('necklace');
calcBuildSchedule();
});
$("#level-choice").on('input', function(e){
calcBuildSchedule();
});
// tabular stats view
let tabs = ['minimal-stats', 'minimal-offensive-stats', 'minimal-defensive-stats'];
let btns = ['tab-basic-btn', 'tab-offense-btn', 'tab-defense-btn'];
$(".fake-button").on('click' ,function(e){
let target_tab;
if (e.target.id == 'tab-basic-btn') {
target_tab = 'minimal-stats';
}
else if (e.target.id == 'tab-offense-btn') {
target_tab = 'minimal-offensive-stats';
}
else if (e.target.id == 'tab-defense-btn') {
target_tab = 'minimal-defensive-stats';
}
for (const i in tabs) {
$("#"+tabs[i]).hide();
$("#"+btns[i]).removeClass("dark-6").addClass("dark-4");
}
$("#"+e.target.id).addClass("dark-6");
$("#"+target_tab).show();
});
}); });
let calcBuildTask = null;
let updateStatTask = null;
let doSearchTask = null;
function calcBuildSchedule(){
if (calcBuildTask !== null) {
clearTimeout(calcBuildTask);
}
calcBuildTask = setTimeout(function(){
calcBuildTask = null;
calculateBuild();
}, 500);
}
function updateStatSchedule(){
if (updateStatTask !== null) {
clearTimeout(updateStatTask);
}
updateStatTask = setTimeout(function(){
updateStatTask = null;
updateStats();
}, 500);
}
function doSearchSchedule(){
if (doSearchTask !== null) {
clearTimeout(doSearchTask);
}
doSearchTask = setTimeout(function(){
doSearchTask = null;
doItemSearch();
}, 500);
}
function update_fields(type, alt="") {
let item = itemMap.get($("#"+type+"-choice").val());
if (item) {
$("#"+type+"-powder").attr("placeholder", item["slots"]+" slots"+alt);
$("#"+type+"-choice").removeClass("text-light").addClass(item.tier);
if (type == 'weapon') {
$("#"+type+"-img").attr('src', 'media/items/new/generic-'+item.type+'.png');
}
} else {
$("#"+type+"-choice").removeClass('Normal Unique Rare Legendary Fabled Mythic Set').addClass("text-light");
}
}
function init_field_styles() {
let equipment_keys = ['weapon', 'helmet', 'chestplate', 'leggings', 'boots', 'ring1', 'ring2', 'bracelet', 'necklace'];
for (const i in equipment_keys) {
update_fields(equipment_keys[i]);
}
}

View file

@ -165,7 +165,7 @@ function init() {
});*/ });*/
decodeBuild(url_tag); decodeBuild(url_tag);
init_equipUI(); init_field_styles();
} }
function getItemNameFromID(id) { function getItemNameFromID(id) {
@ -469,7 +469,7 @@ function calculateBuild(save_skp, skp){
const assigned = player_build.base_skillpoints; const assigned = player_build.base_skillpoints;
const skillpoints = player_build.total_skillpoints; const skillpoints = player_build.total_skillpoints;
for (let i in skp_order){ //big bren for (let i in skp_order){ //big bren
setText(skp_order[i] + "-skp-base", "Original Value: " + skillpoints[i]); setText(skp_order[i] + "-skp-base", "Original: " + skillpoints[i]);
} }
for (let id of editable_item_fields) { for (let id of editable_item_fields) {
@ -761,10 +761,10 @@ function calculateBuildStats() {
let summarybox = document.getElementById("summary-box"); let summarybox = document.getElementById("summary-box");
summarybox.textContent = ""; summarybox.textContent = "";
let skpRow = document.createElement("p"); let skpRow = document.createElement("p");
let td = document.createElement("p"); // let td = document.createElement("p");
let remainingSkp = document.createElement("p"); let remainingSkp = document.createElement("p");
remainingSkp.classList.add("center"); remainingSkp.classList.add("scaled-font");
let remainingSkpTitle = document.createElement("b"); let remainingSkpTitle = document.createElement("b");
remainingSkpTitle.textContent = "Assigned " + player_build.assigned_skillpoints + " skillpoints. Remaining skillpoints: "; remainingSkpTitle.textContent = "Assigned " + player_build.assigned_skillpoints + " skillpoints. Remaining skillpoints: ";
let remainingSkpContent = document.createElement("b"); let remainingSkpContent = document.createElement("b");
@ -778,13 +778,14 @@ function calculateBuildStats() {
summarybox.append(skpRow); summarybox.append(skpRow);
summarybox.append(remainingSkp); summarybox.append(remainingSkp);
if(player_build.assigned_skillpoints > levelToSkillPoints(player_build.level)){ if(player_build.assigned_skillpoints > levelToSkillPoints(player_build.level)){
let skpWarning = document.createElement("p"); let skpWarning = document.createElement("span");
//skpWarning.classList.add("itemp"); //skpWarning.classList.add("itemp");
skpWarning.classList.add("warning"); skpWarning.classList.add("warning");
skpWarning.classList.add("small-text"); // skpWarning.classList.add("skp-tooltip");
skpWarning.textContent = "WARNING: Too many skillpoints need to be assigned!"; skpWarning.textContent = "WARNING: Too many skillpoints need to be assigned!";
let skpCount = document.createElement("p"); let skpCount = document.createElement("p");
skpCount.classList.add("small-text"); skpCount.classList.add("warning");
// skpCount.classList.add("skp-tooltip");
skpCount.textContent = "For level " + (player_build.level>101 ? "101+" : player_build.level) + ", there are only " + levelToSkillPoints(player_build.level) + " skill points available."; skpCount.textContent = "For level " + (player_build.level>101 ? "101+" : player_build.level) + ", there are only " + levelToSkillPoints(player_build.level) + " skill points available.";
summarybox.append(skpWarning); summarybox.append(skpWarning);
summarybox.append(skpCount); summarybox.append(skpCount);
@ -830,14 +831,13 @@ function calculateBuildStats() {
} }
for (let i in player_build.items) { for (let i in player_build.items) {
displaysq2ExpandedItem(player_build.items[i], buildFields[i], true); // displaysq2ExpandedItem(player_build.items[i], buildFields[i], true);
} }
displaysq2WeaponBase(player_build);
displaysq2ArmorStats(player_build); displaysq2ArmorStats(player_build);
displayMinimalBuildStats("all-stats", player_build, build_all_display_commands); displaysq2BuildStats("all-stats", player_build, build_all_display_commands);
displayMinimalBuildStats("minimal-stats", player_build, build_basic_display_commands); displaysq2BuildStats("minimal-stats", player_build, build_basic_display_commands);
displayMinimalBuildStats("minimal-offensive-stats",player_build, build_offensive_display_commands); displaysq2BuildStats("minimal-offensive-stats",player_build, build_offensive_display_commands);
displaySetBonuses("set-info",player_build); displaySetBonuses("set-info",player_build);
displayNextCosts("int-info",player_build); displayNextCosts("int-info",player_build);

View file

@ -1,4 +1,4 @@
function displayMinimalBuildStats(parent_id,build,command_group){ function displaysq2BuildStats(parent_id,build,command_group){
// Commands to "script" the creation of nice formatting. // Commands to "script" the creation of nice formatting.
// #commands create a new element. // #commands create a new element.
// !elemental is some janky hack for elemental damage. // !elemental is some janky hack for elemental damage.
@ -22,35 +22,13 @@ function displayMinimalBuildStats(parent_id,build,command_group){
for (const command of display_commands) { for (const command of display_commands) {
// style instructions // style instructions
if (command.charAt(0) === "#") { if (command.charAt(0) === "#") {
if (command === "#cdiv") { if (command === "#defense-stats") {
active_elem = document.createElement('div'); displaysq2DefenseStats(parent_div, build, true);
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('full-border')
}
else if (command === "#defense-stats") {
displaysq2DefenseStats(active_elem, build, true);
}
else if(command === "#spacer") {
let row = document.createElement('tr');
let filler = document.createElement('td');
filler.colSpan = 2
filler.classList.add('center')
filler.classList.add('shaded-table')
filler.classList.add('spacer-table')
row.appendChild(filler);
active_elem.appendChild(row);
}
parent_div.appendChild(active_elem);
} }
else if (command.charAt(0) === "!") { if (command.charAt(0) === "!") {
// TODO: This is sooo incredibly janky..... // TODO: This is sooo incredibly janky.....
if (command === "!elemental") { if (command === "!elemental") {
elemental_format = !elemental_format; elemental_format = !elemental_format;
@ -79,12 +57,14 @@ function displayMinimalBuildStats(parent_id,build,command_group){
if (id === "poison" && id_val > 0) { if (id === "poison" && id_val > 0) {
id_val = Math.ceil(id_val*build.statMap.get("poisonPct")/100); id_val = Math.ceil(id_val*build.statMap.get("poisonPct")/100);
} }
displaysq2FixedID(active_elem, id, id_val, elemental_format, style); displaysq2FixedID(parent_div, id, id_val, elemental_format, style);
if (id === "poison" && id_val > 0) { if (id === "poison" && id_val > 0) {
let row = document.createElement('tr'); let row = document.createElement('div');
let value_elem = document.createElement('td'); row.classList.add("row")
value_elem.classList.add('right'); let value_elem = document.createElement('div');
value_elem.setAttribute("colspan", "2"); value_elem.classList.add('col');
value_elem.classList.add('text-end');
let prefix_elem = document.createElement('b'); let prefix_elem = document.createElement('b');
prefix_elem.textContent = "\u279C With Strength: "; prefix_elem.textContent = "\u279C With Strength: ";
let number_elem = document.createElement('b'); let number_elem = document.createElement('b');
@ -94,7 +74,7 @@ function displayMinimalBuildStats(parent_id,build,command_group){
value_elem.append(number_elem); value_elem.append(number_elem);
row.appendChild(value_elem); row.appendChild(value_elem);
active_elem.appendChild(row); parent_div.appendChild(row);
} }
// sp thingy // sp thingy
@ -109,7 +89,7 @@ function displayMinimalBuildStats(parent_id,build,command_group){
style = "negative"; style = "negative";
} }
if (diff != 0) { if (diff != 0) {
displaysq2FixedID(active_elem, id, diff, false, style); displaysq2FixedID(parent_div, id, diff, false, style);
} }
} }
} }
@ -565,11 +545,12 @@ function displaysq2WeaponBase(build) {
function displaysq2FixedID(active, id, value, elemental_format, style) { function displaysq2FixedID(active, id, value, elemental_format, style) {
if (style) { if (style) {
let row = document.createElement('tr'); let row = document.createElement('div');
let desc_elem = document.createElement('td'); row.classList.add("row");
desc_elem.classList.add('shaded-table'); let desc_elem = document.createElement('div');
desc_elem.classList.add('left'); desc_elem.classList.add('col');
desc_elem.classList.add('se-padded'); desc_elem.classList.add('text-start');
if (elemental_format) { if (elemental_format) {
apply_elemental_format(desc_elem, id); apply_elemental_format(desc_elem, id);
} }
@ -578,10 +559,9 @@ function displaysq2FixedID(active, id, value, elemental_format, style) {
} }
row.appendChild(desc_elem); row.appendChild(desc_elem);
let value_elem = document.createElement('td'); let value_elem = document.createElement('div');
value_elem.classList.add('right'); value_elem.classList.add('col');
value_elem.classList.add('shaded-table'); value_elem.classList.add('text-end');
value_elem.classList.add('se-padded');
value_elem.classList.add(style); value_elem.classList.add(style);
value_elem.textContent = value + idSuffixes[id]; value_elem.textContent = value + idSuffixes[id];
row.appendChild(value_elem); row.appendChild(value_elem);
@ -610,19 +590,13 @@ function displaysq2PoisonDamage(overallparent_elem, build) {
overallparent_elem.textContent = ""; overallparent_elem.textContent = "";
//Title //Title
let title_elemavg = document.createElement("p"); let title_elemavg = document.createElement("b");
title_elemavg.classList.add('no-newline');
// title_elemavg.classList.add("smalltitle");
// title_elemavg.classList.add("Normal");
title_elemavg.textContent = "Poison Stats"; title_elemavg.textContent = "Poison Stats";
overallparent_elem.append(title_elemavg); overallparent_elem.append(title_elemavg);
let overallpoisonDamage = document.createElement("p"); let overallpoisonDamage = document.createElement("p");
// overallpoisonDamage.classList.add("lessbottom"); let overallpoisonDamageFirst = document.createElement("span");
let overallpoisonDamageFirst = document.createElement("p"); let overallpoisonDamageSecond = document.createElement("span");
let overallpoisonDamageSecond = document.createElement("p");
overallpoisonDamageFirst.classList.add('no-newline');
overallpoisonDamageSecond.classList.add('no-newline');
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); 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: "; overallpoisonDamageFirst.textContent = "Poison Tick: ";
overallpoisonDamageSecond.textContent = Math.max(poison_tick,0); overallpoisonDamageSecond.textContent = Math.max(poison_tick,0);
@ -634,8 +608,8 @@ function displaysq2PoisonDamage(overallparent_elem, build) {
} }
function displaysq2MeleeDamage(parent_elem, overallparent_elem, meleeStats){ function displaysq2MeleeDamage(parent_elem, overallparent_elem, meleeStats){
console.log("Melee Stats"); // console.log("Melee Stats");
console.log(meleeStats); // console.log(meleeStats);
let tooltipinfo = meleeStats[13]; let tooltipinfo = meleeStats[13];
let attackSpeeds = ["Super Slow", "Very Slow", "Slow", "Normal", "Fast", "Very Fast", "Super Fast"]; let attackSpeeds = ["Super Slow", "Very Slow", "Slow", "Normal", "Fast", "Very Fast", "Super Fast"];
//let damagePrefixes = ["Neutral Damage: ","Earth Damage: ","Thunder Damage: ","Water Damage: ","Fire Damage: ","Air Damage: "]; //let damagePrefixes = ["Neutral Damage: ","Earth Damage: ","Thunder Damage: ","Water Damage: ","Fire Damage: ","Air Damage: "];
@ -667,9 +641,7 @@ function displaysq2MeleeDamage(parent_elem, overallparent_elem, meleeStats){
parent_elem.append(document.createElement("br")); parent_elem.append(document.createElement("br"));
//overall title //overall title
let title_elemavg = document.createElement("p"); let title_elemavg = document.createElement("b");
title_elemavg.classList.add('no-newline');
title_elemavg.classList.add("box-title");
title_elemavg.textContent = "Melee Stats"; title_elemavg.textContent = "Melee Stats";
overallparent_elem.append(title_elemavg); overallparent_elem.append(title_elemavg);
@ -684,12 +656,10 @@ function displaysq2MeleeDamage(parent_elem, overallparent_elem, meleeStats){
//overall average DPS //overall average DPS
let overallaverageDamage = document.createElement("p"); let overallaverageDamage = document.createElement("p");
let overallaverageDamageFirst = document.createElement("p"); let overallaverageDamageFirst = document.createElement("span");
overallaverageDamageFirst.classList.add('no-newline');
overallaverageDamageFirst.textContent = "Average DPS: " overallaverageDamageFirst.textContent = "Average DPS: "
let overallaverageDamageSecond = document.createElement("p"); let overallaverageDamageSecond = document.createElement("span");
overallaverageDamageSecond.classList.add('no-newline');
overallaverageDamageSecond.classList.add("Damage"); overallaverageDamageSecond.classList.add("Damage");
overallaverageDamageSecond.textContent = stats[10]; overallaverageDamageSecond.textContent = stats[10];
overallaverageDamage.appendChild(overallaverageDamageFirst); overallaverageDamage.appendChild(overallaverageDamageFirst);
@ -707,11 +677,9 @@ function displaysq2MeleeDamage(parent_elem, overallparent_elem, meleeStats){
//overall attack speed //overall attack speed
let overallatkSpd = document.createElement("p"); let overallatkSpd = document.createElement("p");
let overallatkSpdFirst = document.createElement("p"); let overallatkSpdFirst = document.createElement("span");
overallatkSpdFirst.classList.add('no-newline');
overallatkSpdFirst.textContent = "Attack Speed: "; overallatkSpdFirst.textContent = "Attack Speed: ";
let overallatkSpdSecond = document.createElement("p"); let overallatkSpdSecond = document.createElement("span");
overallatkSpdSecond.classList.add('no-newline');
overallatkSpdSecond.classList.add("Damage"); overallatkSpdSecond.classList.add("Damage");
overallatkSpdSecond.textContent = attackSpeeds[stats[11]]; overallatkSpdSecond.textContent = attackSpeeds[stats[11]];
overallatkSpd.appendChild(overallatkSpdFirst); overallatkSpd.appendChild(overallatkSpdFirst);
@ -758,11 +726,9 @@ function displaysq2MeleeDamage(parent_elem, overallparent_elem, meleeStats){
//overall average DPS //overall average DPS
let singleHitDamage = document.createElement("p"); let singleHitDamage = document.createElement("p");
let singleHitDamageFirst = document.createElement("p"); let singleHitDamageFirst = document.createElement("span");
singleHitDamageFirst.classList.add('no-newline');
singleHitDamageFirst.textContent = "Single Hit Average: "; singleHitDamageFirst.textContent = "Single Hit Average: ";
let singleHitDamageSecond = document.createElement("p"); let singleHitDamageSecond = document.createElement("span");
singleHitDamageSecond.classList.add('no-newline');
singleHitDamageSecond.classList.add("Damage"); singleHitDamageSecond.classList.add("Damage");
singleHitDamageSecond.textContent = stats[12].toFixed(2); singleHitDamageSecond.textContent = stats[12].toFixed(2);
tooltiptext = ` = ((${stats[6][0]} + ${stats[6][1]}) / 2) * ${stats[6][2].toFixed(2)} + ((${stats[7][0]} + ${stats[7][1]}) / 2) * ${stats[7][2].toFixed(2)}`; tooltiptext = ` = ((${stats[6][0]} + ${stats[6][1]}) / 2) * ${stats[6][2].toFixed(2)} + ((${stats[7][0]} + ${stats[7][1]}) / 2) * ${stats[7][2].toFixed(2)}`;
@ -834,7 +800,6 @@ function displaysq2ArmorStats(build) {
document.getElementById(armor_keys[i]+'-health').textContent = build[armor_keys[i]].get('hp'); document.getElementById(armor_keys[i]+'-health').textContent = build[armor_keys[i]].get('hp');
document.getElementById(armor_keys[i]+'-lv').textContent = build[armor_keys[i]].get('lvl'); document.getElementById(armor_keys[i]+'-lv').textContent = build[armor_keys[i]].get('lvl');
} }
} }
function displaysq2DefenseStats(parent_elem, build, insertSummary){ function displaysq2DefenseStats(parent_elem, build, insertSummary){
@ -846,8 +811,7 @@ function displaysq2DefenseStats(parent_elem, build, insertSummary){
const stats = defenseStats.slice(); const stats = defenseStats.slice();
// parent_elem.append(document.createElement("br")); // parent_elem.append(document.createElement("br"));
let statsTable = document.createElement("table"); let statsTable = document.createElement("div");
statsTable.classList.add("full-border");
//[total hp, ehp, total hpr, ehpr, [def%, agi%], [edef,tdef,wdef,fdef,adef]] //[total hp, ehp, total hpr, ehpr, [def%, agi%], [edef,tdef,wdef,fdef,adef]]
for(const i in stats){ for(const i in stats){
@ -861,16 +825,17 @@ function displaysq2DefenseStats(parent_elem, build, insertSummary){
} }
//total HP //total HP
let hpRow = document.createElement("tr"); let hpRow = document.createElement("div");
let hp = document.createElement("td"); hpRow.classList.add('row');
let hp = document.createElement("div");
hp.classList.add('col');
hp.classList.add("Health"); hp.classList.add("Health");
hp.classList.add("shaded-table"); hp.classList.add("text-start");
hp.classList.add("left");
hp.textContent = "Total HP:"; hp.textContent = "Total HP:";
let boost = document.createElement("td"); let boost = document.createElement("div");
boost.classList.add('col');
boost.textContent = stats[0]; boost.textContent = stats[0];
boost.classList.add("right"); boost.classList.add("text-end");
boost.classList.add("shaded-table")
hpRow.appendChild(hp); hpRow.appendChild(hp);
hpRow.append(boost); hpRow.append(boost);
@ -887,16 +852,17 @@ function displaysq2DefenseStats(parent_elem, build, insertSummary){
if (!defMult) {defMult = 1} if (!defMult) {defMult = 1}
//EHP //EHP
let ehpRow = document.createElement("tr"); let ehpRow = document.createElement("div");
let ehp = document.createElement("td"); ehpRow.classList.add("row");
ehp.classList.add("left"); let ehp = document.createElement("div");
ehp.classList.add("shaded-table"); ehp.classList.add("col");
ehp.classList.add("text-start");
ehp.textContent = "Effective HP:"; ehp.textContent = "Effective HP:";
boost = document.createElement("td"); boost = document.createElement("div");
boost.textContent = stats[1][0]; boost.textContent = stats[1][0];
boost.classList.add("right"); boost.classList.add("col");
boost.classList.add("shaded-table"); 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}))` 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"]);
@ -909,16 +875,17 @@ function displaysq2DefenseStats(parent_elem, build, insertSummary){
statsTable.append(ehpRow); statsTable.append(ehpRow);
} }
ehpRow = document.createElement("tr"); ehpRow = document.createElement("div");
ehp = document.createElement("td"); ehpRow.classList.add("row");
ehp.classList.add("left"); ehp = document.createElement("div");
ehp.classList.add("shaded-table"); ehp.classList.add("col");
ehp.classList.add("text-start");
ehp.textContent = "Effective HP (no agi):"; ehp.textContent = "Effective HP (no agi):";
boost = document.createElement("td"); boost = document.createElement("div");
boost.textContent = stats[1][1]; boost.textContent = stats[1][1];
boost.classList.add("right"); boost.classList.add("col");
boost.classList.add("shaded-table"); boost.classList.add("text-end");
tooltiptext = `= ${stats[0]} / ((1 - ${skillPointsToPercentage(build.total_skillpoints[3]).toFixed(3)}) * (2 - ${defMult}) * (2 - ${build.defenseMultiplier}))` 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"]);
@ -927,16 +894,17 @@ function displaysq2DefenseStats(parent_elem, build, insertSummary){
statsTable.append(ehpRow); statsTable.append(ehpRow);
//total HPR //total HPR
let hprRow = document.createElement("tr"); let hprRow = document.createElement("div");
let hpr = document.createElement("td"); hprRow.classList.add("row")
let hpr = document.createElement("div");
hpr.classList.add("Health"); hpr.classList.add("Health");
hpr.classList.add("shaded-table"); hpr.classList.add("col");
hpr.classList.add("left"); hpr.classList.add("text-start");
hpr.textContent = "HP Regen (Total):"; hpr.textContent = "HP Regen (Total):";
boost = document.createElement("td"); boost = document.createElement("div");
boost.textContent = stats[2]; boost.textContent = stats[2];
boost.classList.add("right"); boost.classList.add("col");
boost.classList.add("shaded-table") boost.classList.add("text-end");
hprRow.appendChild(hpr); hprRow.appendChild(hpr);
hprRow.appendChild(boost); hprRow.appendChild(boost);
@ -948,16 +916,17 @@ function displaysq2DefenseStats(parent_elem, build, insertSummary){
} }
//EHPR //EHPR
let ehprRow = document.createElement("tr"); let ehprRow = document.createElement("div");
let ehpr = document.createElement("td"); ehprRow.classList.add("row")
ehpr.classList.add("left"); let ehpr = document.createElement("div");
ehpr.classList.add("shaded-table"); ehpr.classList.add("col");
ehpr.classList.add("text-start");
ehpr.textContent = "Effective HP Regen:"; ehpr.textContent = "Effective HP Regen:";
boost = document.createElement("td"); boost = document.createElement("div");
boost.textContent = stats[3][0]; boost.textContent = stats[3][0];
boost.classList.add("right"); boost.classList.add("col");
boost.classList.add("shaded-table"); 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}))` 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"]);
@ -981,29 +950,28 @@ function displaysq2DefenseStats(parent_elem, build, insertSummary){
//eledefs //eledefs
let eledefs = stats[5]; let eledefs = stats[5];
for (let i = 0; i < eledefs.length; i++){ 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"); let eledef = document.createElement("div");
eledef.classList.add("left"); eledef.classList.add("col");
eledef.classList.add("shaded-table"); eledef.classList.add("text-start");
let eledefTitle = document.createElement("p"); let eledefTitle = document.createElement("span");
eledefTitle.classList.add('no-newline');
eledefTitle.textContent = damageClasses[i+1]; eledefTitle.textContent = damageClasses[i+1];
eledefTitle.classList.add(damageClasses[i+1]); eledefTitle.classList.add(damageClasses[i+1]);
let defense = document.createElement("p"); let defense = document.createElement("span");
defense.classList.add('no-newline');
defense.textContent = " Def (Total): "; defense.textContent = " Def (Total): ";
eledef.appendChild(eledefTitle); eledef.appendChild(eledefTitle);
eledef.appendChild(defense); eledef.appendChild(defense);
eledefElemRow.appendChild(eledef); eledefElemRow.appendChild(eledef);
let boost = document.createElement("td"); let boost = document.createElement("div");
boost.textContent = eledefs[i]; boost.textContent = eledefs[i];
boost.classList.add(eledefs[i] >= 0 ? "positive" : "negative"); boost.classList.add(eledefs[i] >= 0 ? "positive" : "negative");
boost.classList.add("right"); boost.classList.add("col");
boost.classList.add("shaded-table"); boost.classList.add("text-end");
let defRaw = build.statMap.get("defRaw")[i]; let defRaw = build.statMap.get("defRaw")[i];
let defPct = build.statMap.get("defBonus")[i]/100; let defPct = build.statMap.get("defBonus")[i]/100;
@ -1027,27 +995,29 @@ function displaysq2DefenseStats(parent_elem, build, insertSummary){
if (!insertSummary) { if (!insertSummary) {
//skp //skp
let defRow = document.createElement("tr"); let defRow = document.createElement("div");
let defElem = document.createElement("td"); defRow.classList.add("row");
defElem.classList.add("left"); let defElem = document.createElement("div");
defElem.classList.add("shaded-table"); defElem.classList.add("col");
defElem.classList.add("text-start");
defElem.textContent = "Damage Absorbed %:"; defElem.textContent = "Damage Absorbed %:";
boost = document.createElement("td"); boost = document.createElement("div");
boost.classList.add("right"); boost.classList.add("col");
boost.classList.add("shaded-table"); boost.classList.add("text-end");
boost.textContent = stats[4][0] + "%"; boost.textContent = stats[4][0] + "%";
defRow.appendChild(defElem); defRow.appendChild(defElem);
defRow.appendChild(boost); defRow.appendChild(boost);
statsTable.append(defRow); statsTable.append(defRow);
let agiRow = document.createElement("tr"); let agiRow = document.createElement("div");
let agiElem = document.createElement("td"); agiRow.classList.add("row");
agiElem.classList.add("left"); let agiElem = document.createElement("div");
agiElem.classList.add("shaded-table"); agiElem.classList.add("col");
agiElem.classList.add("text-start");
agiElem.textContent = "Dodge Chance %:"; agiElem.textContent = "Dodge Chance %:";
boost = document.createElement("td"); boost = document.createElement("div");
boost.classList.add("right"); boost.classList.add("col");
boost.classList.add("shaded-table") boost.classList.add("text-end");
boost.textContent = stats[4][1] + "%"; boost.textContent = stats[4][1] + "%";
agiRow.appendChild(agiElem); agiRow.appendChild(agiElem);
agiRow.appendChild(boost); agiRow.appendChild(boost);
@ -1191,26 +1161,19 @@ function displaysq2SpellDamage(parent_elem, overallparent_elem, build, spell, sp
let tooltip; let tooltiptext; let tooltip; let tooltiptext;
const stats = build.statMap; const stats = build.statMap;
let title_elem = document.createElement("p"); let title_elem = document.createElement("p");
// title_elem.classList.add("smalltitle");
// title_elem.classList.add("Normal");
overallparent_elem.textContent = ""; overallparent_elem.textContent = "";
let title_elemavg = document.createElement("p"); let title_elemavg = document.createElement("b");
// title_elemavg.classList.add('smalltitle');
// title_elemavg.classList.add('Normal');
if (spellIdx != 0) { if (spellIdx != 0) {
let first = document.createElement("p"); let first = document.createElement("span");
first.classList.add('no-newline');
first.textContent = spell.title + " ("; first.textContent = spell.title + " (";
title_elem.appendChild(first.cloneNode(true)); //cloneNode is needed here. title_elem.appendChild(first.cloneNode(true)); //cloneNode is needed here.
title_elemavg.appendChild(first); title_elemavg.appendChild(first);
let second = document.createElement("p"); let second = document.createElement("span");
second.classList.add('no-newline');
second.textContent = build.getSpellCost(spellIdx, spell.cost); second.textContent = build.getSpellCost(spellIdx, spell.cost);
second.classList.add("Mana"); second.classList.add("Mana");
// second.classList.add("tooltip");
let int_redux = skillPointsToPercentage(build.total_skillpoints[2]).toFixed(2); let int_redux = skillPointsToPercentage(build.total_skillpoints[2]).toFixed(2);
let spPct_redux = (build.statMap.get("spPct" + spellIdx)/100).toFixed(2); let spPct_redux = (build.statMap.get("spPct" + spellIdx)/100).toFixed(2);
@ -1229,8 +1192,7 @@ function displaysq2SpellDamage(parent_elem, overallparent_elem, build, spell, sp
third.classList.add('no-newline'); third.classList.add('no-newline');
third.textContent = ") [Base: " + build.getBaseSpellCost(spellIdx, spell.cost) + " ]"; third.textContent = ") [Base: " + build.getBaseSpellCost(spellIdx, spell.cost) + " ]";
title_elem.appendChild(third); title_elem.appendChild(third);
let third_summary = document.createElement("p"); let third_summary = document.createElement("span");
third_summary.classList.add('no-newline');
third_summary.textContent = ")"; third_summary.textContent = ")";
title_elemavg.appendChild(third_summary); title_elemavg.appendChild(third_summary);
} }
@ -1247,7 +1209,6 @@ function displaysq2SpellDamage(parent_elem, overallparent_elem, build, spell, sp
let save_damages = []; let save_damages = [];
let part_divavg = document.createElement("p"); let part_divavg = document.createElement("p");
// part_divavg.classList.add("lessbottom");
overallparent_elem.append(part_divavg); overallparent_elem.append(part_divavg);
let spell_parts; let spell_parts;
@ -1266,13 +1227,12 @@ function displaysq2SpellDamage(parent_elem, overallparent_elem, build, spell, sp
//console.log(spell_parts); //console.log(spell_parts);
for (const part of spell_parts) { for (const part of spell_parts) {
parent_elem.append(document.createElement("br")); // parent_elem.append(document.createElement("br"));
let part_div = document.createElement("p"); let part_div = document.createElement("p");
parent_elem.append(part_div); parent_elem.append(part_div);
let subtitle_elem = document.createElement("p"); let subtitle_elem = document.createElement("p");
subtitle_elem.textContent = part.subtitle; subtitle_elem.textContent = part.subtitle;
// subtitle_elem.classList.add("nomargin");
part_div.append(subtitle_elem); part_div.append(subtitle_elem);
if (part.type === "damage") { if (part.type === "damage") {
@ -1304,10 +1264,8 @@ function displaysq2SpellDamage(parent_elem, overallparent_elem, build, spell, sp
if (part.summary == true) { if (part.summary == true) {
let overallaverageLabel = document.createElement("p"); let overallaverageLabel = document.createElement("p");
let first = document.createElement("p"); let first = document.createElement("span");
let second = document.createElement("p"); let second = document.createElement("span");
first.classList.add('no-newline');
second.classList.add('no-newline');
first.textContent = part.subtitle + " Average: "; first.textContent = part.subtitle + " Average: ";
second.textContent = averageDamage.toFixed(2); second.textContent = averageDamage.toFixed(2);
overallaverageLabel.appendChild(first); overallaverageLabel.appendChild(first);
@ -1356,33 +1314,14 @@ function displaysq2SpellDamage(parent_elem, overallparent_elem, build, spell, sp
part_div.append(healLabel); part_div.append(healLabel);
if (part.summary == true) { if (part.summary == true) {
let overallhealLabel = document.createElement("p"); let overallhealLabel = document.createElement("p");
let first = document.createElement("p"); let first = document.createElement("span");
let second = document.createElement("p"); let second = document.createElement("span");
first.classList.add('no-newline');
second.classList.add('no-newline');
first.textContent = part.subtitle + ": "; first.textContent = part.subtitle + ": ";
second.textContent = heal_amount; second.textContent = heal_amount;
overallhealLabel.appendChild(first); overallhealLabel.appendChild(first);
second.classList.add("Set"); second.classList.add("Set");
overallhealLabel.appendChild(second); overallhealLabel.appendChild(second);
// overallhealLabel.classList.add("itemp");
// tooltip = createTooltip(tooltip, "p", tooltiptext, second, ["spell-tooltip"]);
part_divavg.append(overallhealLabel); part_divavg.append(overallhealLabel);
/*
let effectiveHealLabel = document.createElement("p");
first = document.createElement("b");
second = document.createElement("b");
let defStats = build.getDefenseStats();
tooltiptext = ` = ${heal_amount} * ${defStats[1][0].toFixed(2)} / ${defStats[0]}`;
first.textContent = "Effective Heal: ";
second.textContent = (defStats[1][0]*heal_amount/defStats[0]).toFixed(2);
effectiveHealLabel.appendChild(first);
second.classList.add("Set");
effectiveHealLabel.appendChild(second);
// effectiveHealLabel.classList.add("itemp");
// tooltip = createTooltip(tooltip, "p", tooltiptext, second, ["spell-tooltip"]);
part_divavg.append(effectiveHealLabel);*/
} }
} else if (part.type === "total") { } else if (part.type === "total") {
let total_damage = 0; let total_damage = 0;
@ -1403,15 +1342,11 @@ function displaysq2SpellDamage(parent_elem, overallparent_elem, build, spell, sp
part_div.append(averageLabel); part_div.append(averageLabel);
let overallaverageLabel = document.createElement("p"); let overallaverageLabel = document.createElement("p");
overallaverageLabel.classList.add("damageSubtitle"); let overallaverageLabelFirst = document.createElement("span");
let overallaverageLabelFirst = document.createElement("p"); let overallaverageLabelSecond = document.createElement("span");
let overallaverageLabelSecond = document.createElement("p");
overallaverageLabelFirst.classList.add('no-newline');
overallaverageLabelSecond.classList.add('no-newline');
overallaverageLabelFirst.textContent = "Average: "; overallaverageLabelFirst.textContent = "Average: ";
overallaverageLabelSecond.textContent = total_damage.toFixed(2); overallaverageLabelSecond.textContent = total_damage.toFixed(2);
overallaverageLabelSecond.classList.add("Damage"); overallaverageLabelSecond.classList.add("Damage");
// tooltip = createTooltip(tooltip, "p", tooltiptext, overallaverageLabel, ["spell-tooltip", "summary-tooltip"]);
overallaverageLabel.appendChild(overallaverageLabelFirst); overallaverageLabel.appendChild(overallaverageLabelFirst);

View file

@ -48,9 +48,7 @@ let build_offensive_display_commands = [
]; ];
let build_basic_display_commands = [ let build_basic_display_commands = [
'#table',
'#defense-stats', '#defense-stats',
'#spacer',
// defense stats [hp, ehp, hpr, ] // defense stats [hp, ehp, hpr, ]
// "sPot", // base * atkspd + spell raws // "sPot", // base * atkspd + spell raws
// melee potential // melee potential