{% extends "base.html" %}
{% block title %}Éléments de jeu — {{ game.name }}{% endblock %}
{% block breadcrumb %}
<a class="crumb" href="{{ url_for('game_dashboard', slug=game.slug) }}">{{ game.name }}</a>
<span class="crumb-sep">/</span><span class="crumb">Éléments de jeu</span>
{% endblock %}
{% block content %}
<h1>Éléments de jeu</h1>
<p class="hint">Un élément de jeu est un conteneur réutilisable.</p>

<form method="post" class="card">
  <div class="fieldRow">
    <div style="flex:0 0 80px;">
      <label for="icon">Icône</label>
      <input type="text" id="icon" name="icon" value="🧩" maxlength="4">
    </div>
    <div style="flex:1;">
      <label for="name">Nom</label>
      <input type="text" id="name" name="name" placeholder="ex. Personnage, Outil, Carte mail..." required>
    </div>
  </div>
  <div class="fieldRow">
    <div>
      <label for="bound_definition_id">Objet lié (optionnel)</label>
      <select id="bound_definition_id" name="bound_definition_id">
        <option value="">(aucun — élément décoratif, sans donnée)</option>
        {% for d in definitions %}
        <option value="{{ d.id }}">{{ d.name }}</option>
        {% endfor %}
      </select>
    </div>
  </div>
  <div class="actionsRow"><button type="submit" class="primary">+ Créer</button></div>
</form>

<h2>Catalogue</h2>
{% if types %}
<div class="list">
  {% for t in types %}
  <div class="listRow listRowFlex">
    <div class="rowLink">
      <div class="rowTitle">{{ t.icon }} {{ t.name }}</div>
      <div class="rowSub">
        {{ usage.get(t.id, 0) }} instance(s) posée(s) sur des écrans
        {% if t.bound_definition_id %}
          {% for d in definitions %}{% if d.id == t.bound_definition_id %} · lié à l'objet « {{ d.name }} »{% endif %}{% endfor %}
        {% endif %}
      </div>
    </div>
    <div class="rowActions">
      <a class="smallBtn" href="{{ url_for('screen_edit', slug=game.slug, screen_id=t.template_screen_id) }}" title="Modifier le contenu de cet élément de jeu">✏️ Modifier le contenu</a>
      <form method="post" action="{{ url_for('element_type_delete', slug=game.slug, element_type_id=t.id) }}"
            onsubmit="return confirm('Supprimer l\'élément de jeu « {{ t.name }} » du catalogue (et tout son contenu) ?');">
        <button type="submit" class="smallBtn danger" {{ 'disabled title="Utilisé sur un écran — retire-le des écrans d\'abord"' if usage.get(t.id, 0) > 0 else '' }}>🗑️</button>
      </form>
    </div>
  </div>
  {% endfor %}
</div>
{% else %}
<p class="hint">Aucun élément de jeu défini pour l'instant.</p>
{% endif %}
{% endblock %}