{% extends 'musette/base_musette.html' %}

{% load i18n %}
{% load static %}
{% load hitcount_tags %}
{% load forum_tags %}
{% load photo %}

{% block extra_js %}
<script type="text/javascript">
    $('[data-toggle="tooltip"]').tooltip();
</script>
{% endblock %}

{% block meta %}
    <meta property="og:title" content="{{ SETTINGS.SITE_NAME }} - {{ forum.name }}" />
    <meta property="og:url" content="{{ request.build_absolute_uri }}" />
    <meta property="og:type" content="website">
    <meta name="twitter:url" content="{{ request.build_absolute_uri }}">
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:title" content="{{ SETTINGS.SITE_NAME }} - {{ forum.name }}">
    <meta name="description" content="{{ forum.description }}">
    <meta property="og:description" content="{{ forum.description }}">
    <meta name="twitter:description" content="{{ forum.description }}">

    <title> {{ SETTINGS.SITE_NAME }} - {{ forum.name }} </title>
{% endblock %}

{% block content %}

<div class="container" id="forum-controller">
    {% if has_message_forum %}
        <div class="alert alert-info" role="alert">
            <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
            {{ message_forum|safe }}
        </div>
    {% endif %}

    <div class="btn-group show-on-hover">
        <button type="button" class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown">
            {{ forum }} <span class="caret"></span>
        </button>
        <ul class="dropdown-menu" role="menu">
            <li><a href="{% url 'forums' %}">{% trans "Forums" %}</a></li>
            <li role="separator" class="divider"></li>    
            {% if forum.parent %}
                <li><a href="{% url 'forum' forum.category forum.parent %}">{{ forum.parent }}</a></li>
            {% endif %}
            <li class="active"><a href="#">{{ forum }}</a></li>
        </ul>
    </div>
    
    {% if forums_childs|length > 0 %}
        <div class="btn-group show-on-hover">
            <button type="button" class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown">
                Sub-{% trans "Forums" %} <span class="caret"></span>
            </button>
            <ul class="dropdown-menu" role="menu">    
                {% for forum in forums_childs %}
                    <li><a href="{% url 'forum' forum.category forum.name %}">{{ forum.name }}</a></li>
                {% endfor %}
            </ul>
        </div>
    {% endif %}

    <hr />

    {% get_hit_count for forum as total_hits %}

    {% if forum.is_moderate %}
        {% if user in forum.moderators.all %}
            {% if forum|get_tot_topics_moderate > 0 %}
                <div class="alert alert-success" role="alert">
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
                    <p>{% trans "The forum "%} {{forum.name}} {% trans "is pending moderation" %}</p>
                </div> 
            {% endif %}
        {% endif %}
    {% endif %}
 
    <div class="row">
        <div class="pull-left">
            {% if not user.user.is_troll %}
                {% if register or user.is_superuser or user in forum.moderators.all %}
                    <div class="col-md-5 text-left">
                        {% with 'newtopic' as name_url %}
                        <button onclick="window.location = '{% url name_url forum.category forum.name %}'" class="btn btn-inverse btn-sm"><i class="fa fa-plus"></i> {% trans "New topic" %}</button>
                        {% endwith %}
                    </div>
                    {% if not user.is_superuser and not user in forum.moderators.all %}
                    <div class="col-md-4 text-right">
                        <form method="POST" action="{% url 'unregister' forum.category forum %}">
                            {% csrf_token %}
                            <button type="submit" class="btn btn-inverse btn-sm"><i class="fa fa-hand-o-up"></i> {% trans "Unregister" %}</button>
                        </form>
                    </div>
                    {% endif %}
                {% else %}
                    <form method="POST" action="{% url 'new_register' forum.category forum %}" class="col-md-5 text-left">
                        {% csrf_token %}
                        <button type="submit" class="btn btn-inverse btn-sm"><i class="fa fa-hand-o-up"></i> {% trans "Join to forum" %}</button>
                    </form>
                {% endif %}
            {% endif %}
        </div>
        <div class="pull-right">
            <div class="col-md-10">
                <div class="inner-addon right-addon">
                    <i class="fa fa-search"></i>
                    <input type="text" class="form-control" v-model="search_text" placeholder="{% trans 'Find Topics' %}" 
                        v-on:keyup.enter="search('{{forum.category.name}}','{{forum.name}}')" />
                </div>
            </div>
            <div class="col-md-2">
                <a href="{% url 'rss' forum.category forum %}"><img src="{% static 'musette/img/feed.png' %}" />
                    <small>Rss</small>
                </a>
            </div>
        </div>
    </div>
    <br>

    <div class="table-responsive">
        <table class="table table-striped table-bordered">
            <thead>
                <tr>
                <th><i class="fa fa-square" aria-hidden="true"></i> {% trans "Title" %}</th>
                <th><i class="fa fa-history"></i> {% trans "Last activity" %}</th>
                <th><i class="fa fa-comments" aria-hidden="true"></i> {% trans "Comments" %}</th>
                <th><i class="fa fa-eye" aria-hidden="true"></i> {% trans "Views" %}</th>
                </tr>
            </thead>
            <tbody id="forums-items" v-endless-pagination="{'paginateOnScroll': true, 'paginateOnScrollMargin': 180}">
                {% include "musette/forum.html" %}
            </tbody>
        </table>
    </div>

    <div class="pull-left">
        <p><i class="fa fa-history"></i> {% trans "Created" %}: {{forum.date.date}}</p>
        <p>
            {% if total_hits|add:"0" > 1 %}
                <span style="font-size: 0.8em">({% trans "This forum has" %} {{ total_hits }} {% trans "views" %})</span>
            {% else %}
                <span style="font-size: 0.8em">({% trans "This forum has" %} {{ total_hits }} {% trans "view" %})</span>
            {% endif %}
        </p>
    </div>
    <div class="pull-right">
        <p><a href="{% url 'users_forum' forum.category forum %}"> <i class="fa fa-user"></i> {% trans "Forum members" %}</a></p>
        <strong><i class="fa fa-map-o"></i><small> {% trans "Topics" %}: {{forum.topics_count}}</small></strong>
        {% if forum.is_moderate %}
            {% for moderate in forum.moderators.all %}
                {% if moderate == user %}
                    {% if forum|get_tot_topics_moderate > 0 %}
                        <strong><small> ({% trans "Missing for moderate" %}: {{forum|get_tot_topics_moderate}})</small></strong>
                    {% endif %}
                {% endif %}
            {% endfor %}
        {% endif %}
    </div>



</div>

{% endblock %}

{% block hitcount_javascript %}
{% insert_hit_count_js_variables for forum %}

{% endblock %}
