82 lines
2.2 KiB
HTML

{include "admin/layout.html"}
{block "content"}
<h1>Spell Learning: {class.Name}</h1>
<div style="margin-bottom: 1rem;">
<a href="/admin/classes/{class.ID}" class="btn">← Back to Class</a>
</div>
<!-- Current Spell Unlocks -->
<h2>Current Spell Unlocks</h2>
{if #currentUnlocks > 0}
<table>
<thead>
<tr>
<th>Level</th>
<th>Spell</th>
<th>Type</th>
<th>MP</th>
<th>Power</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
{for unlock in currentUnlocks}
<tr>
<td>{unlock.Level}</td>
<td>{unlock.SpellName}</td>
<td>{unlock.SpellType}</td>
<td>{unlock.SpellMP}</td>
<td>{unlock.SpellPower}</td>
<td>
<form method="post" style="display: inline;">
{csrf}
<input type="hidden" name="action" value="remove">
<input type="hidden" name="spell_id" value="{unlock.SpellID}">
<input type="hidden" name="level" value="{unlock.Level}">
<button type="submit" class="btn btn-small btn-danger" onclick="return confirm('Remove this spell unlock?')">Remove</button>
</form>
</td>
</tr>
{/for}
</tbody>
</table>
{else}
<p>No spells currently unlocked for this class.</p>
{/if}
<!-- Add New Spell Unlock -->
<h2>Add Spell Unlock</h2>
<form method="post" class="standard">
{csrf}
<input type="hidden" name="action" value="add">
<div>
<label for="spell-search">Search for Spell:</label>
<input type="text" id="spell-search" placeholder="Type spell name..." autocomplete="off">
<div id="spell-results" style="border: 1px solid #ccc; background: white; max-height: 200px; overflow-y: auto; display: none; position: relative; z-index: 1000;"></div>
</div>
<div>
<label for="selected-spell">Selected Spell:</label>
<div id="selected-spell" style="padding: 0.5rem; border: 1px solid #ccc; background: #f9f9f9; min-height: 2rem;">
<em>No spell selected</em>
</div>
<input type="hidden" name="spell_id" id="spell-id" required>
</div>
<div>
<label for="level">Learn at Level:</label>
<input type="number" name="level" id="level" min="1" max="50" value="1" required>
<small>Level at which this spell becomes available</small>
</div>
<div>
<button type="submit" class="btn btn-primary">Add Spell Unlock</button>
</div>
</form>
<script src="/assets/scripts/spell-search.js"></script>
{/block}