{% extends "base.html" %}

{% block title %}Prepare · {{ pending.original_filename }}{% endblock %}

{% block content %}
<section class="card">
  <div class="card__title">Prepare audiobook</div>
  <p class="card__subtitle">Review the detected chapters, choose which ones to render, and optionally override the voice per chapter before sending the job to the queue.</p>

  {% set analysis = pending.speaker_analysis or {} %}
  {% set analysis_speakers = analysis.get('speakers', {}) %}
  {% set show_analysis_prompt = pending.speaker_mode == 'multi' and not pending.analysis_requested %}
  {% set has_metadata = pending.metadata_tags %}
  <div class="prepare-summary">
    <div class="prepare-summary__stats">
      <dl>
        <div>
          <dt>Source</dt>
          <dd>{{ pending.original_filename }}</dd>
        </div>
        <div>
          <dt>Language</dt>
          <dd>{{ options.languages.get(pending.language, pending.language|upper) }}</dd>
        </div>
        <div>
          <dt>Default voice</dt>
          <dd>{% if pending.voice_profile %}Profile · {{ pending.voice_profile }}{% else %}{{ pending.voice }}{% endif %}</dd>
        </div>
        <div>
          <dt>Total chapters</dt>
          <dd>{{ pending.chapters|length }}</dd>
        </div>
        <div>
          <dt>Characters</dt>
          <dd>{{ '{:,}'.format(pending.total_characters|default(0)) }}</dd>
        </div>
        <div>
          <dt>Chapter intro delay</dt>
          <dd>{{ '%.1f'|format(pending.chapter_intro_delay) }} seconds</dd>
        </div>
        <div>
          <dt>Chunk granularity</dt>
          <dd>{{ pending.chunk_level|replace('_', ' ')|title }}</dd>
        </div>
        <div>
          <dt>Speaker mode</dt>
          <dd>{{ pending.speaker_mode|replace('_', ' ')|title }}</dd>
        </div>
        <div>
          <dt>Speaker analysis threshold</dt>
          <dd>{{ pending.speaker_analysis_threshold }} {{ 'mention' if pending.speaker_analysis_threshold == 1 else 'mentions' }}</dd>
        </div>
        <div>
          <dt>EPUB 3 package</dt>
          <dd>{% if pending.generate_epub3 %}Enabled{% else %}Disabled{% endif %}</dd>
        </div>
      </dl>
    </div>
    {% if analysis_speakers or show_analysis_prompt or has_metadata %}
    <div class="prepare-summary__insights">
      {% if analysis_speakers %}
      {% set active = namespace(items=[]) %}
      {% for sid, payload in analysis_speakers.items() %}
        {% if sid != 'narrator' and not payload.get('suppressed') %}
          {% set _ = active.items.append(payload) %}
        {% endif %}
      {% endfor %}
      <div class="prepare-analysis">
        <h2>Detected speakers</h2>
        {% if active.items %}
        <ul>
          {% for speaker in active.items|sort(attribute='label') %}
            <li><strong>{{ speaker.label }}</strong> · {{ speaker.count }} lines · confidence {{ speaker.confidence|title }}</li>
          {% endfor %}
        </ul>
        {% else %}
        <p>No additional speakers met the threshold yet. All dialogue will use the narrator voice.</p>
        {% endif %}
      </div>
      {% elif show_analysis_prompt %}
      <div class="prepare-analysis">
        <h2>Detected speakers</h2>
        <p>Press <strong>Analyze speakers</strong> after selecting chapters to discover recurring voices.</p>
      </div>
      {% endif %}
      {% if has_metadata %}
      <div class="prepare-metadata">
        <h2>Metadata</h2>
        <ul>
          {% for key, value in pending.metadata_tags.items() %}
            <li><strong>{{ key|replace('_', ' ')|title }}:</strong> {{ value }}</li>
          {% endfor %}
        </ul>
      </div>
      {% endif %}
    </div>
    {% endif %}
  </div>
  {% set roster = pending.speakers or {} %}
  {% if roster %}
  {% set preview_template = options.speaker_pronunciation_sentence or "This is {{name}} speaking." %}
  <div class="prepare-speakers">
    <h2>Speaker pronunciation guide</h2>
    <p class="hint">Add a phonetic spelling (IPA or plain text) so pronunciations sound right. Leave blank to use the written label.</p>
    <ul class="speaker-list">
      {% for speaker_id, speaker in roster.items() %}
      {% set spoken_name = speaker.pronunciation or speaker.label %}
      {% set preview_text = preview_template | replace("{{name}}", spoken_name) %}
      <li class="speaker-list__item">
        <div class="speaker-list__header">
          <span class="speaker-list__name">{{ speaker.label }}</span>
          <button type="button"
                  class="icon-button speaker-list__preview"
                  data-role="speaker-preview"
                  data-speaker-id="{{ speaker_id }}"
                  data-preview-text="{{ preview_text|e }}"
                  data-language="{{ pending.language }}"
                  data-voice="{{ speaker.resolved_voice or speaker.voice_formula or speaker.voice or pending.voice }}"
                  data-speed="{{ '%.2f'|format(pending.speed) }}"
                  data-use-gpu="{{ 'true' if pending.use_gpu else 'false' }}"
                  aria-label="Preview pronunciation for {{ speaker.label }}"
                  title="Preview pronunciation">
            🔊
          </button>
        </div>
        <label class="speaker-list__field" for="speaker-{{ speaker_id }}-pronunciation">
          <span>Pronunciation</span>
          <input type="text"
                 id="speaker-{{ speaker_id }}-pronunciation"
                 name="speaker-{{ speaker_id }}-pronunciation"
                 value="{{ speaker.pronunciation or '' }}"
                 placeholder="{{ speaker.label }}">
        </label>
        {% if speaker.get('analysis_count') %}
        <p class="hint speaker-list__stats">{{ speaker.analysis_count }} detected lines · confidence {{ speaker.analysis_confidence|default('low')|title }}</p>
        {% endif %}
      </li>
      {% endfor %}
    </ul>
  </div>
  {% endif %}

  {% if error %}
    <div class="alert alert--error">{{ error }}</div>
  {% endif %}
  {% if notice %}
    <div class="alert alert--info">{{ notice }}</div>
  {% endif %}

  <form method="post" action="{{ url_for('web.finalize_job', pending_id=pending.id) }}" class="prepare-form" id="prepare-form">
    <div class="chapter-grid">
      {% for chapter in pending.chapters %}
      {% set is_enabled = chapter.enabled is not defined or chapter.enabled %}
      {% set selected_option = '__default' %}
      {% if chapter.voice_profile %}
        {% set selected_option = 'profile:' ~ chapter.voice_profile %}
      {% elif chapter.voice %}
        {% set selected_option = 'voice:' ~ chapter.voice %}
      {% elif chapter.voice_formula %}
        {% set selected_option = 'formula' %}
      {% endif %}
      <article class="chapter-card" data-role="chapter-row">
        <header class="chapter-card__header">
          <div class="chapter-card__title">
            <label class="chapter-card__checkbox">
              <input type="checkbox" name="chapter-{{ loop.index0 }}-enabled" data-role="chapter-enabled" {% if is_enabled %}checked{% endif %}>
              <span>Chapter {{ loop.index }} · {{ chapter.title }}</span>
            </label>
          </div>
          <div class="chapter-card__metrics">
            {{ '{:,}'.format(chapter.characters) }} characters
          </div>
        </header>
        <div class="chapter-card__body">
          <div class="chapter-card__field">
            <label for="chapter-{{ loop.index0 }}-title">Title</label>
            <input type="text" id="chapter-{{ loop.index0 }}-title" name="chapter-{{ loop.index0 }}-title" value="{{ chapter.title }}">
          </div>
          <div class="chapter-card__preview">
            <details>
              <summary>Preview text</summary>
              <pre>{{ chapter.text[:2000] }}{% if chapter.text|length > 2000 %}…{% endif %}</pre>
            </details>
          </div>
          <div class="chapter-card__field">
            <label for="chapter-{{ loop.index0 }}-voice">Voice override</label>
            <select id="chapter-{{ loop.index0 }}-voice" name="chapter-{{ loop.index0 }}-voice" data-role="voice-select">
              <option value="__default" {% if selected_option == '__default' %}selected{% endif %}>Use job default</option>
              <optgroup label="Voices">
                {% for voice in options.voices %}
                  <option value="voice:{{ voice }}" {% if selected_option == 'voice:' ~ voice %}selected{% endif %}>{{ voice }}</option>
                {% endfor %}
              </optgroup>
              {% if options.voice_profile_options %}
              <optgroup label="Profiles">
                {% for profile in options.voice_profile_options %}
                  <option value="profile:{{ profile.name }}" {% if selected_option == 'profile:' ~ profile.name %}selected{% endif %}>{{ profile.name }}{% if profile.language %} · {{ profile.language|upper }}{% endif %}</option>
                {% endfor %}
              </optgroup>
              {% endif %}
              <option value="formula" {% if selected_option == 'formula' %}selected{% endif %}>Custom formula…</option>
            </select>
            <input type="text" name="chapter-{{ loop.index0 }}-formula" class="chapter-card__formula" data-role="formula-input" placeholder="af_nova*0.4+am_liam*0.6" value="{{ chapter.voice_formula or '' }}" {% if selected_option != 'formula' %}hidden aria-hidden="true"{% else %}aria-hidden="false"{% endif %}>
          </div>
        </div>
      </article>
      {% endfor %}
    </div>
    <div class="prepare-options">
      <div class="field">
        <label for="chunk_level">Chunk granularity</label>
        <select id="chunk_level" name="chunk_level">
          {% for option in options.chunk_levels %}
            <option value="{{ option.value }}" {% if pending.chunk_level == option.value %}selected{% endif %}>{{ option.label }}</option>
          {% endfor %}
        </select>
        <p class="hint">Paragraphs work well for long-form narration; sentences give finer subtitle sync.</p>
      </div>
      <div class="field">
        <label for="speaker_mode">Speaker mode</label>
        <select id="speaker_mode" name="speaker_mode">
          {% for option in options.speaker_modes %}
            <option value="{{ option.value }}" {% if pending.speaker_mode == option.value %}selected{% endif %}>{{ option.label }}</option>
          {% endfor %}
        </select>
      </div>
      <div class="field">
        <label for="speaker_analysis_threshold">Speaker analysis minimum mentions</label>
        <input type="number" min="1" max="25" id="speaker_analysis_threshold" name="speaker_analysis_threshold" value="{{ pending.speaker_analysis_threshold }}">
        <p class="hint">Only speakers that appear at least this many times will keep unique voices in multi-speaker mode.</p>
      </div>
      <div class="field">
        <label for="chapter_intro_delay">Pause after chapter titles (seconds)</label>
        <input type="number" step="0.1" min="0" id="chapter_intro_delay" name="chapter_intro_delay" value="{{ '%.2f'|format(pending.chapter_intro_delay) }}">
        <p class="hint">Set to 0 to disable the pause after speaking each chapter title.</p>
      </div>
      <div class="field field--choices">
        <label class="toggle-pill">
          <input type="checkbox" name="generate_epub3" value="true" {% if pending.generate_epub3 %}checked{% endif %}>
          <span>Generate EPUB 3 (experimental)</span>
        </label>
      </div>
    </div>
    <div class="prepare-actions">
      <button type="submit"
              class="button button--ghost"
              data-role="analyze-button"
              formaction="{{ url_for('web.analyze_pending_job', pending_id=pending.id) }}"
              formmethod="post"
              formnovalidate
              {% if pending.speaker_mode != 'multi' %}hidden aria-hidden="true"{% else %}aria-hidden="false"{% endif %}>
        Analyze speakers
      </button>
      <button type="submit" class="button">Queue conversion</button>
      <button type="submit" class="button button--ghost" form="cancel-form">Cancel</button>
    </div>
  </form>
  <form method="post" action="{{ url_for('web.cancel_pending_job', pending_id=pending.id) }}" id="cancel-form"></form>
</section>
{% endblock %}

{% block scripts %}
  {{ super() }}
  <script type="module" src="{{ url_for('static', filename='speakers.js') }}"></script>
  <script type="module" src="{{ url_for('static', filename='prepare.js') }}"></script>
{% endblock %}