{% extends 'base.html' %}
{% block title %}{{ movie.name }} - 影视采集站{% endblock %}

{% block content %}
<div class="detail">
  <div class="detail-head">
    <img class="detail-poster" src="{{ movie.pic }}" alt="{{ movie.name }}" onerror="this.src='https://via.placeholder.com/300x420?text=No+Image'">
    <div class="detail-meta">
      <h1>{{ movie.name }}</h1>
      <p class="tags">
        {% if movie.year %}<span>{{ movie.year }}</span>{% endif %}
        {% if movie.area %}<span>{{ movie.area }}</span>{% endif %}
        {% if movie.type_name %}<span>{{ movie.type_name }}</span>{% endif %}
        {% if movie.remarks %}<span>{{ movie.remarks }}</span>{% endif %}
      </p>
      <p><strong>导演：</strong>{{ movie.director or '未知' }}</p>
      <p><strong>主演：</strong>{{ movie.actors or '未知' }}</p>
      <p class="intro">{{ movie.content or '' }}</p>
    </div>
  </div>

  <div class="player-wrap">
    <div class="source-tabs">
      {% for s in movie.play_sources %}
        <button class="source-tab {% if loop.first %}active{% endif %}" data-idx="{{ loop.index0 }}">{{ s.source }}</button>
      {% endfor %}
    </div>

    <div class="player">
      <video id="video" controls playsinline></video>
    </div>

    <div class="episodes">
      {% for s in movie.play_sources %}
        <div class="episode-group" data-idx="{{ loop.index0 }}" {% if not loop.first %}style="display:none"{% endif %}>
          {% for ep in s.episodes %}
            <button class="ep-btn" data-url="{{ ep.url }}">{{ ep.title }}</button>
          {% endfor %}
        </div>
      {% endfor %}
    </div>
  </div>
</div>

<script>
  window.__PLAY_SOURCES__ = {{ movie.play_sources | tojson }};
</script>
<script src="{{ url_for('static', filename='js/main.js') }}"></script>
{% endblock %}