formatted with prettier; added lang meta tag

This commit is contained in:
Frederik Palmø 2022-04-12 15:10:10 +02:00
parent 1efe534136
commit 64a40e3b12
5 changed files with 1670 additions and 1486 deletions

View File

@ -1,229 +1,239 @@
<!DOCTYPE html>
<html>
<head>
<!-- metadata -->
<meta charset="utf-8" />
<meta name="language" content="english" />
<meta http-equiv="content-language" content="en-us" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="style/main.css" />
<!-- title and description -->
<title>Armor Optimizer - Erdtree</title>
<link rel="icon" type="image/x-icon " href="/resource/favicon.ico" />
<meta
name="description"
content="Armor Optimizer for Elden Ring - Find the best gear for defenses, resistances and poise!"
/>
<meta name="author" content="vodofrede" />
<meta property="og:title" content="Armor Optimizer - Erdtree" />
<meta
property="og:description"
content="Armor Optimizer for Elden Ring - Find the best gear for defenses, resistances and poise!"
/>
<meta property="og:url" content="https://erdtree.palmoe.dk/armor" />
<!-- scripts -->
<script src="/script/armor.js"></script>
</head>
<head>
<!-- metadata -->
<meta charset="utf-8" />
<meta name="language" content="english" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="style/main.css" />
<!-- title and description -->
<title>Armor Optimizer - Erdtree</title>
<link rel="icon" type="image/x-icon " href="/resource/favicon.ico">
<meta name="description"
content="Armor Optimizer for Elden Ring - Find the best gear for defenses, resistances and poise!" />
<meta name="author" content="vodofrede">
<meta property="og:title" content="Armor Optimizer - Erdtree" />
<meta property="og:description"
content="Armor Optimizer for Elden Ring - Find the best gear for defenses, resistances and poise!" />
<meta property="og:url" content="https://erdtree.palmoe.dk/armor" />
<!-- scripts -->
<script src="/script/armor.js"></script>
</head>
<body onload="init();">
<nav>
<h2><a href="/">Elden Ring Build Planner</a></h2>
<ul>
<li><a href="/planner.html">Build Planner</a></li>
</ul>
</nav>
<header>
<h1>Armor Optimizer</h1>
</header>
<main>
<div class="app">
<!-- settings -->
<article style="flex-basis: 25%">
<b>Settings</b>
<hr />
<div>
<label for="max-equip-load">Max. Equip Load</label>
<input style="max-width: 50px" class="stat"
id="max-equip-load" type="number" onchange="update()"
min="0" step="0.1" value="30" name="equip-load"
lang="en" />
</div>
<div>
<label for="current-equip-load">Current Equip Load</label>
<input style="max-width: 50px" class="stat"
id="current-equip-load" type="number"
onchange="update()" min="0" step="0.1" value="0"
name="equip-load" lang="en" />
</div>
<div>
<label for="equip-load-budget">Equip Load Budget</label>
<input style="max-width: 50px" class="stat"
id="equip-load-budget" type="number" value="0"
name="equip-load" lang="en" disabled />
</div>
<hr />
<b>Breakpoints</b>
<div>
<body onload="init();">
<nav>
<h2><a href="/">Elden Ring Build Planner</a></h2>
<ul>
<li><a href="/planner.html">Build Planner</a></li>
</ul>
</nav>
<header>
<h1>Armor Optimizer</h1>
</header>
<main>
<div class="app">
<!-- settings -->
<article style="flex-basis: 25%">
<b>Settings</b>
<hr />
<div>
<input type="radio" id="fast-roll" onclick="update()"
name="roll-type" value="0.3" />
<label for="fast-roll">Fast Roll (up to 30% equip
load)</label>
<label for="max-equip-load">Max. Equip Load</label>
<input
style="max-width: 50px"
class="stat"
id="max-equip-load"
type="number"
onchange="update()"
min="0"
step="0.1"
value="30"
name="equip-load"
lang="en"
/>
</div>
</div>
<div>
<div>
<input type="radio" id="normal-roll" onclick="update()"
name="roll-type" value="0.7" checked />
<label for="normal-roll">Normal Roll (up to 70% equip
load)</label>
<label for="current-equip-load">Current Equip Load</label>
<input
style="max-width: 50px"
class="stat"
id="current-equip-load"
type="number"
onchange="update()"
min="0"
step="0.1"
value="0"
name="equip-load"
lang="en"
/>
</div>
</div>
<div>
<div>
<input type="radio" id="fat-roll" onclick="update()"
name="roll-type" value="1.0" />
<label for="fat-roll">Fat Roll (up to 100% equip
load)</label>
<label for="equip-load-budget">Equip Load Budget</label>
<input
style="max-width: 50px"
class="stat"
id="equip-load-budget"
type="number"
value="0"
name="equip-load"
lang="en"
disabled
/>
</div>
</div>
<hr />
<b>Sort by</b>
<div>
<hr />
<b>Breakpoints</b>
<div>
<input type="radio" id="sort-average"
name="sorting-order" onclick="update()" />
<label for="sort-average">Greatest Average
Negation</label>
<div>
<input type="radio" id="fast-roll" onclick="update()" name="roll-type" value="0.3" />
<label for="fast-roll">Fast Roll (up to 30% equip load)</label>
</div>
</div>
</div>
<div>
<div>
<input type="radio" id="sort-physical"
name="sorting-order" onclick="update()" checked />
<label for="sort-physical">Greatest Physical
Negation</label>
<div>
<input
type="radio"
id="normal-roll"
onclick="update()"
name="roll-type"
value="0.7"
checked
/>
<label for="normal-roll">Normal Roll (up to 70% equip load)</label>
</div>
</div>
</div>
<div>
<div>
<input type="radio" id="sort-elemental"
name="sorting-order" onclick="update()" />
<label for="sort-elemental">Greatest Elemental
Negation</label>
<div>
<input type="radio" id="fat-roll" onclick="update()" name="roll-type" value="1.0" />
<label for="fat-roll">Fat Roll (up to 100% equip load)</label>
</div>
</div>
</div>
<div>
<hr />
<b>Sort by</b>
<div>
<input type="radio" id="sort-resistances"
name="sorting-order" onclick="update()" />
<label for="sort-resistances">Greatest
Resistances</label>
<div>
<input type="radio" id="sort-average" name="sorting-order" onclick="update()" />
<label for="sort-average">Greatest Average Negation</label>
</div>
</div>
</div>
<div>
<div>
<input type="radio" id="sort-poise" name="sorting-order"
onclick="update()" />
<label for="sort-poise">Greatest Poise</label>
<div>
<input type="radio" id="sort-physical" name="sorting-order" onclick="update()" checked />
<label for="sort-physical">Greatest Physical Negation</label>
</div>
</div>
</div>
<hr />
<b>Extras</b>
<div>
<div>
<input type="checkbox" id="winged-crystal-tear"
onchange="update()" disabled />
<label for="winged-crystal-tear">Winged Crystal Tear (in
mixed physick)</label>
<div>
<input type="radio" id="sort-elemental" name="sorting-order" onclick="update()" />
<label for="sort-elemental">Greatest Elemental Negation</label>
</div>
</div>
</div>
<div>
<div>
<input type="checkbox" id="fashion" onchange="update()"
disabled />
<label for="fashion">Fashion Mode</label>
<div>
<input type="radio" id="sort-resistances" name="sorting-order" onclick="update()" />
<label for="sort-resistances">Greatest Resistances</label>
</div>
</div>
</div>
<hr />
<b>Locked Armor</b>
<template id="locked-option">
<option value="">Placeholder</option>
</template>
<div>
<label for="locked-helmet">Helmet</label>
<select type="text" id="locked-helmet" name="locked-items"
onchange="update()"></select>
</div>
<div>
<label for="locked-chestpiece">Chestpiece</label>
<select type="text" id="locked-chestpiece"
name="locked-items" onchange="update()"></select>
</div>
<div>
<label for="locked-gauntlets">Gauntlets</label>
<select type=" text" id="locked-gauntlets"
name="locked-items" onchange="update()"></select>
</div>
<div>
<label for="locked-leggings">Leggings</label>
<select type="text" id="locked-leggings" name="locked-items"
onchange="update()"></select>
</div>
<div>
<button id="clear-equipment" onclick="resetAll()">Reset
All</button>
</div>
</article>
<!-- sort -->
<article style="flex-basis: 60%; min-width: 320px">
<b>Results</b>
<hr />
<div>
<table id="results"></table>
</div>
<template id="result">
<thead>
<tr>
<th>Armor</th>
<th>Stats</th>
</tr>
</thead>
<tbody>
<tr>
<td>Total</td>
<td>Stats</td>
</tr>
<tr>
<td>Helmet</td>
<td>Stats</td>
</tr>
<tr>
<td>Chestpiece</td>
<td>Stats</td>
</tr>
<tr>
<td>Gaunlets</td>
<td>Stats</td>
</tr>
<tr>
<td>Leggings</td>
<td>Stats</td>
</tr>
</tbody>
</template>
</article>
<!-- filter -->
<article>
<b>Allowed Armor</b>
<p>(Under development)</p>
</article>
</div>
</main>
<footer>
<h5>
Erdtree Planner (<a
href="https://git.palmoe.dk/vodofrede/erdtree">available under
BSD-3-Clause license</a>)
</h5>
<h5>Copyright 2022 vodofrede</h5>
</footer>
</body>
</html>
<div>
<div>
<input type="radio" id="sort-poise" name="sorting-order" onclick="update()" />
<label for="sort-poise">Greatest Poise</label>
</div>
</div>
<hr />
<b>Extras</b>
<div>
<div>
<input type="checkbox" id="winged-crystal-tear" onchange="update()" disabled />
<label for="winged-crystal-tear">Winged Crystal Tear (in mixed physick)</label>
</div>
</div>
<div>
<div>
<input type="checkbox" id="fashion" onchange="update()" disabled />
<label for="fashion">Fashion Mode</label>
</div>
</div>
<hr />
<b>Locked Armor</b>
<template id="locked-option">
<option value="">Placeholder</option>
</template>
<div>
<label for="locked-helmet">Helmet</label>
<select type="text" id="locked-helmet" name="locked-items" onchange="update()"></select>
</div>
<div>
<label for="locked-chestpiece">Chestpiece</label>
<select type="text" id="locked-chestpiece" name="locked-items" onchange="update()"></select>
</div>
<div>
<label for="locked-gauntlets">Gauntlets</label>
<select type=" text" id="locked-gauntlets" name="locked-items" onchange="update()"></select>
</div>
<div>
<label for="locked-leggings">Leggings</label>
<select type="text" id="locked-leggings" name="locked-items" onchange="update()"></select>
</div>
<div>
<button id="clear-equipment" onclick="resetAll()">Reset All</button>
</div>
</article>
<!-- sort -->
<article style="flex-basis: 60%; min-width: 320px">
<b>Results</b>
<hr />
<div>
<table id="results"></table>
</div>
<template id="result">
<thead>
<tr>
<th>Armor</th>
<th>Stats</th>
</tr>
</thead>
<tbody>
<tr>
<td>Total</td>
<td>Stats</td>
</tr>
<tr>
<td>Helmet</td>
<td>Stats</td>
</tr>
<tr>
<td>Chestpiece</td>
<td>Stats</td>
</tr>
<tr>
<td>Gaunlets</td>
<td>Stats</td>
</tr>
<tr>
<td>Leggings</td>
<td>Stats</td>
</tr>
</tbody>
</template>
</article>
<!-- filter -->
<article>
<b>Allowed Armor</b>
<p>(Under development)</p>
</article>
</div>
</main>
<footer>
<h5>
Erdtree Planner (<a href="https://git.palmoe.dk/vodofrede/erdtree"
>available under BSD-3-Clause license</a
>)
</h5>
<h5>Copyright 2022 vodofrede</h5>
</footer>
</body>
</html>

