{% extends "base.html" %}
{% block title %}Seal — result{% endblock %}
{% block content %}

{% set kind = 'ok' if outcome == 'admin_match'
          else ('warn' if outcome in ['welcome', 'no_watermark']
          else 'err') %}

<section class="result-page">
  <div class="card result-card {{ kind }}">
    {% if outcome == 'admin_match' %}
      <div class="badge ok">
        <svg viewBox="0 0 24 24" aria-hidden="true">
          <path d="M5 12l5 5L20 7" fill="none" stroke="currentColor"
                stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"/>
        </svg>
        admin verified
      </div>
      <h1>welcome back, <span class="grad">{{ name }}</span>.</h1>
      <p>the board recognized your signature. here's what you reserved for yourself:</p>
      <div class="flag-box">
        <code class="mono flag">{{ flag }}</code>
        <button class="iconbtn" type="button" data-copy="{{ flag }}" title="copy">
          <svg viewBox="0 0 24 24" aria-hidden="true">
            <rect x="8" y="8" width="13" height="13" rx="2"
                  fill="none" stroke="currentColor" stroke-width="2"/>
            <path d="M16 8V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h3"
                  fill="none" stroke="currentColor" stroke-width="2"
                  stroke-linecap="round" stroke-linejoin="round"/>
          </svg>
        </button>
      </div>

    {% elif outcome == 'welcome' %}
      <div class="badge warn">
        <svg viewBox="0 0 24 24" aria-hidden="true">
          <circle cx="12" cy="12" r="9" fill="none" stroke="currentColor" stroke-width="2"/>
          <path d="M12 8v4m0 4h.01" fill="none" stroke="currentColor"
                stroke-width="2" stroke-linecap="round"/>
        </svg>
        identified
      </div>
      <h1>welcome, <span class="grad">{{ name }}</span>.</h1>
      <p>your clip is on the board. thanks for signing in.</p>

    {% elif outcome == 'no_file' %}
      <div class="badge err">!</div>
      <h1>no file</h1>
      <p>please attach a video file and try again.</p>

    {% elif outcome == 'bad_ext' %}
      <div class="badge err">!</div>
      <h1>unsupported format</h1>
      <p>only <code class="mono">.mp4</code>, <code class="mono">.mov</code>,
         and <code class="mono">.webm</code> are accepted.</p>

    {% elif outcome == 'too_big' %}
      <div class="badge err">!</div>
      <h1>too large</h1>
      <p>uploads are capped at 30 MB.</p>

    {% elif outcome == 'bounds' %}
      <div class="badge err">!</div>
      <h1>out of bounds</h1>
      <p>videos must be at most 6 seconds long and 480p or smaller.</p>

    {% elif outcome == 'unreadable' %}
      <div class="badge err">!</div>
      <h1>could not read your video</h1>
      <p>the upload failed to decode (or the analysis timed out). try a different file.</p>

    {% elif outcome == 'no_watermark' %}
      <div class="badge warn">?</div>
      <h1>no signature detected</h1>
      <p>we could not verify who uploaded this. anonymous posts are not accepted on this board.</p>

    {% else %}
      <div class="badge err">!</div>
      <h1>something went wrong</h1>
    {% endif %}

    <div class="result-actions">
      <a class="btn ghost" href="{{ url_for('index') }}">
        <svg viewBox="0 0 24 24" aria-hidden="true">
          <path d="M19 12H5m0 0l6-6m-6 6l6 6" fill="none" stroke="currentColor"
                stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
        </svg>
        back to catalog
      </a>
    </div>
  </div>
</section>

<script>
  document.querySelectorAll('[data-copy]').forEach(btn => {
    btn.addEventListener('click', async () => {
      try {
        await navigator.clipboard.writeText(btn.dataset.copy);
        btn.classList.add('copied');
        setTimeout(() => btn.classList.remove('copied'), 1200);
      } catch (_) {}
    });
  });
</script>

{% endblock %}