{% extends "base.html" %}

{% block title %}{{ thread_title }} — Multithreaded{% endblock %}

{% block head %}<meta name="description" content="{{ thread_title }} — discussion in {{ category_name }}, {{ community_name }}.">{% endblock %}

{% block header %}{% include "partials/site_header.html" %}{% endblock %}

{% block content %}
<div class="container">
    <div class="breadcrumb">
        <a href="/">Forums</a>
        <span class="sep">/</span>
        <a href="/p/{{ community_slug }}">{{ community_name }}</a>
        <span class="sep">/</span>
        <a href="/p/{{ community_slug }}/{{ category_slug }}">{{ category_name }}</a>
        <span class="sep">/</span>
        {{ thread_title }}
    </div>
    <div class="page-header">
        <h2>{{ thread_title }}</h2>
        <span>
            {% if pinned %}
            <span class="badge badge-pinned">[pinned]</span>
            {% endif %}
            {% if locked %}
            <span class="badge badge-locked">[locked]</span>
            {% endif %}
            {% if is_mod %}
            <form method="post" action="/p/{{ community_slug }}/{{ category_slug }}/{{ thread_id }}/pin" class="form-inline">
                <button type="submit" class="post-action-link">{% if pinned %}unpin{% else %}pin{% endif %}</button>
            </form>
            <form method="post" action="/p/{{ community_slug }}/{{ category_slug }}/{{ thread_id }}/lock" class="form-inline">
                <button type="submit" class="post-action-link">{% if locked %}unlock{% else %}lock{% endif %}</button>
            </form>
            {% endif %}
            {% if session_user.is_some() %}
            {% if is_tracked %}
            <form method="post" action="/p/{{ community_slug }}/{{ category_slug }}/{{ thread_id }}/untrack" class="form-inline">
                <button type="submit" class="post-action-link">untrack</button>
            </form>
            {% else %}
            <form method="post" action="/p/{{ community_slug }}/{{ category_slug }}/{{ thread_id }}/track" class="form-inline">
                <button type="submit" class="post-action-link">track</button>
            </form>
            {% endif %}
            {% endif %}
            {% if can_mod_thread %}
            <a href="/p/{{ community_slug }}/{{ category_slug }}/{{ thread_id }}/edit" class="post-action-link">edit title</a>
            <form method="post" action="/p/{{ community_slug }}/{{ category_slug }}/{{ thread_id }}/delete" class="form-inline" onsubmit="return confirm('Delete this thread? This cannot be undone.')">
                <button type="submit" class="post-action-link post-action-delete">delete thread</button>
            </form>
            {% endif %}
        </span>
    </div>

    <div class="post-list">
        {% for post in posts %}
        <div class="post-item{% if post.is_op %} op{% endif %}{% if post.is_removed %} post-removed{% endif %}" id="post-{{ post.id }}" data-post-id="{{ post.id }}">
            <div class="post-header">
                <a href="/p/{{ community_slug }}/u/{{ post.author_username }}" class="post-author">{{ post.author_name }}</a>
                <span>
                    <span class="post-timestamp">{{ post.timestamp }}</span>
                    {% if !post.is_removed %}
                    <span class="post-actions">
                        {% if post.can_endorse %}
                        <form method="post" action="/p/{{ community_slug }}/{{ category_slug }}/{{ thread_id }}/posts/{{ post.id }}/endorse" class="form-inline">
                            <button type="submit" class="post-action-link{% if post.is_endorsed %} endorsed{% endif %}">{% if post.is_endorsed %}endorsed{% else %}endorse{% endif %}</button>
                        </form>
                        {% endif %}
                        {% if post.endorsement_count > 0 %}
                        {% if post.is_endorsed || post.can_add_footnote || is_mod %}
                        <span class="endorsement-count">{{ post.endorsement_count }}</span>
                        {% endif %}
                        {% endif %}
                        {% if post.can_flag %}
                        <details class="flag-form-toggle">
                            <summary class="post-action-link">flag</summary>
                            <form method="post" action="/p/{{ community_slug }}/{{ category_slug }}/{{ thread_id }}/posts/{{ post.id }}/flag" class="flag-form">
                                <label><input type="radio" name="reason" value="spam" required> Spam</label>
                                <label><input type="radio" name="reason" value="rule_breaking"> Rule-breaking</label>
                                <label><input type="radio" name="reason" value="off_topic"> Off-topic</label>
                                <textarea name="detail" placeholder="Optional details..." class="textarea-short" maxlength="1024"></textarea>
                                <button type="submit" class="primary flag-btn">Submit Flag</button>
                            </form>
                        </details>
                        {% endif %}
                        {% if post.can_remove %}
                        <form method="post" action="/p/{{ community_slug }}/{{ category_slug }}/{{ thread_id }}/posts/{{ post.id }}/remove" class="form-inline" onsubmit="return confirm('Remove this post? The content will be hidden but preserved for audit.')">
                            <button type="submit" class="post-action-link post-action-delete">remove</button>
                        </form>
                        {% endif %}
                    </span>
                    {% endif %}
                </span>
            </div>
            <div class="post-body">
                {{ post.body_html|safe }}
            </div>
            {% if !post.link_previews.is_empty() %}
            <div class="post-link-previews">
                {% for lp in post.link_previews %}
                <a href="{{ lp.url }}" class="link-preview-card" rel="noopener noreferrer nofollow" target="_blank">
                    {% if let Some(title) = lp.title %}<span class="lp-title">{{ title }}</span>{% endif %}
                    {% if let Some(desc) = lp.description %}<span class="lp-desc">{{ desc }}</span>{% endif %}
                    <span class="lp-url">{{ lp.url }}</span>
                </a>
                {% endfor %}
            </div>
            {% endif %}
            {% if !post.footnotes.is_empty() %}
            <div class="post-footnotes">
                {% for note in post.footnotes %}
                <div class="footnote">
                    <span class="footnote-prefix">footnote by {{ note.author_name }} ({{ note.timestamp }}):</span>
                    {{ note.body_html|safe }}
                </div>
                {% endfor %}
            </div>
            {% endif %}
            {% if post.can_add_footnote %}
            <details class="footnote-form-toggle">
                <summary class="post-action-link">add footnote</summary>
                <form method="post" action="/p/{{ community_slug }}/{{ category_slug }}/{{ thread_id }}/posts/{{ post.id }}/footnote">
                    <textarea name="body" placeholder="Add a correction or clarification..." required maxlength="65536"></textarea>
                    <button type="submit" class="primary footnote-btn">Add Footnote</button>
                </form>
            </details>
            {% endif %}
        </div>
        {% endfor %}
    </div>

    {% include "partials/pagination.html" %}

    {% if !locked %}
    {% if session_user.is_some() %}
    <div class="reply-section" id="reply-form">
        <h3>Reply</h3>
        <form method="post" action="/p/{{ community_slug }}/{{ category_slug }}/{{ thread_id }}/reply">
            <div class="form-group">
                <label for="reply-body">Your reply (Markdown supported)</label>
                <textarea id="reply-body" name="body" placeholder="Write your reply..." required maxlength="65536"></textarea>
            </div>
            <div class="form-actions">
                <button type="submit" class="primary">Post Reply</button>
            </div>
        </form>
    </div>
    {% else %}
    <div class="empty-state">
        <a href="/auth/login">Login</a> to reply.
    </div>
    {% endif %}
    {% endif %}
</div>
{% endblock %}