View File

@ -1,306 +1,287 @@
<!DOCTYPE html>
<html>
<head>
<!-- metadata -->
<meta charset="utf-8" />
<meta name="language" content="english" />
<meta http-equiv="content-language" content="en-us" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="style/main.css" />
<!-- title and description -->
<title>Class Optimizer - Erdtree</title>
<link rel="icon" type="image/x-icon " href="/resource/favicon.ico" />
<meta
name="description"
content="Starting Class Optimizer for Elden Ring - Including Equipment (Talismans and Helmets)"
/>
<meta name="author" content="vodofrede" />
<meta property="og:title" content="Class Optimizer - Erdtree" />
<meta
property="og:description"
content="Starting Class Optimizer for Elden Ring - Including Equipment (Talismans and Helmets)"
/>
<meta property="og:url" content="https://erdtree.palmoe.dk/class" />
<!-- scripts -->
<script src="/script/class.js"></script>
</head>
<head>
<!-- metadata -->
<meta charset="utf-8" />
<meta name="language" content="english" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="style/main.css" />
<!-- title and description -->
<title>Class Optimizer - Erdtree</title>
<link rel="icon" type="image/x-icon " href="/resource/favicon.ico">
<meta name="description"
content="Starting Class Optimizer for Elden Ring - Including Equipment (Talismans and Helmets)" />
<meta name="author" content="vodofrede">
<meta property="og:title" content="Class Optimizer - Erdtree" />
<meta property="og:description"
content="Starting Class Optimizer for Elden Ring - Including Equipment (Talismans and Helmets)" />
<meta property="og:url" content="https://erdtree.palmoe.dk/class" />
<!-- scripts -->
<script src="/script/class.js"></script>
</head>
<body onload="init();">
<nav>
<h2><a href="/">Elden Ring Build Planner</a></h2>
<ul>
<a href="/planner.html">Build Planner</a>
</ul>
</nav>
<header>
<h1>Class Optimizer</h1>
</header>
<main>
<div class="app">
<article>
<div>
<b>Class</b>
<input id="best" type="text" disabled />
</div>
<hr />
<template id="class">
<body onload="init();">
<nav>
<h2><a href="/">Elden Ring Build Planner</a></h2>
<ul>
<a href="/planner.html">Build Planner</a>
</ul>
</nav>
<header>
<h1>Class Optimizer</h1>
</header>
<main>
<div class="app">
<article>
<div>
<b>Class</b>
<input id="best" type="text" disabled />
</div>
<hr />
<template id="class">
<li>
<span></span>
<aside></aside>
</li>
</template>
<div>
<ul id="classes"></ul>
</div>
</article>
<article>
<div>
<b>Level</b>
<div>
<input id="initial-level" type="number" disabled />
<input type="number" style="visibility: hidden" disabled />
<input id="final-level" type="number" disabled />
<input id="virtual-level" type="number" disabled />
</div>
</div>
<hr />
<div>
<label for="vigor">Vigor</label>
<div>
<input type="number" name="initial" disabled />
<input id="vigor" type="number" name="total" min="0" max="99" oninput="update()" />
<input type="number" name="final" disabled />
<input type="number" name="virtual" disabled />
</div>
</div>
<div>
<label for="mind">Mind</label>
<div>
<input type="number" name="initial" disabled />
<input id="mind" type="number" name="total" min="0" max="99" oninput="update()" />
<input type="number" name="final" disabled />
<input type="number" name="virtual" disabled />
</div>
</div>
<div>
<label for="endurance">Endurance</label>
<div>
<input type="number" name="initial" disabled />
<input id="endurance" type="number" name="total" min="0" max="99" oninput="update()" />
<input type="number" name="final" disabled />
<input type="number" name="virtual" disabled />
</div>
</div>
<div>
<label for="strength">Strength</label>
<div>
<input type="number" name="initial" disabled />
<input id="strength" type="number" name="total" min="0" max="99" oninput="update()" />
<input type="number" name="final" disabled />
<input type="number" name="virtual" disabled />
</div>
</div>
<div>
<label for="dexterity">Dexterity</label>
<div>
<input type="number" name="initial" disabled />
<input id="dexterity" type="number" name="total" min="0" max="99" oninput="update()" />
<input type="number" name="final" disabled />
<input type="number" name="virtual" disabled />
</div>
</div>
<div>
<label for="intelligence">Intelligence</label>
<div>
<input type="number" name="initial" disabled />
<input id="intelligence" type="number" name="total" min="0" max="99" oninput="update()" />
<input type="number" name="final" disabled />
<input type="number" name="virtual" disabled />
</div>
</div>
<div>
<label for="faith">Faith</label>
<div>
<input type="number" name="initial" disabled />
<input id="faith" type="number" name="total" min="0" max="99" oninput="update()" />
<input type="number" name="final" disabled />
<input type="number" name="virtual" disabled />
</div>
</div>
<div>
<label for="arcane">Arcane</label>
<div>
<input type="number" name="initial" disabled />
<input id="arcane" type="number" name="total" min="0" max="99" oninput="update()" />
<input type="number" name="final" disabled />
<input type="number" name="virtual" disabled />
</div>
</div>
</article>
<article>
<div>
<label>
<b>Helmet</b>
</label>
<select id="helmet" name="equipment" onchange="update()">
<option id="none" value="none">No Helmet</option>
</select>
</div>
<hr />
<div>
<ul id="talismans">
<template id="talisman">
<li>
<div>
<input name="talisman" type="checkbox" onchange="update()" />
<label></label>
</div>
<aside></aside>
</li>
</template>
</ul>
</div>
<div>
<button onclick="resetAll()">Reset All</button>
</div>
</article>
</div>
<div>
<h2 style="text-align: center">Explanation & Usage</h2>
<p>The four columns in the second box represent, in order:</p>
<ol>
<li>Class base stats, e.g. the stats the class has at its base level.</li>
<li>
<span></span>
<aside></aside>
Desired stats. Here, you should input what the absolute minimum stats for your build should be.
Leave the input fields blank for stats you don't care about.
</li>
</template>
<div>
<ul id="classes"></ul>
</div>
</article>
<article>
<div>
<b>Level</b>
<div>
<input id="initial-level" type="number" disabled />
<input type="number" style="visibility: hidden"
disabled />
<input id="final-level" type="number" disabled />
<input id="virtual-level" type="number" disabled />
</div>
</div>
<hr />
<div>
<label for="vigor">Vigor</label>
<div>
<input type="number" name="initial" disabled />
<input id="vigor" type="number" name="total" min="0"
max="99" oninput="update()" />
<input type="number" name="final" disabled />
<input type="number" name="virtual" disabled />
</div>
</div>
<div>
<label for="mind">Mind</label>
<div>
<input type="number" name="initial" disabled />
<input id="mind" type="number" name="total" min="0"
max="99" oninput="update()" />
<input type="number" name="final" disabled />
<input type="number" name="virtual" disabled />
</div>
</div>
<div>
<label for="endurance">Endurance</label>
<div>
<input type="number" name="initial" disabled />
<input id="endurance" type="number" name="total" min="0"
max="99" oninput="update()" />
<input type="number" name="final" disabled />
<input type="number" name="virtual" disabled />
</div>
</div>
<div>
<label for="strength">Strength</label>
<div>
<input type="number" name="initial" disabled />
<input id="strength" type="number" name="total" min="0"
max="99" oninput="update()" />
<input type="number" name="final" disabled />
<input type="number" name="virtual" disabled />
</div>
</div>
<div>
<label for="dexterity">Dexterity</label>
<div>
<input type="number" name="initial" disabled />
<input id="dexterity" type="number" name="total" min="0"
max="99" oninput="update()" />
<input type="number" name="final" disabled />
<input type="number" name="virtual" disabled />
</div>
</div>
<div>
<label for="intelligence">Intelligence</label>
<div>
<input type="number" name="initial" disabled />
<input id="intelligence" type="number" name="total"
min="0" max="99" oninput="update()" />
<input type="number" name="final" disabled />
<input type="number" name="virtual" disabled />
</div>
</div>
<div>
<label for="faith">Faith</label>
<div>
<input type="number" name="initial" disabled />
<input id="faith" type="number" name="total" min="0"
max="99" oninput="update()" />
<input type="number" name="final" disabled />
<input type="number" name="virtual" disabled />
</div>
</div>
<div>
<label for="arcane">Arcane</label>
<div>
<input type="number" name="initial" disabled />
<input id="arcane" type="number" name="total" min="0"
max="99" oninput="update()" />
<input type="number" name="final" disabled />
<input type="number" name="virtual" disabled />
</div>
</div>
</article>
<article>
<div>
<label>
<b>Helmet</b>
</label>
<select id="helmet" name="equipment" onchange="update()">
<option id="none" value="none">No Helmet</option>
</select>
</div>
<hr />
<div>
<ul id="talismans">
<template id="talisman">
<li>
<div>
<input name="talisman" type="checkbox"
onchange="update()" />
<label></label>
</div>
<aside></aside>
</li>
</template>
</ul>
</div>
<div>
<button onclick="resetAll()">Reset All</button>
</div>
</article>
</div>
<div>
<h2 style="text-align: center">Explanation & Usage</h2>
<p>
The four columns in the second box represent, in order:
</p>
<ol>
<li>
Class base stats, e.g. the stats the class has at its base
level.
</li>
<li>
Desired stats. Here, you should input what the absolute
minimum stats for your build should be. Leave the input
fields blank for stats you don't care about.
</li>
<li>
Final stats. These are your characters stats as they should
appear on your level-up screen.
</li>
<li>
Virtual stats. These are your characters stats after
talismans and helmet stat buffs are applied.
</li>
</ol>
</div>
<div>
<h2 style="text-align: center">Softcaps</h2>
<table>
<thead>
<tr>
<th>Skill</th>
<th>Stat</th>
<th>Softcaps</th>
<th>Notes</th>
</tr>
</thead>
<tbody>
<tr>
<td>Vigor</td>
<td>HP</td>
<td>25 (800HP)<br />40 (1450HP)<br />60 (1900HP)</td>
<td>A +12 upgraded crimson flask heals for 810HP.</td>
</tr>
<tr>
<td>Mind</td>
<td>FP</td>
<td>40 (220FP)</td>
<td>A +12 upgraded cerulean flask gives 220FP.</td>
</tr>
<tr>
<td>Endurance</td>
<td>Stamina</td>
<td>30 (125stm.)<br />50 (155stm.)</td>
<td></td>
</tr>
<tr>
<td></td>
<td>Equip Load</td>
<td>25 (72 wgt.)<br />60 (120 wgt.)</td>
<td></td>
</tr>
<tr>
<td>Strength</td>
<td>AR</td>
<td>37 ≃ 55 (2h)<br />54 ≃ 80 (2h)<br />66 ≃ 99
(2h)<br />80
</td>
<td>2-handing gives you 1.5x strength.</td>
</tr>
<tr>
<td>Dexterity</td>
<td>AR</td>
<td>55, 80</td>
<td></td>
</tr>
<tr>
<td>Intelligence</td>
<td>AR</td>
<td>55, 80</td>
<td></td>
</tr>
<tr>
<td></td>
<td>Spell Buff</td>
<td>60, 80</td>
<td></td>
</tr>
<tr>
<td>Faith</td>
<td>AR</td>
<td>55, 80</td>
<td></td>
</tr>
<tr>
<td></td>
<td>Spell Buff</td>
<td>60, 80</td>
<td></td>
</tr>
<tr>
<td>Arcane</td>
<td>AR</td>
<td>55, 80</td>
<td></td>
</tr>
<tr>
<td></td>
<td>Status</td>
<td>45, 60</td>
<td></td>
</tr>
<tr>
<td></td>
<td>Spell Buff</td>
<td>60, 80 (Pure catalyst)<br />30, 45 (Hybrid catalyst)
</td>
<td></td>
</tr>
</tbody>
</table>
</div>
</main>
<footer>
<h5>
Erdtree Planner (<a
href="https://git.palmoe.dk/vodofrede/erdtree">available under
BSD-3-Clause license</a>)
</h5>
<h5>Copyright 2022 vodofrede</h5>
</footer>
</body>
</html>
<li>Final stats. These are your characters stats as they should appear on your level-up screen.</li>
<li>
Virtual stats. These are your characters stats after talismans and helmet stat buffs are
applied.
</li>
</ol>
</div>
<div>
<h2 style="text-align: center">Softcaps</h2>
<table>
<thead>
<tr>
<th>Skill</th>
<th>Stat</th>
<th>Softcaps</th>
<th>Notes</th>
</tr>
</thead>
<tbody>
<tr>
<td>Vigor</td>
<td>HP</td>
<td>25 (800HP)<br />40 (1450HP)<br />60 (1900HP)</td>
<td>A +12 upgraded crimson flask heals for 810HP.</td>
</tr>
<tr>
<td>Mind</td>
<td>FP</td>
<td>40 (220FP)</td>
<td>A +12 upgraded cerulean flask gives 220FP.</td>
</tr>
<tr>
<td>Endurance</td>
<td>Stamina</td>
<td>30 (125stm.)<br />50 (155stm.)</td>
<td></td>
</tr>
<tr>
<td></td>
<td>Equip Load</td>
<td>25 (72 wgt.)<br />60 (120 wgt.)</td>
<td></td>
</tr>
<tr>
<td>Strength</td>
<td>AR</td>
<td>37 ≃ 55 (2h)<br />54 ≃ 80 (2h)<br />66 ≃ 99 (2h)<br />80</td>
<td>2-handing gives you 1.5x strength.</td>
</tr>
<tr>
<td>Dexterity</td>
<td>AR</td>
<td>55, 80</td>
<td></td>
</tr>
<tr>
<td>Intelligence</td>
<td>AR</td>
<td>55, 80</td>
<td></td>
</tr>
<tr>
<td></td>
<td>Spell Buff</td>
<td>60, 80</td>
<td></td>
</tr>
<tr>
<td>Faith</td>
<td>AR</td>
<td>55, 80</td>
<td></td>
</tr>
<tr>
<td></td>
<td>Spell Buff</td>
<td>60, 80</td>
<td></td>
</tr>
<tr>
<td>Arcane</td>
<td>AR</td>
<td>55, 80</td>
<td></td>
</tr>
<tr>
<td></td>
<td>Status</td>
<td>45, 60</td>
<td></td>
</tr>
<tr>
<td></td>
<td>Spell Buff</td>
<td>60, 80 (Pure catalyst)<br />30, 45 (Hybrid catalyst)</td>
<td></td>
</tr>
</tbody>
</table>
</div>
</main>
<footer>
<h5>
Erdtree Planner (<a href="https://git.palmoe.dk/vodofrede/erdtree"
>available under BSD-3-Clause license</a
>)
</h5>
<h5>Copyright 2022 vodofrede</h5>
</footer>
</body>
</html>

