This commit is contained in:
Frederik Palmø 2022-03-25 14:40:03 +01:00
parent 164d34eefc
commit e915935cc8
5 changed files with 142 additions and 5 deletions

View File

@ -93,14 +93,14 @@
<li>
<div>
<input type="radio" id="sort-physical" name="sorting-order" onclick="update()">
<input type="radio" id="sort-physical" name="sorting-order" onclick="update()" checked>
<label for="sort-physical">Greatest Physical Negation</label>
</div>
</li>
<li>
<div>
<input type="radio" id="sort-elemental" name="sorting-order" onclick="update()" checked>
<input type="radio" id="sort-elemental" name="sorting-order" onclick="update()">
<label for="sort-elemental">Greatest Elemental Negation</label>
</div>
</li>

View File

@ -1,50 +1,60 @@
[
{
"id": "vagabond",
"name": "Vagabond",
"level": 9,
"stats": [15, 10, 11, 14, 13, 9, 9, 7]
},
{
"id": "warrior",
"name": "Warrior",
"level": 8,
"stats": [11, 12, 11, 10, 16, 10, 8, 9]
},
{
"id": "hero",
"name": "Hero",
"level": 7,
"stats": [14, 9, 12, 16, 9, 7, 8, 11]
},
{
"id": "bandit",
"name": "Bandit",
"level": 5,
"stats": [10, 11, 10, 9, 13, 9, 8, 14]
},
{
"id": "astrologer",
"name": "Astrologer",
"level": 6,
"stats": [9, 15, 9, 8, 12, 16, 7, 9]
},
{
"id": "prophet",
"name": "Prophet",
"level": 7,
"stats": [10, 14, 8, 11, 10, 7, 16, 10]
},
{
"id": "samurai",
"name": "Samurai",
"level": 9,
"stats": [12, 11, 13, 12, 15, 9, 8, 8]
},
{
"id": "prisoner",
"name": "Prisoner",
"level": 9,
"stats": [11, 12, 11, 11, 14, 14, 6, 9]
},
{
"id": "confessor",
"name": "Confessor",
"level": 10,
"stats": [10, 13, 10, 12, 12, 9, 14, 9]
},
{
"id": "wretch",
"name": "Wretch",
"level": 1,
"stats": [10, 10, 10, 10, 10, 10, 10, 10]

View File

@ -28,7 +28,7 @@
<div class="cards">
<article>
<a href="/planner.html">
<h3>Build Planner (todo)</h3>
<h3>Build Planner</h3>
<br>
<p>Create a new build.</p>
</a>

View File

@ -10,9 +10,11 @@
<title>Erdtree - Build Planner</title>
<meta name="description" content="">
<script src="script/planner.js"></script>
</head>
<body>
<body onload="init()">
<nav>
<h1><a href="/">Elden Ring Build Planner</a></h1>
<ul>
@ -21,14 +23,101 @@
</nav>
<header>
<h1>Build Planner</h1>
</header>
<main>
<div class="app">
<!-- equipment -->
<article>
<ul>
<li>
<b>Equipment</b>
</li>
<hr>
<li><b>Weapons</b></li>
<hr>
<li><b>Armor</b></li>
<hr>
<li><b>Talismans</b></li>
<hr>
<li><b>Spells</b></li>
</ul>
</article>
<!-- stats -->
<article>
<ul>
<li><b>Statistics</b></li>
<hr>
<li>
<label for="class"><b>Starting Class</b></label>
<select id="class" onchange="update()"></select>
</li>
<li>
<label for="level"><b>Level</b></label>
<input type="text" id="level" class="stat" disabled>
</li>
<li><br></li>
<li>
<label for="vigor">Vigor</label>
<input type="text" id="vigor" class="stat" name="stat">
</li>
<li>
<label for="mind">Mind</label>
<input type="text" id="mind" class="stat" name="stat">
</li>
<li>
<label for="endurance">Endurance</label>
<input type="text" id="endurance" class="stat" name="stat">
</li>
<li>
<label for="strength">Strength</label>
<input type="text" id="strength" class="stat" name="stat">
</li>
<li>
<label for="dexterity">Dexterity</label>
<input type="text" id="dexterity" class="stat" name="stat">
</li>
<li>
<label for="intelligence">Intelligence</label>
<input type="text" id="intelligence" class="stat" name="stat">
</li>
<li>
<label for="faith">Faith</label>
<input type="text" id="faith" class="stat" name="stat">
</li>
<li>
<label for="arcane">Arcane</label>
<input type="text" id="arcane" class="stat" name="stat">
</li>
</ul>
</article>
<!-- misc. -->
<article>
<ul></ul>
</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>

38
src/script/planner.js Normal file
View File

@ -0,0 +1,38 @@
const CLASSES = fetch("/data/classes.json")
.then(response => response.json())
.catch(error => console.log(error));
let startingClass;
async function init() {
await populate();
await update();
}
async function update() {
// get current starting class
let classSelect = document.getElementById("class");
let currentClass = (await CLASSES).find(c => c.id == classSelect.options[classSelect.selectedIndex].value);
let prevClass = { ...startingClass };
if (prevClass.id != currentClass) {
// update statistics
[...document.getElementsByName("stat")].forEach((stat, i) => {
stat.value = parseInt((stat.value || 0) == prevClass.stats[i] ? currentClass.stats[i] : stat.value);
});
document.getElementById("level").value = [...document.getElementsByName("stat")].reduce((total, stat) => total + parseInt(stat), 0) - 79;
}
startingClass = currentClass;
}
async function populate() {
let select = document.getElementById("class");
CLASSES.then(classes => {
classes.forEach(c => {
let option = new Option(c.name, c.id);
select.options.add(option);
});
select.selectedIndex = 0;
startingClass = classes[0];
});
}