{% extends 'master.twig' %}

{% set forumBackLink = route('forums.forum', forum.id) %}
{% set title = topic is defined ? topic.title : 'Creating topic in ' ~ forum.name %}

{% if topic is defined %}
    {% if forum.perms.reply
        and (
        topic.status != 1
        or forum.perms.changeStatus
        ) %}
        {% set forumReplyLink %}#reply{% endset %}
    {% endif %}

    {% if forum.perms.changeType
        or forum.perms.changeStatus
        or forum.perms.topicMove
        or forum.perms.deleteAny %}
        {% set showMod = true %}
    {% endif %}

    {% if forum.perms.changeType %}
        {% set forumSticky = topic.type == 1 ? true : false %}
        {% set forumAnnounce = topic.type == 2 ? true : false %}
    {% endif %}

    {% if forum.perms.changeStatus %}
        {% set forumLock = topic.status == 1 ? true : false %}
    {% endif %}

    {% if forum.perms.topicMove %}
        {% set forumMove = true %}

        {% if topic.oldForum %}
            {% set forumRestore = true %}
        {% endif %}

        {% if topic.forum != config('forum.trash') %}
            {% set forumTrash = true %}
        {% endif %}
    {% endif %}

    {% if forum.perms.deleteAny %}
        {% if topic.forum == config('forum.trash') %}
            {% set forumPrune = true %}
        {% endif %}
    {% endif %}

    {% set posts = topic.posts|batch(10) %}

    {% set paginationPages = posts %}
    {% set paginationUrl = route('forums.topic', topic.id) %}
{% endif %}

{% block js %}
    <script type="text/javascript">
        function deletePost(id) {
            var confirm = new Sakura.Dialogue;
            confirm.SetType(Sakura.DialogueType.Confirm);
            confirm.Title = "Deleting post " + id;
            confirm.Text = "Are you sure?";
            confirm.AddCallback(Sakura.DialogueButton.Yes, function () {
                var deleter = new Sakura.AJAX;
                deleter.SetUrl("{{ route('forums.post.delete', 1) }}".replace('1', id));
                deleter.AddCallback(200, function () {
                    Sakura.DOM.Remove(Sakura.DOM.ID('p' + id));
                });
                deleter.AddCallback(0, function () {
                    var error = new Sakura.Dialogue;
                    error.Title = "Error";
                    error.Text = "Deletion failed!";
                    error.Display();
                });
                deleter.Start(Sakura.HTTPMethod.DELETE);
                this.Close();
            });
            confirm.Display();
        }

        {% if forumMove is defined %}
        function yuunoMoveTopic() {
            var btn = Sakura.DOM.ID('topic-move-btn'),
                moveDiag = new Sakura.Dialogue,
                client = new Sakura.AJAX,
                title = "Moving topic '{{ topic.title }}'",
                unsetSpinner = function () {
                    Sakura.DOM.RemoveClass(btn, ['input__button--disabled']);
                    btn.innerHTML = '<i class="fa fa-arrow-circle-o-right"></i>';
                };

            Sakura.DOM.AddClass(btn, ['input__button--disabled']);
            btn.innerHTML = '<i class="fa fa-spinner fa-spin"></i>';

            moveDiag.Title = title;

            client.SetUrl("{{ route('forums.move-destinations') }}");
            client.AddCallback(200, function () {
                unsetSpinner();

                moveDiag.SetType(Sakura.DialogueType.OKCancel);
                moveDiag.Text = "Select a destination...";
                moveDiag.DropDownItems.AddObject(client.JSON());
                moveDiag.AddCallback(Sakura.DialogueButton.Ok, function () {
                    var returnDiag = new Sakura.Dialogue;

                    client.Reset();
                    client.SetUrl("{{ route('forums.topic.move', topic.id) }}");
                    client.Form();
                    client.SetSend({
                        "session": Sakura.Config.SessionId,
                        "destination": moveDiag.DropDownSelected.Key
                    });

                    client.AddCallback(200, function () {
                        window.location.assign(client.Response());
                    });
                    client.AddCallback(404, function () {
                        returnDiag.Title = "Error";
                        returnDiag.Text = "Destination forum doesn't exist!";
                        returnDiag.Display();
                    });
                    client.AddCallback(403, function () {
                        returnDiag.Title = "Error";
                        returnDiag.Text = "You aren't allowed to move topics!";
                        returnDiag.Display();
                    });
                    client.AddCallback(0, function () {
                        returnDiag.Title = "Something happened!";
                        returnDiag.Text = "Something happened!";
                        returnDiag.Display();
                    });

                    client.Start(Sakura.HTTPMethod.POST);
                    moveDiag.Close();
                });
                moveDiag.Display();
            });
            client.AddCallback(0, function () {
                unsetSpinner();

                moveDiag.Text = "Failed to fetch destinations.";
                moveDiag.Display();
            });

            client.Start(Sakura.HTTPMethod.GET);
        }
        {% endif %}

        hljs.initHighlightingOnLoad();
    </script>
{% endblock %}

