{% extends "spirit/_base.html" %}

{% load spirit_tags i18n %}

{% block title %}{{ topic.title }}{% endblock %}

{% block content %}

        <ul class="nav">
            <li><a href="{% url "spirit:index" %}" >{% trans "Main" %}</a><i class="fa fa-chevron-right"></i></li>

            {% if topic.category.parent_id %}
               <li><a href="{{ topic.category.parent.get_absolute_url }}" >{{ topic.category.parent.title }}</a><i class="fa fa-chevron-right"></i></li>
            {% endif %}

		    <li><a href="{{ topic.category.get_absolute_url }}" >{{ topic.category.title }}</a></li>
        </ul>

        <h1 class="headline">
            {% if topic.is_pinned %}
                <i class="fa fa-thumb-tack"></i>
            {% endif %}
            {% if topic.is_closed %}
                <i class="fa fa-lock"></i>
            {% endif %}

            {{ topic.title }}

            {% if user.is_moderator %}
                <a class="head-edit-link" href="{% url "spirit:topic-update" topic.pk %}"><i class="fa fa-pencil"></i> {% trans "edit" %}</a>
            {% elif user.pk == topic.user.pk and not topic.is_closed %}
                <a class="head-edit-link" href="{% url "spirit:topic-update" topic.pk %}"><i class="fa fa-pencil"></i> {% trans "edit" %}</a>
            {% endif %}
        </h1>

        {% if user.is_moderator %}
            <div class="topic-moderation js-tabs-container">
                <a class="dropdown-button js-tab" href="#" data-related=".js-mod-content"><i class="fa fa-cogs"></i></a>

                <div class="tab-content js-tab-content js-mod-content">
                    <ul class="menu">
                        <li><a class="menu-link js-show-move-comments" href="#" ><i class="fa fa-comments"></i> {% trans "Select comments to move" %}</a></li>

                        {% if topic.is_removed %}
                            <li><a class="menu-link" href="{% url "spirit:topic-undelete" topic.pk %}" ><i class="fa fa-trash-o"></i> {% trans "Undelete topic" %}</a></li>
                        {% else %}
                            <li><a class="menu-link" href="{% url "spirit:topic-delete" topic.pk %}" ><i class="fa fa-trash-o"></i> {% trans "Delete topic" %}</a></li>
                        {% endif %}

                        {% if topic.is_closed %}
                            <li><a class="menu-link" href="{% url "spirit:topic-unlock" topic.pk %}" ><i class="fa fa-unlock"></i> {% trans "Open topic" %}</a></li>
                        {% else %}
                            <li><a class="menu-link" href="{% url "spirit:topic-lock" topic.pk %}" ><i class="fa fa-lock"></i> {% trans "Close topic" %}</a></li>
                        {% endif %}

                        {% if topic.is_pinned %}
                            <li><a class="menu-link" href="{% url "spirit:topic-unpin" topic.pk %}" ><i class="fa fa-thumb-tack"></i> {% trans "Unpin topic" %}</a></li>
                        {% else %}
                            <li><a class="menu-link" href="{% url "spirit:topic-pin" topic.pk %}" ><i class="fa fa-thumb-tack"></i> {% trans "Pin topic" %}</a></li>
                        {% endif %}
                    </ul>
                </div>
            </div>


            <div class="move-comments" style="display:none;">
                <div class="move-container">
                    <label class="move-label">{% trans "Topic id" %}:</label><!--
                 --><div class="move-input"><input id="id_move_comments_topic" name="topic" type="text" value="" /></div><!--
                 --><a class="move-link js-move-comments" href="#move_to">{% trans "Move" %}</a>
                </div>
            </div>
        {% endif %}

        {% get_comment_list topic=topic as comments %}
        {% paginator_autopaginate comments per_page=COMMENTS_PER_PAGE as page %}

        {% include "spirit/comment/_render_list.html" %}

        <div class="container">
            {% render_paginator page %}

            <div class="notify">
                {% if user.is_authenticated %}
                    {% render_notification_form user=user topic=topic %}
                {% elif not topic.is_closed %}
                    <a class="button" href="{% url "spirit:comment-publish" topic_id=topic.pk %}">{% trans "Reply" %}</a>
                {% endif %}
            </div>
        </div>

        {% if user.is_authenticated %}
            {% if not topic.is_closed %}
                <div id="reply" class="reply">

                    <div class="comment-media">
                        <div class="comment-img">
                            <img class="comment-avatar" src="{% get_gravatar_url user=user size=50 %}" />
                        </div>

                        <div class="comment-body">
                            {% render_comments_form topic=topic %}
                        </div>
                    </div>

                </div>
            {% endif %}

            <script>
                $( document ).ready(function() {

                    $( ".comment" ).bookmark( {
                        csrfToken: "{{ csrf_token }}",
                        target: "{% url "spirit:bookmark-create" topic.pk %}",
                    } );


                    {% if user.is_moderator %}
                        $('.js-show-move-comments').move_comments( {
                            csrfToken: "{{ csrf_token }}",
                            target: "{% url "spirit:comment-move" topic.pk %}",
                        } );
                    {% endif %}

                });
            </script>
        {% endif %}

{% endblock %}