View File

@ -4,6 +4,7 @@
<!-- metadata -->
<meta charset="utf-8" />
<meta name="language" content="english" />
<meta http-equiv="content-language" content="en-us" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="msvalidate.01" content="F5D21B696FD2830A4E6329F257394DBC" />
<link rel="stylesheet" href="style/main.css" />

View File

@ -1,283 +1,250 @@
<!DOCTYPE html>
<html>
<head>
<!-- metadata -->
<meta charset="utf-8" />
<meta name="language" content="english" />
<meta http-equiv="content-language" content="en-us" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="style/main.css" />
<!-- title and description -->
<title>Build Planner - Erdtree</title>
<link rel="icon" type="image/x-icon " href="/resource/favicon.ico" />
<meta name="description" content="Build Planner for Elden Ring - With import and export" />
<meta name="author" content="vodofrede" />
<meta property="og:title" content="Build Planner - Erdtree" />
<meta property="og:description" content="Build Planner for Elden Ring - With import and export" />
<meta property="og:url" content="https://erdtree.palmoe.dk/planner" />
<!-- scripts -->
<script src="script/planner.js"></script>
</head>
<head>
<!-- metadata -->
<meta charset="utf-8" />
<meta name="language" content="english" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="style/main.css" />
<!-- title and description -->
<title>Build Planner - Erdtree</title>
<link rel="icon" type="image/x-icon " href="/resource/favicon.ico">
<meta name="description"
content="Build Planner for Elden Ring - With import and export" />
<meta name="author" content="vodofrede">
<meta property="og:title" content="Build Planner - Erdtree" />
<meta property="og:description"
content="Build Planner for Elden Ring - With import and export" />
<meta property="og:url" content="https://erdtree.palmoe.dk/planner" />
<!-- scripts -->
<script src="script/planner.js"></script>
</head>
<body onload="init()">
<nav>
<h2><a href="/">Elden Ring Build Planner</a></h2>
<ul>
<li><a href="/planner.html">Build Planner</a></li>
</ul>
</nav>
<header>
<h1>Build Planner</h1>
</header>
<main>
<div class="app">
<!-- Class -->
<article style="flex-basis: 20%; max-width: 320px">
<div>
<b>Character</b>
</div>
<hr />
<div>
<b>Name</b>
<input id="name" />
</div>
<div>
<label for="class"><b>Starting Class</b></label>
<body onload="init()">
<nav>
<h2><a href="/">Elden Ring Build Planner</a></h2>
<ul>
<li><a href="/planner.html">Build Planner</a></li>
</ul>
</nav>
<header>
<h1>Build Planner</h1>
</header>
<main>
<div class="app">
<!-- Class -->
<article style="flex-basis: 20%; max-width: 320px">
<div>
<select id="class" onchange="update()">
<option id="wretch" selected>Wretch</option>
<option id="vagabond">Vagabond</option>
<option id="warrior">Warrior</option>
<option id="hero">Hero</option>
<option id="bandit">Bandit</option>
<option id="astrologer">Astrologer</option>
<option id="prophet">Prophet</option>
<option id="samurai">Samurai</option>
<option id="prisoner">Prisoner</option>
<option id="confessor">Confessor</option>
</select>
<b>Character</b>
</div>
</div>
<div>
<label><b>Level</b></label>
<span>
<input type="number" id="final-level" disabled />
</span>
</div>
<div>
<label for="vigor">Vigor</label>
<span>
<input type="number" id="vigor" name="final" min="0"
max="99" onchange="update()" />
</span>
</div>
<div>
<label for="mind">Mind</label>
<span>
<input type="number" id="mind" name="final" min="0"
max="99" onchange="update()" />
</span>
</div>
<div>
<label for="endurance">Endurance</label>
<span>
<input type="number" id="endurance" name="final" min="0"
max="99" onchange="update()" />
</span>
</div>
<div>
<label for="strength">Strength</label>
<span>
<input type="number" id="strength" name="final" min="0"
max="99" onchange="update()" />
</span>
</div>
<div>
<label for="dexterity">Dexterity</label>
<span>
<input type="number" id="dexterity" name="final" min="0"
max="99" onchange="update()" />
</span>
</div>
<div>
<label for="intelligence">Intelligence</label>
<span>
<input type="number" id="intelligence" name="final"
min="0" max="99" onchange="update()" />
</span>
</div>
<div>
<label for="faith">Faith</label>
<span>
<input type="number" id="faith" name="final" min="0"
max="99" onchange="update()" />
</span>
</div>
<div>
<label for="arcane">Arcane</label>
<span>
<input type="number" id="arcane" name="final" min="0"
max="99" onchange="update()" />
</span>
</div>
<hr />
<b>Import</b>
<div>
<input type="file" />
</div>
<hr />
<b>Export</b>
<div>
<button>Export</button>
</div>
</article>
<!-- equipment -->
<article style="flex-basis: 20%; max-width: 450px">
<b>Equipment</b>
<hr />
<b>Weapons & Shields</b>
<template id="picker">
<div class="popup">
<input type="image" src="/resource/icon/standard.jpg"
height="20px" />
</div>
</template>
<div>
<hr />
<div>
<b>Name</b>
<input id="name" />
</div>
<div>
<label for="class"><b>Starting Class</b></label>
<div>
<select id="class" onchange="update()">
<option id="wretch" selected>Wretch</option>
<option id="vagabond">Vagabond</option>
<option id="warrior">Warrior</option>
<option id="hero">Hero</option>
<option id="bandit">Bandit</option>
<option id="astrologer">Astrologer</option>
<option id="prophet">Prophet</option>
<option id="samurai">Samurai</option>
<option id="prisoner">Prisoner</option>
<option id="confessor">Confessor</option>
</select>
</div>
</div>
<div>
<label><b>Level</b></label>
<span>
<select id="lh1" name="weapon"
onchange="update()"></select>
</span>
<span>
<img id="lh1-img" src="/resource/icon/standard.jpg"
width="20px" />
<select id="lh1-infusion" name="infusion"></select>
<input type="number" id="final-level" disabled />
</span>
</div>
<div>
<label for="vigor">Vigor</label>
<span>
<select id="rh1" name="weapon"
onchange="update()"></select>
</span>
<span>
<select id="rh1-infusion" name="infusion"></select>
<img id="rh1-img" src="/resource/icon/standard.jpg"
width="20px" />
</span>
</div>
</div>
<div>
<div>
<span>
<select id="lh2" name="weapon"
onchange="update()"></select>
</span>
<span>
<img id="lh2-img" src="/resource/icon/standard.jpg"
width="20px" />
<select id="lh2-infusion" name="infusion"></select>
<input type="number" id="vigor" name="final" min="0" max="99" onchange="update()" />
</span>
</div>
<div>
<label for="mind">Mind</label>
<span>
<select id="rh2" name="weapon"
onchange="update()"></select>
</span>
<span>
<select id="rh2-infusion" name="infusion"></select>
<img id="rh2-img" src="/resource/icon/standard.jpg"
width="20px" />
</span>
</div>
</div>
<div>
<div>
<span>
<select id="lh3" name="weapon"
onchange="update()"></select>
</span>
<span>
<img id="lh3-img" src="/resource/icon/standard.jpg"
width="20px" />
<select id="lh3-infusion" name="infusion"></select>
<input type="number" id="mind" name="final" min="0" max="99" onchange="update()" />
</span>
</div>
<div>
<label for="endurance">Endurance</label>
<span>
<select id="rh3" name="weapon"
onchange="update()"></select>
</span>
<span>
<select id="rh3-infusion" name="infusion"></select>
<img id="rh3-img" src="/resource/icon/standard.jpg"
width="20px" />
<input type="number" id="endurance" name="final" min="0" max="99" onchange="update()" />
</span>
</div>
</div>
<hr />
<b>Armor</b>
<div>
<label>Helmet</label>
<select id="helmet" name="armor"
onchange="update()"></select>
</div>
<div>
<label>Chestpiece</label>
<select id="chestpiece" name="armor"
onchange="update()"></select>
</div>
<div>
<label>Gauntlets</label>
<select id="gauntlets" name="armor"
onchange="update()"></select>
</div>
<div>
<label>Leggings</label>
<select id="leggings" name="armor"
onchange="update()"></select>
</div>
<hr />
<li><b>Talismans</b></li>
<div>
<label>Talisman #1</label>
<select id="talisman-1" name="talisman"
onchange="update()"></select>
</div>
<div>
<label>Talisman #2</label>
<select id="talisman-2" name="talisman"
onchange="update()"></select>
</div>
<div>
<label>Talisman #3</label>
<select id="talisman-3" name="talisman"
onchange="update()"></select>
</div>
<div>
<label>Talisman #4</label>
<select id="talisman-4" name="talisman"
onchange="update()"></select>
</div>
<hr />
<li><b>Spells</b></li>
</article>
</div>
<div>
<h2 style="text-align: center">Explanation & Usage</h2>
<p>This page is under development, don't expect everything to work
perfectly.</p>
</div>
</main>
<footer>
<h5>
Erdtree Planner (<a
href="https://git.palmoe.dk/vodofrede/erdtree">available under
BSD-3-Clause license</a>)
</h5>
<h5>Copyright 2022 vodofrede</h5>
</footer>
</body>
</html>
<div>
<label for="strength">Strength</label>
<span>
<input type="number" id="strength" name="final" min="0" max="99" onchange="update()" />
</span>
</div>
<div>
<label for="dexterity">Dexterity</label>
<span>
<input type="number" id="dexterity" name="final" min="0" max="99" onchange="update()" />
</span>
</div>
<div>
<label for="intelligence">Intelligence</label>
<span>
<input type="number" id="intelligence" name="final" min="0" max="99" onchange="update()" />
</span>
</div>
<div>
<label for="faith">Faith</label>
<span>
<input type="number" id="faith" name="final" min="0" max="99" onchange="update()" />
</span>
</div>
<div>
<label for="arcane">Arcane</label>
<span>
<input type="number" id="arcane" name="final" min="0" max="99" onchange="update()" />
</span>
</div>
<hr />
<b>Import</b>
<div>
<input type="file" />
</div>
<hr />
<b>Export</b>
<div>
<button>Export</button>
</div>
</article>
<!-- equipment -->
<article style="flex-basis: 20%; max-width: 450px">
<b>Equipment</b>
<hr />
<b>Weapons & Shields</b>
<template id="picker">
<div class="popup">
<input type="image" src="/resource/icon/standard.jpg" height="20px" />
</div>
</template>
<div>
<div>
<span>
<select id="lh1" name="weapon" onchange="update()"></select>
</span>
<span>
<img id="lh1-img" src="/resource/icon/standard.jpg" width="20px" />
<select id="lh1-infusion" name="infusion"></select>
</span>
</div>
<div>
<span>
<select id="rh1" name="weapon" onchange="update()"></select>
</span>
<span>
<select id="rh1-infusion" name="infusion"></select>
<img id="rh1-img" src="/resource/icon/standard.jpg" width="20px" />
</span>
</div>
</div>
<div>
<div>
<span>
<select id="lh2" name="weapon" onchange="update()"></select>
</span>
<span>
<img id="lh2-img" src="/resource/icon/standard.jpg" width="20px" />
<select id="lh2-infusion" name="infusion"></select>
</span>
</div>
<div>
<span>
<select id="rh2" name="weapon" onchange="update()"></select>
</span>
<span>
<select id="rh2-infusion" name="infusion"></select>
<img id="rh2-img" src="/resource/icon/standard.jpg" width="20px" />
</span>
</div>
</div>
<div>
<div>
<span>
<select id="lh3" name="weapon" onchange="update()"></select>
</span>
<span>
<img id="lh3-img" src="/resource/icon/standard.jpg" width="20px" />
<select id="lh3-infusion" name="infusion"></select>
</span>
</div>
<div>
<span>
<select id="rh3" name="weapon" onchange="update()"></select>
</span>
<span>
<select id="rh3-infusion" name="infusion"></select>
<img id="rh3-img" src="/resource/icon/standard.jpg" width="20px" />
</span>
</div>
</div>
<hr />
<b>Armor</b>
<div>
<label>Helmet</label>
<select id="helmet" name="armor" onchange="update()"></select>
</div>
<div>
<label>Chestpiece</label>
<select id="chestpiece" name="armor" onchange="update()"></select>
</div>
<div>
<label>Gauntlets</label>
<select id="gauntlets" name="armor" onchange="update()"></select>
</div>
<div>
<label>Leggings</label>
<select id="leggings" name="armor" onchange="update()"></select>
</div>
<hr />
<li><b>Talismans</b></li>
<div>
<label>Talisman #1</label>
<select id="talisman-1" name="talisman" onchange="update()"></select>
</div>
<div>
<label>Talisman #2</label>
<select id="talisman-2" name="talisman" onchange="update()"></select>
</div>
<div>
<label>Talisman #3</label>
<select id="talisman-3" name="talisman" onchange="update()"></select>
</div>
<div>
<label>Talisman #4</label>
<select id="talisman-4" name="talisman" onchange="update()"></select>
</div>
<hr />
<li><b>Spells</b></li>
</article>
</div>
<div>
<h2 style="text-align: center">Explanation & Usage</h2>
<p>This page is under development, don't expect everything to work perfectly.</p>
</div>
</main>
<footer>
<h5>
Erdtree Planner (<a href="https://git.palmoe.dk/vodofrede/erdtree"
>available under BSD-3-Clause license</a
>)
</h5>
<h5>Copyright 2022 vodofrede</h5>
</footer>
</body>
</html>

File diff suppressed because it is too large Load Diff