{% load url from future %}
{% load mptt_tags thumbnail %}

<div class ='main-column'><div id = 'comments' name = 'comments'>


    <div id = "comment-tree">
        <h5><span class = 'comment-count'>{{ comments.count|default:0 }}</span> Komentar</h5>

        {% if comments %}
        <ul>
            {% recursetree comments %}
                <li>
                    <div class = 'comment-wrapper' data-id = '{{ node.id }}' >
                        <div class = 'avatar'>
                            {% if node.user.profile.mugshot %}
                                <a href='{{ node.user.profile.get_absolute_url }}' name='{{ node.id }}'>
                                    <img src = '{% thumbnail node.user.profile.mugshot 50x50 crop="center" %}'>
                                </a>
                            {% else %}
                                <a href='{{ node.user.profile.get_absolute_url }}' name='{{ node.id }}'>
                                    <img src = '{{ STATIC_URL }}website/img/mugshot_default.jpg'>
                                </a>
                            {% endif %}
                        </div>
                        <h6>
                            <a href='{{ node.user.profile.get_absolute_url }}' name='{{ node.id }}'>{{ node.user.profile }}</a>
                        </h6>
                        <div class = 'comment-body'>
                            {{ node.content|linebreaksbr }}
                        </div>
                        <div class = 'comment-footer'>
                            <span>{{ node.created|date:'H:i A j M Y' }}</span>
                            {% if node.get_level < 1 %}<a href = '#' class = 'reply'>Reply</a>{% endif %}
                            <a href = '{{ node.get_add_flag_url }}' class = 'report'>Lapor Penyalahgunaan</a>
                        </div>
                    </div>
                    {% if not node.is_leaf_node %}
                        <ul class="children level-{{ node.get_level }}">
                            {{ children }}
                        </ul>
                    {% endif %}
                </li>
            {% endrecursetree %}
        </ul>
        {% endif %}
    </div>



    <div id = 'comment-forms'>

        <h5>Tinggalkan komentarmu</h5>
        {% include 'website/comments/form.html' %}

        <form action = '{% url "website:login" %}?next={{ request.path }}' id = 'login-comment-form'
            {% if request.user.is_authenticated %}class = 'hide'{% endif %} method = 'post'>
            {% csrf_token %}

            {% comment %}
            <div class = 'text'>
                <a href="{% url 'facebook_connect' %}?redirect=1&next={{ request.get_full_path }}">
                        <img src = '{{ STATIC_URL }}website/img/fblogin.png' class = 'facebook'>
                    </a>
                <p>
                    atau <strong>login dengan akunmu</strong>:
                </p>
            </div>
            {% endcomment %}

            <div>
                <input id="id_identification" type="text" placeholder="Email" name="identification" maxlength="75">
                <input type="password" placeholder="Password" name="password" id="id_password">
                <button class="button cta"><span>Login</span></button>
            </div>

            <p>
                Belum punya akun?
                <a href = '{% url "website:login" %}?next={{ request.path }}'><strong>Daftar sekarang!</strong></a>
            </p>
        </form>

    </div>


</div></div> {# close div.main-column and div#comments #}