Refactor some stuff, add ID editing (no saving)
This commit is contained in:
b
parent
acf7532061
commit
ca179c7c40
6 changed files with 402 additions and 88 deletions
15
build.js
15
build.js
|
|
@ -403,14 +403,10 @@ class Build{
|
|||
}
|
||||
}
|
||||
}
|
||||
statMap.set("poisonPct", 100);
|
||||
|
||||
// The stuff relevant for damage calculation!!! @ferricles
|
||||
statMap.set("atkSpd", this.weapon.get("atkSpd"));
|
||||
statMap.set("damageRaw", [this.weapon.get("nDam"), this.weapon.get("eDam"), this.weapon.get("tDam"), this.weapon.get("wDam"), this.weapon.get("fDam"), this.weapon.get("aDam")]);
|
||||
statMap.set("damageBonus", [statMap.get("eDamPct"), statMap.get("tDamPct"), statMap.get("wDamPct"), statMap.get("fDamPct"), statMap.get("aDamPct")]);
|
||||
statMap.set("defRaw", [statMap.get("eDam"), statMap.get("tDef"), statMap.get("wDef"), statMap.get("fDef"), statMap.get("aDef")]);
|
||||
statMap.set("defBonus", [statMap.get("eDamPct"), statMap.get("tDefPct"), statMap.get("wDefPct"), statMap.get("fDefPct"), statMap.get("aDefPct")]);
|
||||
statMap.set("poisonPct", 100);
|
||||
|
||||
for (const x of skp_elements) {
|
||||
this.externalStats.set(x + "DamPct", 0);
|
||||
|
|
@ -421,6 +417,15 @@ class Build{
|
|||
this.externalStats.set("defBonus",[0, 0, 0, 0, 0]);
|
||||
this.externalStats.set("poisonPct", 0);
|
||||
this.statMap = statMap;
|
||||
|
||||
this.aggregateStats();
|
||||
}
|
||||
|
||||
aggregateStats() {
|
||||
let statMap = this.statMap;
|
||||
statMap.set("damageRaw", [this.weapon.get("nDam"), this.weapon.get("eDam"), this.weapon.get("tDam"), this.weapon.get("wDam"), this.weapon.get("fDam"), this.weapon.get("aDam")]);
|
||||
statMap.set("damageBonus", [statMap.get("eDamPct"), statMap.get("tDamPct"), statMap.get("wDamPct"), statMap.get("fDamPct"), statMap.get("aDamPct")]);
|
||||
statMap.set("defRaw", [statMap.get("eDef"), statMap.get("tDef"), statMap.get("wDef"), statMap.get("fDef"), statMap.get("aDef")]);
|
||||
statMap.set("defBonus", [statMap.get("eDefPct"), statMap.get("tDefPct"), statMap.get("wDefPct"), statMap.get("fDefPct"), statMap.get("aDefPct")]);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
42
builder.js
42
builder.js
|
|
@ -3,7 +3,7 @@ const url_tag = location.hash.slice(1);
|
|||
console.log(url_base);
|
||||
console.log(url_tag);
|
||||
|
||||
const BUILD_VERSION = "6.9.3";
|
||||
const BUILD_VERSION = "6.9.4";
|
||||
|
||||
function setTitle() {
|
||||
document.getElementById("header").textContent = "WynnBuilder version "+BUILD_VERSION+" (db version "+DB_VERSION+")";
|
||||
|
|
@ -19,6 +19,7 @@ let accessoryTypes = [ "ring", "bracelet", "necklace" ];
|
|||
let weaponTypes = [ "wand", "spear", "bow", "dagger", "relik" ];
|
||||
// THIS IS SUPER DANGEROUS, WE SHOULD NOT BE KEEPING THIS IN SO MANY PLACES
|
||||
let item_fields = [ "name", "displayName", "tier", "set", "slots", "type", "material", "drop", "quest", "restrict", "nDam", "fDam", "wDam", "aDam", "tDam", "eDam", "atkSpd", "hp", "fDef", "wDef", "aDef", "tDef", "eDef", "lvl", "classReq", "strReq", "dexReq", "intReq", "defReq", "agiReq", "hprPct", "mr", "sdPct", "mdPct", "ls", "ms", "xpb", "lb", "ref", "str", "dex", "int", "agi", "def", "thorns", "expd", "spd", "atkTier", "poison", "hpBonus", "spRegen", "eSteal", "hprRaw", "sdRaw", "mdRaw", "fDamPct", "wDamPct", "aDamPct", "tDamPct", "eDamPct", "fDefPct", "wDefPct", "aDefPct", "tDefPct", "eDefPct", "fixID", "category", "spPct1", "spRaw1", "spPct2", "spRaw2", "spPct3", "spRaw3", "spPct4", "spRaw4", "rainbowRaw", "sprint", "sprintReg", "jh", "lq", "gXp", "gSpd", "id" ];
|
||||
let editable_item_fields = [ "sdPct", "sdRaw", "mdPct", "mdRaw", "poison", "fDamPct", "wDamPct", "aDamPct", "tDamPct", "eDamPct", "fDefPct", "wDefPct", "aDefPct", "tDefPct", "eDefPct", "hprRaw", "hprPct", "hpBonus", "atkTier", "spPct1", "spRaw1", "spPct2", "spRaw2", "spPct3", "spRaw3", "spPct4", "spRaw4" ];
|
||||
|
||||
let skp_order = ["str","dex","int","def","agi"];
|
||||
let skp_elements = ["e","t","w","f","a"];
|
||||
|
|
@ -470,6 +471,11 @@ function calculateBuild(save_skp, skp){
|
|||
setText(skp_order[i] + "-skp-base", "Original Value: " + skillpoints[i]);
|
||||
}
|
||||
|
||||
for (let id of editable_item_fields) {
|
||||
setValue(id, player_build.statMap.get(id));
|
||||
setText(id+"-base", "Original Value: " + player_build.statMap.get(id));
|
||||
}
|
||||
|
||||
if (save_skp) {
|
||||
// TODO: reduce duplicated code, @updateStats
|
||||
let skillpoints = player_build.total_skillpoints;
|
||||
|
|
@ -582,15 +588,20 @@ function updateStats() {
|
|||
delta_total += delta;
|
||||
}
|
||||
player_build.assigned_skillpoints += delta_total;
|
||||
calculateBuildStats();
|
||||
if(player_build){
|
||||
updatePowderSpecials("skip");
|
||||
updateBoosts("skip");
|
||||
updatePowderSpecials("skip", false);
|
||||
updateBoosts("skip", false);
|
||||
}
|
||||
for (let id of editable_item_fields) {
|
||||
player_build.statMap.set(id, parseInt(getValue(id)));
|
||||
}
|
||||
player_build.aggregateStats();
|
||||
console.log(player_build.statMap);
|
||||
calculateBuildStats();
|
||||
}
|
||||
/* Updates all spell boosts
|
||||
*/
|
||||
function updateBoosts(buttonId) {
|
||||
function updateBoosts(buttonId, recalcStats) {
|
||||
let elem = document.getElementById(buttonId);
|
||||
let name = buttonId.split("-")[0];
|
||||
if(buttonId !== "skip") {
|
||||
|
|
@ -618,12 +629,14 @@ function updateBoosts(buttonId) {
|
|||
}
|
||||
}
|
||||
}
|
||||
if (recalcStats) {
|
||||
calculateBuildStats();
|
||||
}
|
||||
}
|
||||
|
||||
/* Updates all powder special boosts
|
||||
*/
|
||||
function updatePowderSpecials(buttonId){
|
||||
function updatePowderSpecials(buttonId, recalcStats) {
|
||||
//console.log(player_build.statMap);
|
||||
|
||||
let name = (buttonId).split("-")[0];
|
||||
|
|
@ -703,8 +716,10 @@ function updatePowderSpecials(buttonId){
|
|||
}
|
||||
}
|
||||
|
||||
if (recalcStats) {
|
||||
calculateBuildStats();
|
||||
}
|
||||
displayPowderSpecials(document.getElementById("powder-special-stats"), powderSpecials, player_build);
|
||||
calculateBuildStats(); //also make damage boosts apply ;-;
|
||||
}
|
||||
/* Calculates all build statistics and updates the entire display.
|
||||
*/
|
||||
|
|
@ -868,5 +883,18 @@ function resetFields(){
|
|||
calculateBuild();
|
||||
}
|
||||
|
||||
function toggleID() {
|
||||
let button = document.getElementById("show-id-button");
|
||||
let targetDiv = document.getElementById("id-edit");
|
||||
if (button.classList.contains("toggleOn")) { //toggle the pressed button off
|
||||
targetDiv.style.display = "none";
|
||||
button.classList.remove("toggleOn");
|
||||
}
|
||||
else {
|
||||
targetDiv.style.display = "block";
|
||||
button.classList.add("toggleOn");
|
||||
}
|
||||
}
|
||||
|
||||
load_init(init);
|
||||
|
||||
|
|
|
|||
318
index.html
318
index.html
|
|
@ -442,7 +442,7 @@
|
|||
<div class="center" style="grid-column:1;grid-row:1">
|
||||
<div>
|
||||
<label for="str-skp" class="skpLabel" id="str-skp-label">Strength:</label><br>
|
||||
<input class="skp-input" type="string" id="str-skp" name="str-skp" value="0" class="skpInput"/>
|
||||
<input type="string" id="str-skp" name="str-skp" value="0" class="skpInput"/>
|
||||
</div>
|
||||
<div id="str-skp-assign">
|
||||
Manually Assigned: 0
|
||||
|
|
@ -456,7 +456,7 @@
|
|||
<div class="center" style="grid-column:2;grid-row:1">
|
||||
<div>
|
||||
<label for="dex-skp" class="skpLabel" id="dex-skp-label">Dexterity:</label><br>
|
||||
<input class="skp-input" type="string" id="dex-skp" name="dex-skp" value="0" class="skpInput"/>
|
||||
<input type="string" id="dex-skp" name="dex-skp" value="0" class="skpInput"/>
|
||||
</div>
|
||||
<div id="dex-skp-assign">
|
||||
Manually Assigned: 0
|
||||
|
|
@ -470,7 +470,7 @@
|
|||
<div class="center" style="grid-column:3;grid-row:1">
|
||||
<div>
|
||||
<label for="int-skp" class="skpLabel" id="int-skp-label">Intelligence:</label><br>
|
||||
<input class="skp-input" type="string" id="int-skp" name="int-skp" value="0" class="skpInput"/>
|
||||
<input type="string" id="int-skp" name="int-skp" value="0" class="skpInput"/>
|
||||
</div>
|
||||
<div id="int-skp-assign">
|
||||
Manually Assigned: 0
|
||||
|
|
@ -484,7 +484,7 @@
|
|||
<div class="center" style="grid-column:4;grid-row:1">
|
||||
<div>
|
||||
<label for="def-skp" class="skpLabel" id="def-skp-label">Defense:</label><br>
|
||||
<input class="skp-input" type="string" id="def-skp" name="def-skp" value="0" class="skpInput"/>
|
||||
<input type="string" id="def-skp" name="def-skp" value="0" class="skpInput"/>
|
||||
</div>
|
||||
<div id="def-skp-assign">
|
||||
Manually Assigned: 0
|
||||
|
|
@ -498,7 +498,7 @@
|
|||
<div class="center" style="grid-column:5;grid-row:1">
|
||||
<div>
|
||||
<label for="agi-skp" class="skpLabel" id="agi-skp-label">Agility:</label><br>
|
||||
<input class="skp-input" type="string" id="agi-skp" name="agi-skp" value="0" class="skpInput"/>
|
||||
<input type="string" id="agi-skp" name="agi-skp" value="0" class="skpInput"/>
|
||||
</div>
|
||||
<div id="agi-skp-assign">
|
||||
Manually Assigned: 0
|
||||
|
|
@ -510,13 +510,317 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="id-box fade-in" id="id-edit" style="display: none">
|
||||
<div class="id-edit1">
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="sdPct" class="idLabel" id="sdPct-label">Spell Damage %:</label><br>
|
||||
<input type="number" id="sdPct" name="sdPct" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="sdPct-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="sdRaw" class="idLabel" id="sdRaw-label">Spell Damage Raw:</label><br>
|
||||
<input type="number" id="sdRaw" name="sdRaw" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="sdRaw-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="mdPct" class="idLabel" id="mdPct-label">Melee Damage %:</label><br>
|
||||
<input type="number" id="mdPct" name="mdPct" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="mdPct-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="mdRaw" class="idLabel" id="mdRaw-label">Melee Damage Raw:</label><br>
|
||||
<input type="number" id="mdRaw" name="mdRaw" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="mdRaw-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="poison" class="idLabel" id="poison-label">Poison:</label><br>
|
||||
<input type="number" id="poison" name="poison" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="poison-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="eDamPct" class="idLabel" id="eDamPct-label">Earth Damage %:</label><br>
|
||||
<input type="number" id="eDamPct" name="eDamPct" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="eDamPct-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="tDamPct" class="idLabel" id="tDamPct-label">Thunder Damage %:</label><br>
|
||||
<input type="number" id="tDamPct" name="tDamPct" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="tDamPct-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="wDamPct" class="idLabel" id="wDamPct-label">Water Damage %:</label><br>
|
||||
<input type="number" id="wDamPct" name="wDamPct" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="wDamPct-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="fDamPct" class="idLabel" id="fDamPct-label">Fire Damage %:</label><br>
|
||||
<input type="number" id="fDamPct" name="fDamPct" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="fDamPct-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="aDamPct" class="idLabel" id="aDamPct-label">Air Damage %:</label><br>
|
||||
<input type="number" id="aDamPct" name="aDamPct" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="aDamPct-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="eDefPct" class="idLabel" id="eDefPct-label">Earth Defense %:</label><br>
|
||||
<input type="number" id="eDefPct" name="eDefPct" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="eDefPct-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="tDefPct" class="idLabel" id="tDefPct-label">Thunder Defense %:</label><br>
|
||||
<input type="number" id="tDefPct" name="tDefPct" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="tDefPct-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="wDefPct" class="idLabel" id="wDefPct-label">Water Defense %:</label><br>
|
||||
<input type="number" id="wDefPct" name="wDefPct" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="wDefPct-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="fDefPct" class="idLabel" id="fDefPct-label">Fire Defense %:</label><br>
|
||||
<input type="number" id="fDefPct" name="fDefPct" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="fDefPct-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="aDefPct" class="idLabel" id="aDefPct-label">Air Defense %:</label><br>
|
||||
<input type="number" id="aDefPct" name="aDefPct" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="aDefPct-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="id-edit2">
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="hprRaw" class="idLabel" id="hprRaw-label">Health Regen Raw:</label><br>
|
||||
<input type="number" id="hprRaw" name="hprRaw" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="hprRaw-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="hprPct" class="idLabel" id="hprPct-label">Health Regen %:</label><br>
|
||||
<input type="number" id="hprPct" name="hprPct" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="hprPct-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="hpBonus" class="idLabel" id="hpBonus-label">Health Bonus:</label><br>
|
||||
<input type="number" id="hpBonus" name="hpBonus" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="hpBonus-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="atkTier" class="idLabel" id="atkTier-label">Attack Speed Bonus:</label><br>
|
||||
<input type="number" id="atkTier" name="atkTier" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="atkTier-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="spPct1" class="idLabel" id="spPct1-label">1st Spell Cost %:</label><br>
|
||||
<input type="number" id="spPct1" name="spPct1" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="spPct1-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="spPct2" class="idLabel" id="spPct2-label">2nd Spell Cost %:</label><br>
|
||||
<input type="number" id="spPct2" name="spPct2" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="spPct2-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="spPct3" class="idLabel" id="spPct3-label">3rd Spell Cost %:</label><br>
|
||||
<input type="number" id="spPct3" name="spPct3" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="spPct3-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="spPct4" class="idLabel" id="spPct4-label">4th Spell Cost %:</label><br>
|
||||
<input type="number" id="spPct4" name="spPct4" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="spPct4-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="spRaw1" class="idLabel" id="spRaw1-label">1st Spell Cost Raw:</label><br>
|
||||
<input type="number" id="spRaw1" name="spRaw1" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="spRaw1-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="spRaw2" class="idLabel" id="spRaw2-label">2nd Spell Cost Raw:</label><br>
|
||||
<input type="number" id="spRaw2" name="spRaw2" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="spRaw2-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="spRaw3" class="idLabel" id="spRaw3-label">3rd Spell Cost Raw:</label><br>
|
||||
<input type="number" id="spRaw3" name="spRaw3" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="spRaw3-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idCenter">
|
||||
<div class="idWrap">
|
||||
<div>
|
||||
<label for="spRaw4" class="idLabel" id="spRaw4-label">4th Spell Cost Raw:</label><br>
|
||||
<input type="number" id="spRaw4" name="spRaw4" value="0" class="idInput"/>
|
||||
</div>
|
||||
<div id="spRaw4-base">
|
||||
Original Value: 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div class="center">
|
||||
<button class = "button" id = "update-button" onclick = "updateStats()">
|
||||
Update Stats
|
||||
</button>
|
||||
<!--button class = "button" id = "show-id-button" onclick = "showIDs()">
|
||||
<button class = "button" id = "show-id-button" onclick = "toggleID()">
|
||||
Edit IDs
|
||||
</button-->
|
||||
</button>
|
||||
</div>
|
||||
<div class = "build hide-container-grid" style="display: none;">
|
||||
<div class = "center build-helmet" id = "build-helmet" style = "grid-item-1">
|
||||
|
|
|
|||
35
narrow.css
35
narrow.css
|
|
@ -33,40 +33,9 @@
|
|||
max-height: 50px;
|
||||
}
|
||||
|
||||
.skp-input {
|
||||
width: 15vw;
|
||||
.skpInput, .idInput {
|
||||
width: 90%;
|
||||
height: 7vw;
|
||||
max-height: 30px;
|
||||
}
|
||||
|
||||
.hide-container-block {
|
||||
animation-duration: 0.5s;
|
||||
animation-name: fadeInFromNone;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
.hide-container-grid {
|
||||
animation-duration: 0.5s;
|
||||
animation-name: fadeInFromNone;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
.set-info-div {
|
||||
animation-duration: 0.5s;
|
||||
animation-name: fadeInFromNone;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
@keyframes fadeInFromNone {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
1% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
45
styles.css
45
styles.css
|
|
@ -28,7 +28,7 @@ div {
|
|||
grid-template-rows: min-content min-content auto;
|
||||
}
|
||||
|
||||
.skillpoints {
|
||||
.skillpoints, .id-edit1 {
|
||||
padding: 0% 4% 2%;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(5, 1fr);
|
||||
|
|
@ -36,6 +36,14 @@ div {
|
|||
grid-auto-rows: minmax(60px, auto);
|
||||
}
|
||||
|
||||
.id-edit2 {
|
||||
padding: 0% 4% 2%;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 5px;
|
||||
grid-auto-rows: minmax(60px, auto);
|
||||
}
|
||||
|
||||
.powder-specials{
|
||||
padding: 0% 4% 2%;
|
||||
display: grid;
|
||||
|
|
@ -67,6 +75,7 @@ a.link{
|
|||
}
|
||||
.center {
|
||||
text-align: center;
|
||||
position: relative;
|
||||
}
|
||||
table.center{
|
||||
margin: 10px;
|
||||
|
|
@ -83,7 +92,7 @@ table.center{
|
|||
text-align: left;
|
||||
}
|
||||
|
||||
.build-helmet, .build-chestplate, .build-leggings, .build-boots, .build-ring1, .build-ring2, .build-bracelet, .build-necklace, .build-weapon, .build-order, .build-overall, .build-melee-stats, .build-defense-stats, .spell-info, .set-info, .powder-special, .powder-special-stats, .int-info, .crafter, .recipe-stats, .craft-stats, .ing-stats {
|
||||
.build-helmet, .build-chestplate, .build-leggings, .build-boots, .build-ring1, .build-ring2, .build-bracelet, .build-necklace, .build-weapon, .build-order, .build-overall, .build-melee-stats, .build-defense-stats, .spell-info, .set-info, .powder-special, .powder-special-stats, .int-info, .crafter, .recipe-stats, .craft-stats, .ing-stats, .id-box {
|
||||
color: #aaa;
|
||||
background: #121516;
|
||||
border: 3px solid #BCBCBC;
|
||||
|
|
@ -177,11 +186,21 @@ table.center{
|
|||
content: "\2764" ' ';
|
||||
}
|
||||
|
||||
.skpInput, .skplabel {
|
||||
.skplabel {
|
||||
display: block;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.idCenter {
|
||||
text-align: center;
|
||||
padding: 1em 0px 0px 0px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
}
|
||||
.idWrap {
|
||||
align-self: flex-end;
|
||||
}
|
||||
|
||||
/*Scrollbar*/
|
||||
/* width */
|
||||
::-webkit-scrollbar {
|
||||
|
|
@ -301,3 +320,23 @@ button.toggleOn{
|
|||
.externalBuffs {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.hide-container-block, .hide-container-grid, .set-info-div, .fade-in {
|
||||
animation-duration: 0.5s;
|
||||
animation-name: fadeInFromNone;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
@keyframes fadeInFromNone {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
1% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
33
wide.css
33
wide.css
|
|
@ -43,38 +43,7 @@
|
|||
|
||||
}
|
||||
|
||||
.skp-input {
|
||||
.skpInput, .idInput {
|
||||
|
||||
}
|
||||
|
||||
.hide-container-block {
|
||||
animation-duration: 0.5s;
|
||||
animation-name: fadeInFromNone;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
.hide-container-grid {
|
||||
animation-duration: 0.5s;
|
||||
animation-name: fadeInFromNone;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
.set-info-div {
|
||||
animation-duration: 0.5s;
|
||||
animation-name: fadeInFromNone;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
@keyframes fadeInFromNone {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
1% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue