Add Loadout Planner and Quest Trees templates

- Created loadout.html for a comprehensive loadout planner, allowing users to filter and view gear options across various categories including guns, armor, helmets, headwear, backpacks, and rigs.
- Implemented a build builder feature to calculate total loadout weight and save builds.
- Added quests.html to display quest trees with trader dependencies, filtering options, and quest completion tracking.
This commit is contained in:
serversdwn
2026-02-22 08:51:28 +00:00
parent 68005b1cb0
commit 84768ae587
9 changed files with 2333 additions and 20 deletions

View File

@@ -101,7 +101,13 @@
</head>
<body>
<div class="page">
<nav><a href="/">← Back to Keys</a></nav>
<nav>
<a href="/">← Keys</a>
&nbsp;|&nbsp;
<a href="/quests">Quest Trees</a>
&nbsp;|&nbsp;
<a href="/loadout">Loadout Planner</a>
</nav>
<h1>Collector Checklist</h1>
<p class="subtitle">
{{ done }} / {{ total }} quests completed
@@ -120,24 +126,53 @@
{% set ns.current_trader = quest.trader %}
{% endif %}
<form method="post" action="/collector/toggle" style="margin:0">
<input type="hidden" name="quest_id" value="{{ quest.id }}">
<input type="hidden" name="done" value="{{ '0' if quest.done else '1' }}">
<div class="quest-row {% if quest.done %}done{% endif %}">
<span class="quest-name">
{{ quest.name }}
{% if quest.wiki_link %}
<a href="{{ quest.wiki_link }}" target="_blank">wiki</a>
{% endif %}
</span>
<button class="toggle-btn" type="submit">
{{ '✓ Done' if quest.done else 'Mark done' }}
</button>
</div>
</form>
<div class="quest-row {% if quest.done %}done{% endif %}" id="quest-{{ quest.id }}" data-id="{{ quest.id }}" data-done="{{ '1' if quest.done else '0' }}">
<span class="quest-name">
{{ quest.name }}
{% if quest.wiki_link %}
<a href="{{ quest.wiki_link }}" target="_blank">wiki</a>
{% endif %}
</span>
<button class="toggle-btn" onclick="toggle(this)">
{{ '✓ Done' if quest.done else 'Mark done' }}
</button>
</div>
{% endfor %}
{% if ns.current_trader is not none %}</div>{% endif %}
</div>
<script>
let doneCount = {{ done }};
const total = {{ total }};
function updateProgress() {
document.querySelector('.subtitle').textContent = doneCount + ' / ' + total + ' quests completed';
const pct = total ? (doneCount / total * 100).toFixed(1) : 0;
document.querySelector('.progress-bar-fill').style.width = pct + '%';
}
function toggle(btn) {
const row = btn.closest('.quest-row');
const id = row.dataset.id;
const nowDone = row.dataset.done === '1' ? 0 : 1;
const body = new URLSearchParams({ quest_id: id, done: nowDone });
fetch('/collector/toggle', { method: 'POST', body })
.then(r => r.json())
.then(() => {
row.dataset.done = nowDone;
if (nowDone) {
row.classList.add('done');
btn.textContent = '✓ Done';
doneCount++;
} else {
row.classList.remove('done');
btn.textContent = 'Mark done';
doneCount--;
}
updateProgress();
});
}
</script>
</body>
</html>