{% extends "layouts/default.html" %}
{% block title %}Card Editor{% if card %} - {{ card.id }}{% endif %}{% endblock %}
{% block content %}
<form id="edit-form" name="edit-form" method="post">
  {{ token | safe }}
</form>

<div class="container" id="results">
  {% if card %}
  <div class="buttons is-centered">
    <button class="button is-primary"
            form="edit-form"
            hx-include="[name='edit-form']"
            type="submit">Save</button>
    <button class="button is-danger"
            form="edit-form"
            hx-include="[name='edit-form']"
            hx-delete="/inventory/{{card.id}}/delete"
            hx-confirm="Delete {{card.id}} - Are you sure?">Delete</button>
  </div>

  <div class="table-container">
    <table class="table is-striped is-bordered">
      <thead>
        <tr>
          <th>Field</th>
          <th>Value</th>
      </thead>
      <tbody>
        <tr>
          <th>Card Image</th>
          <td>
            <a target="_blank" href="/public/ygoprodeck/{{card.passcode}}.jpg">
              <img class="w3-image" style="width:100px;max-width:100px;"
                   src="/public/ygoprodeck/{{ card.passcode }}.jpg"
                   alt="Card Image for Yu-Gi-Oh! #{{card.passcode}} - {{card.name}}">
            </a>
          </td>
        </tr>
        {% include "inventory/_edit_row.html" :form "edit-form" :name "name"         :value card.name :title "Product Name" %}
        {% include "inventory/_edit_row.html" :form "edit-form" :name "condition"    :value card.condition    :title "Condition" %}
        {% include "inventory/_edit_row.html" :form "edit-form" :name "category"     :value card.category     :title "Category" %}
        {% include "inventory/_edit_row.html" :form "edit-form" :name "name"         :value card.name         :title "Name" %}
        {% include "inventory/_edit_row.html" :form "edit-form" :name "code"         :value card.code         :title "Code" %}
        {% include "inventory/_edit_row.html" :form "edit-form" :name "edition"      :value card.edition      :title "Edition" %}
        {% include "inventory/_edit_row.html" :form "edit-form" :name "passcode"     :value card.passcode     :title "Passcode" %}
        {% include "inventory/_edit_row.html" :form "edit-form" :name "buy-price"    :value card.buy-price    :title "Buy Price" %}
        {% include "inventory/_edit_row.html" :form "edit-form" :name "sell-price"   :value card.sell-price   :title "Sell Price" %}
        {% include "inventory/_edit_row.html" :form "edit-form" :name "total-qty"    :value card.total-qty    :title "Total Qty" %}
        {% include "inventory/_edit_row.html" :form "edit-form" :name "uri"          :value card.uri          :title "URI" %}
        {% include "inventory/_edit_row.html" :form "edit-form" :name "description"  :value card.description  :title "Description" %}
      </tbody>
    </table>
  </div>
  {% else %}
  <p>Nothing to see here.</p>
  {% endif %}
</div>
{% endblock %}