From 76367a065aa58fd6c3be41b473694148811fac49 Mon Sep 17 00:00:00 2001 From: b Date: Sun, 10 Jan 2021 19:42:09 -0600 Subject: [PATCH] Misc. UI fixes, move skillpoint summary up to top of page --- display.js | 28 ++--- index.html | 326 +++++++++++++++++++++++++---------------------------- styles.css | 36 ++++-- test.js | 9 +- 4 files changed, 198 insertions(+), 201 deletions(-) diff --git a/display.js b/display.js index 39525d7..cf52951 100644 --- a/display.js +++ b/display.js @@ -704,31 +704,27 @@ function displayDefenseStats(parent_elem,defenseStats){ //eledefs let eledefs = stats[5]; for (let i = 0; i < eledefs.length; i++){ - let row = document.createElement("tr"); - let eledefElem = document.createElement("p"); - eledefElem.classList.add("itemtable"); - eledefElem.classList.add("itemp"); let eledefElemRow = document.createElement("tr"); - let eledefTitle = document.createElement("td"); + let eledef = document.createElement("td"); + eledef.classList.add("left") + let eledefTitle = document.createElement("b"); eledefTitle.textContent = damageClasses[i+1]; eledefTitle.classList.add(damageClasses[i+1]); - let defense = document.createElement("td"); - defense.textContent = "Defense: "; - defense.classList.add("spaceLeft"); + let defense = document.createElement("b"); + defense.textContent = " Defense: "; + + eledef.appendChild(eledefTitle); + eledef.appendChild(defense); + eledefElemRow.appendChild(eledef); - eledefElemRow.appendChild(eledefTitle); - eledefElemRow.appendChild(defense); - eledefElem.appendChild(eledefElemRow); - //"Defense: "; let boost = document.createElement("td"); boost.textContent = eledefs[i]; boost.classList.add("right"); + eledefElemRow.appendChild(boost); - row.appendChild(eledefElem); - row.appendChild(boost); - statsTable.appendChild(row); + statsTable.appendChild(eledefElemRow); } //skp let defRow = document.createElement("tr"); @@ -862,7 +858,7 @@ function displaySpellDamage(parent_elem, overallparent_elem, build, spell, spell save_damages.push(averageDamage); } else if (part.type == "heal") { - let heal_amount = (part.strength * build.getDefenseStats()[0] * Math.max(0, Math.min(1.5, 1 + 0.05 * stats.get("wDamPct")))).toFixed(2); + let heal_amount = (part.strength * build.getDefenseStats()[0] * Math.max(0, Math.min(1.5, 1 + 0.05 * stats.get("wDamPct")/100))).toFixed(2); let healLabel = document.createElement("p"); healLabel.textContent = heal_amount; healLabel.classList.add("damagep"); diff --git a/index.html b/index.html index 7267e69..1251221 100644 --- a/index.html +++ b/index.html @@ -14,198 +14,175 @@ -
-

Made by hppeng and ferricles with Atlas Inc (JavaScript required to function, nothing works without js)

-

Hard refresh the page (Ctrl+Shift+R on windows/chrome) if it isn't updating correctly.

-
-
- Additional credits -
-
-
- - - - - - - - - - - - + + + + + +
- - - -
-
- - - - - 		-
- X slots -
-
- -
-
-
- - - - - 		-
- X slots -
-
+
+
+
+ + + + + + + + + + + + - - - - + + + + - - - - - - - - - - - - - - - - - - - - + + + + + + + + - - - - - - - - - -
+ + + +
+ + + + + + + +
+ + + + + + - -
-
- - - - - 		-
- X slots -
-
+
+ + + + + + - -
-
- - - - - 		-
- X slots -
-
- -
-
-
- - - - -
-
- - - - -
-
- - - - -
-
- - - - -
-
- - - - - 		-
- X slots -
-
+
+ + + + + + + +
+
+ + + + + 		+
+ - -
-
- - - 		-
-
- - 		-
- -
+
+
+ + 		+
+ +
+
+
+ + + + + + + + + + + + + + + + + + + +
+ +
+ + + + +
+ + + + +
+ + + + +
+ + + + +
+
+ + +
+
+
+

+
+ Summary: +
+
-
+

-
-
-
+
+
melee
-
+
spell1
-
+
spell2
-
+
spell3
-
+
spell4
-
- Summary: -
@@ -341,6 +318,13 @@
Set info
+
+

Made by hppeng and ferricles with Atlas Inc (JavaScript required to function, nothing works without js)

+

Hard refresh the page (Ctrl+Shift+R on windows/chrome) if it isn't updating correctly.

+
+ diff --git a/styles.css b/styles.css index 27999ba..0baf040 100644 --- a/styles.css +++ b/styles.css @@ -1,5 +1,5 @@ .header { - padding: 2%; + padding: 2% 0% 0%; text-align: center; } @@ -12,16 +12,32 @@ th, td { padding-right: 20px; } -.equipment { - padding: 4%; +.nomargin { + padding: 0px; +} + +.summary { + padding: 2% 4% 4%; display: grid; - grid-template-columns: repeat(4, 1fr); - gap: 15px; + grid-template-columns: repeat(5, 1fr); + gap: 5px; grid-auto-rows: minmax(60px, auto); } +div { + padding: 0%; +} + +.equipment { + padding: 0%; + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 5px; + grid-template-rows: min-content auto; +} + .skillpoints { - padding: 4%; + padding: 0% 4% 2%; display: grid; grid-template-columns: repeat(5, 1fr); gap: 5px; @@ -94,10 +110,6 @@ a.link{ width: 94%; margin-bottom: 16px; } -/* VERY BAD. NEED FIX. */ -.spaceLeft { - padding-left: 5px; -} .itemp, .damagep { margin: 2px 2%; @@ -230,7 +242,7 @@ input { display: inline-block; } ::placeholder{ - color: #ddd; + color: #aaa; } /* Tier colors tier colors */ .Normal{ @@ -256,4 +268,4 @@ input { } .restrict{ color: #ff006a; -} \ No newline at end of file +} diff --git a/test.js b/test.js index 82efada..ceadccd 100644 --- a/test.js +++ b/test.js @@ -157,7 +157,12 @@ function init() { for (const item of items) { itemLists.get(item.type).push(item.displayName); itemMap.set(item.displayName, item); - idMap.set(item.id, item.displayName); + if (noneItems.includes(item)) { + idMap.set(item.id, ""); + } + else { + idMap.set(item.id, item.displayName); + } } for (const armorType of armorTypes) { @@ -450,7 +455,7 @@ function calculateBuildStats() { let summarybox = document.getElementById("summary-box"); summarybox.textContent = ""; let skpSummary = document.createElement("p"); - skpSummary.textContent = "Summary: Assigned "+player_build.assigned_skillpoints+" skillpoints."; + skpSummary.textContent = "Summary: Assigned "+player_build.assigned_skillpoints+" skillpoints. Total: ( " + player_build.total_skillpoints.join(" | ") + " )"; skpSummary.classList.add("itemp"); summarybox.append(skpSummary); if(player_build.assigned_skillpoints > levelToSkillPoints(player_build.level)){