Files

88 lines
3.5 KiB
HTML

{# Combat Actions Partial - Action buttons for combat #}
{# This partial shows the available combat actions #}
{% if is_player_turn %}
<div class="combat-actions__grid">
{# Attack Button - Direct action #}
<button class="combat-action-btn combat-action-btn--attack"
hx-post="{{ url_for('combat.combat_action', session_id=session_id) }}"
hx-vals='{"action_type": "attack"}'
hx-target="#combat-log"
hx-swap="beforeend"
hx-disabled-elt="this"
title="Basic attack with your weapon">
<span class="combat-action-btn__icon">&#9876;</span>
<span>Attack</span>
</button>
{# Ability Button - Opens modal #}
<button class="combat-action-btn combat-action-btn--ability"
hx-get="{{ url_for('combat.combat_abilities', session_id=session_id) }}"
hx-target="#modal-container"
hx-swap="innerHTML"
title="Use a special ability or spell">
<span class="combat-action-btn__icon">&#10024;</span>
<span>Ability</span>
</button>
{# Item Button - Opens bottom sheet #}
<button class="combat-action-btn combat-action-btn--item"
hx-get="{{ url_for('combat.combat_items', session_id=session_id) }}"
hx-target="#combat-sheet-container"
hx-swap="innerHTML"
title="Use an item from your inventory">
<span class="combat-action-btn__icon">&#127863;</span>
<span>Item</span>
</button>
{# Defend Button - Direct action #}
<button class="combat-action-btn combat-action-btn--defend"
hx-post="{{ url_for('combat.combat_action', session_id=session_id) }}"
hx-vals='{"action_type": "defend"}'
hx-target="#combat-log"
hx-swap="beforeend"
hx-disabled-elt="this"
title="Take a defensive stance, reducing damage taken">
<span class="combat-action-btn__icon">&#128737;</span>
<span>Defend</span>
</button>
{# Flee Button - Direct action #}
<button class="combat-action-btn combat-action-btn--flee"
hx-post="{{ url_for('combat.combat_flee', session_id=session_id) }}"
hx-target="#combat-log"
hx-swap="beforeend"
hx-disabled-elt="this"
hx-confirm="Are you sure you want to flee from combat?"
title="Attempt to escape from battle">
<span class="combat-action-btn__icon">&#127939;</span>
<span>Flee</span>
</button>
</div>
{% else %}
<div class="combat-actions__grid">
{# Disabled buttons when not player's turn #}
<button class="combat-action-btn combat-action-btn--attack" disabled>
<span class="combat-action-btn__icon">&#9876;</span>
<span>Attack</span>
</button>
<button class="combat-action-btn combat-action-btn--ability" disabled>
<span class="combat-action-btn__icon">&#10024;</span>
<span>Ability</span>
</button>
<button class="combat-action-btn combat-action-btn--item" disabled>
<span class="combat-action-btn__icon">&#127863;</span>
<span>Item</span>
</button>
<button class="combat-action-btn combat-action-btn--defend" disabled>
<span class="combat-action-btn__icon">&#128737;</span>
<span>Defend</span>
</button>
<button class="combat-action-btn combat-action-btn--flee" disabled>
<span class="combat-action-btn__icon">&#127939;</span>
<span>Flee</span>
</button>
</div>
<p class="combat-actions__disabled-message">Waiting for enemy turn...</p>
{% endif %}