{% block content %}
    <div class="content">
        <div class="content__header">
            {{ forum.name }} / <span id="topicTitle">
                {{ topic.title|default(null) }}
            </span>
        </div>

        {% include 'forum/elements/forumBtns.twig' %}

        <div class="posts">

            {% if topic is defined %}

                {% set postingAction = route('forums.topic.reply', topic.id) %}

                {% for post in posts[get.page|default(1) - 1] %}
                    <div class="post" id="p{{ post.id }}">
                        <div class="post__details">
                            <div class="post__user">
                                {% if post.poster.activated or post.poster.restricted %}
                                    <a class="post__username" href="{{ route('user.profile', post.poster.id) }}" style="color: {{ post.poster.colour }}; text-shadow: 0 0 5px {% if post.poster.colour != 'inherit' %}{{ post.poster.colour }}{% else %}#222{% endif %}">
                                        {{ post.poster.username }}
                                    </a>
                                    <div class="avatar avatar--border post__avatar" style="background-image: url('{{ route('user.avatar', post.poster.id) }}')"></div>

                                    <div class="post__usertitle">{{ post.poster.title }}</div>

                                    <img src="/images/tenshi.png" alt="Tenshi"{% if not post.poster.isPremium %} style="opacity: 0;"{% endif %}>
                                    <img src="/images/flags/{{ post.poster.country|lower }}.png" alt="{{ post.poster.country }}" title="{{ post.poster.country(true) }}">

                                    {% if post.poster.id == (topic.posts|first).poster.id %}
                                        <img src="/images/op.png" alt="OP" title="Original Poster">
                                    {% endif %}
                                {% else %}
                                    <span class="post__username post__username--deleted">deleted user</span>
                                {% endif %}
                            </div>

                            {% if user.isActive %}
                                <div class="post__actions">
                                    {% if (user.id == post.poster.id and forum.perms.edit) or forum.perms.editAny %}
                                        <a class="post__action fa fa-pencil-square-o" title="Edit this post" href="javascript:void(0);" onclick="editPost({{ post.id }});"></a>
                                    {% endif %}
                                    {% if (user.id == post.poster.id and forum.perms.delete) or forum.perms.deleteAny %}
                                        <a class="post__action fa fa-trash" title="Delete this post" href="javascript:;" onclick="deletePost({{ post.id }})"></a>
                                    {% endif %}
                                    {% if not (post.poster.activated or post.poster.restricted or user.id == post.poster.id) %}
                                        <a class="post__action fa fa-{% if user.isFriends(post.poster.id) == 2 %}heart{% else %}star{% endif %} friend-{{ post.poster.id }}-level" title="You are friends" {% if user.isFriends(post.poster.id) == 0 %}style="display: none;"{% endif %}></a>
                                        <a class="post__action fa fa-user-{% if user.isFriends(post.poster.id) == 0 %}plus{% else %}times{% endif %} forum-friend-toggle friend-{{ post.poster.id }}-toggle" title="{% if user.isFriends(post.poster.id) == 0 %}Add {{ post.poster.username }} as a friend{% else %}Remove friend{% endif %}" href="javascript:void(0);" onclick="Sakura.Friend.{% if user.isFriends(post.poster.id) == 0 %}Add({{ post.poster.id }}){% else %}Remove({{ post.poster.id }}){% endif %}"></a>
                                        <a class="post__action fa fa-flag" title="Report {{ post.poster.username }}" href="{{ route('user.report', post.poster.id) }}"></a>
                                    {% endif %}
                                    <a class="post__action fa fa-reply" title="Quote this post" href="javascript:void(0);" onclick="Sakura.Editor.QuotePost({{ post.id }}, '{{ post.poster.username }}', pText);"></a>
                                </div>
                            {% endif %}
                        </div>
                        <div class="post__contents">
                            <div class="post__info">
                                <a href="#p{{ post.id }}" class="post__title">
                                    {{ post.subject|slice(0, 50) }}{% if post.subject|length > 50 %}...{% endif %}
                                </a>
                                <a href="{{ route('forums.post', post.id) }}" class="post__date">
                                    #{{ post.id }} - <time class="time-ago" datetime="{{ post.time|date('r') }}">
                                        {{ post.time|date(config('general.date_format')) }}
                                    </time>
                                </a>
                            </div>

                            <div class="post__text bbcode">
                                {{ post.parsed|raw }}
                            </div>

                            {% if post.poster.signature and post.poster.perms.changeSignature %}
                                <div class="post__signature bbcode">
                                    {{ post.poster.signature|raw|nl2br }}
                                </div>
                            {% endif %}
                        </div>
                    </div>
                {% endfor %}

            {% else %}

                {% set postingAction = route('forums.new', forum.id) %}

            {% endif %}

            {% if forumReplyLink is defined or topic is not defined %}
                <div class="post" id="postingPreview"{% if topic is defined %} style="display: none;"{% endif %}>
                    <div class="post__details">
                        <div class="post__user">
                            <a class="post__username" href="{{ route('user.profile', user.id) }}" style="color: {{ user.colour }}; text-shadow: 0 0 5px {% if user.colour != 'inherit' %}{{ user.colour }}{% else %}#222{% endif %}">
                                {{ user.username }}
                            </a>
                            <div class="avatar avatar--border post__avatar" style="background-image: url('{{ route('user.avatar', user.id) }}')"></div>

                            <div class="post__usertitle">{{ user.title }}</div>

                            <img src="/images/tenshi.png" alt="Tenshi"{% if not user.isPremium %} style="opacity: 0;"{% endif %}>
                            <img src="/images/flags/{{ user.country|lower }}.png" alt="{{ user.country }}" title="{{ user.country(true) }}">

                            {% if not topic is defined %}
                                <img src="/images/op.png" alt="OP" title="Original Poster">
                            {% endif %}
                        </div>
                    </div>
                    <div class="post__contents">
                        <div class="post__info">
                            <span id="previewTitle" class="post__title">
                                {% if topic is defined %}Re: {{ topic.title }}{% endif %}
                            </span>
                            <span id="previewMode" class="post__date">
                                Preview
                            </span>
                        </div>

                        <div class="post__text bbcode" id="previewText"></div>

                        {% if user.signature and user.perms.changeSignature %}
                            <div class="post__signature bbcode">
                                {{ user.signature|raw|nl2br }}
                            </div>
                        {% endif %}
                    </div>
                </div>
            {% endif %}

        </div>

        {% if forumReplyLink is defined or topic is not defined %}
            {% include 'forum/elements/replyForm.twig' %}
        {% endif %}

        {% include 'forum/elements/forumBtns.twig' %}
    </div>
{% endblock %}