{% extends "base.html" %}
{% from '_capture_widget.html' import capture_widget %}
{% block title %}Capture — Garden{% endblock %}

{% block content %}
<h1>Field notes</h1>
<p class="summary">
  Quick capture: dictate, snap, or type. Process later.
  {% if new_count %}
    <a href="/capture/queue">{{ new_count }} unprocessed</a>.
  {% else %}
    <a href="/capture/queue">View queue</a>.
  {% endif %}
</p>

<div id="capture-app" class="capture">
  <div class="capture-card">
    {{ capture_widget('main', mode='capture', save_label='Save note') }}
  </div>
</div>

<h2 style="margin-top:1.6rem;">Recent</h2>
<div class="note-list" id="recent-list">
  {% for n in recent %}
    <div class="note-item note-status-{{ n.status }}" data-id="{{ n.id }}">
      <div class="note-meta">
        <span class="note-time">{{ n.created_at[:16].replace('T', ' ') }}</span>
        <span class="note-badge">{{ n.status }}</span>
        <span class="note-actions">
          <button type="button" class="link" data-action="edit">Edit</button>
          <button type="button" class="link danger" data-action="delete">Delete</button>
        </span>
      </div>
      {% if n.audio_path %}
        <audio controls preload="none" src="/notes/{{ n.audio_path }}"></audio>
      {% endif %}
      {% if n.photos %}
        <div class="photo-thumbs">
          {% for p in n.photos %}
            <a href="/notes/{{ p }}" target="_blank"><img src="/notes/{{ p }}" alt="photo"></a>
          {% endfor %}
        </div>
      {% endif %}
      <div class="note-text-wrap">
        {% if n.text %}<div class="note-text">{{ n.text }}</div>{% endif %}
        {% if n.transcript and n.transcript != n.text %}
          <div class="note-transcript muted">{{ n.transcript }}</div>
        {% endif %}
      </div>
    </div>
  {% else %}
    <p class="muted">No notes yet.</p>
  {% endfor %}
</div>
{% endblock %}

{% block scripts %}
{# capture.js is loaded site-wide via base.html (the comment widget needs it
   on every entity page), so don't re-include it here. #}
<script src="/static/notes-actions.js?v={{ ASSET_VERSION }}"></script>
{% endblock %}