{% extends "tgcms/base.html" %}
{% block title %}{% if post %}Edit post{% else %}New post{% endif %} — tgcms{% endblock %}

{% block extra_head %}{{ form.media }}{% endblock %}

{% block content %}
  <div class="tgcms-toolbar">
    <h1>{% if post %}Edit post{% else %}New post{% endif %}</h1>
    {% if post %}
      <form method="post" action="{% url 'tgcms:post_publish' post.pk %}">
        {% csrf_token %}
        <button class="tgcms-btn tgcms-btn--primary" type="submit">Publish</button>
      </form>
    {% endif %}
  </div>

  <form method="post">
    {% csrf_token %}
    <label class="tgcms-field">
      <span>Title</span>
      {{ form.title }}
    </label>
    <label class="tgcms-field">
      <span>Status</span>
      {{ form.status }}
    </label>
    <button class="tgcms-btn tgcms-btn--primary" type="submit">Save</button>
  </form>

  {% if post %}
    <section class="tgcms-preview">
      <h2>Blocks ({{ post.blocks.count }})</h2>
      {% for block in post.blocks.all %}
        <div class="tgcms-block-preview tgcms-block-preview--{{ block.type }}">
          <span class="tgcms-badge">{{ block.get_type_display }}</span>
          {% if block.type == "heading" %}<strong>{{ block.text }}</strong>{% endif %}
          {% if block.type == "text" %}<span>{{ block.text|truncatechars:80 }}</span>{% endif %}
          {% if block.type == "photo" or block.type == "video" %}
            {% if block.file %}<span>{{ block.file.name }}</span>{% endif %}
            {% if block.caption %}<em>{{ block.caption|truncatechars:60 }}</em>{% endif %}
          {% endif %}
        </div>
      {% empty %}
        <p class="tgcms-hint">No blocks yet. Add blocks via <a href="/admin/tgcms/post/{{ post.pk }}/change/">Django admin</a>.</p>
      {% endfor %}

      <h2>render() payload</h2>
      <pre id="tgcms-preview-container" data-url="{% url 'tgcms:post_preview' post.pk %}"
           class="tgcms-preview-payload"></pre>
    </section>
  {% endif %}
{% endblock %}