{% extends 'base.html' %}
{% load static %}
{% block custom-tags %}<script src="{% static 'js/a.js' %}"></script>

<script src="{% static 'js/jquery.js' %}"></script>


{% endblock %}
{% block content %}
    {% if request.user.is_authenticated and request.user.id == post.user.id %}
    <a href="{% url 'posts:post_delete' post.user.id post.id %}" class="btn btn-danger">Delete Post</a>

    <a href="{% url 'posts:edit_post' request.user.id post.id %}" class="btn btn-primary">Edit Post</a>
    {% endif %}
    <p>{{ post.user }} | {{ post.created }}</p>
    <P>{{ post.body }}</P>
    <hr/>
    {% if comments.count != 0 %}
    {% with total=comments.count %}
        <p>This post has {{ total }} comment{{ total|pluralize }}</p>
    {% endwith %}
    {% endif %}

    <br/>
    {% if request.user.is_authenticated%}
        <form method="post" class="col-md-7">
            {% csrf_token %}
            {{ form.as_p}}
            <input value="Send" type="submit" class="btn btn-primary">
        </form>
    {% else %}
    <P>Only logged in user can send comments</P>
    {% endif %}

    <br/><br/>
    {% for comment in comments %}

        <div class="card bg-dark text-white">
            <pre style="color: white" class="card-header">{{ comment.user }}     <button onclick="show()" class="btn btn-primary">reply</button></pre>
        <p class="card-body">{{ comment.body }}</p>
        {% if request.user.is_authenticated %}
        <div class="card-body">
            <form style="display:none" class="a" method="post" action="{% url 'posts:add_reply' post.id comment.id %}">
                {% csrf_token %}
                {{ reply.as_p }}
                <input value="Send" type="submit">
            </form>
        </div>
        {% else %}
            <p>You have to login to send reply</p>
        {% endif %}
        {% for reply in comment.rcomment.all %}
            <p class="bg-primary text-white p-3 m-5">{{ reply.user }} <br/> {{ reply.body }}</p>
        {% endfor %}


        </div>
        <br/>
    {% empty %}
        <P>There is no comment</P>
    {% endfor %}


{% endblock %}