{% extends 'global/master.twig' %}

{% set title = 'Forums' %}

{% block content %}
    <div class="content homepage forum">
        <div class="content-right content-column">
            <div id="forumIndexPopularTopics">
                <div class="head">Popular topics</div>
                <table class="panelTable" style="border-spacing: 0;">
                    <tr>
                        <th>Title</th>
                        <th>Last reply</th>
                    </tr>
                    {% for _t in activeTopics %}
                        <tr {% if _t.unread(user.id) %}style="font-weight: bold;"{% endif %}>
                            <td style="text-align: left; border-bottom: 1px solid #9475b2;">
                                <a href="{{ route('forums.topic', _t.id) }}" class="default">{{ _t.title }}</a>
                            </td>
                            <td class="rightAlign" style="border-bottom: 1px solid #9475b2;"><time datetime="{{ _t.lastPost.time|date('r') }}">{{ _t.lastPost.time|date('D Y-m-d H:i:s T') }}</time></td>
                        </tr>
                    {% endfor %}
                </table>
            </div>
            <div id="forumIndexNewPosts">
                <div class="head">Latest posts</div>
                <table class="panelTable" style="border-spacing: 0;">
                    <tr>
                        <th>Title &amp; user</th>
                        <th>Posted</th>
                    </tr>
                    {% for _p in latestPosts %}
                        <tr {% if _p.unread(user.id) %}style="font-weight: bold;"{% endif %}>
                            <td style="text-align: left; border-bottom: 1px solid #9475b2;">
                                <a href="{{ route('forums.post', _p.id) }}" class="default">{{ _p.subject }}</a>
                                by
                                <a href="{{ route('user.profile', _p.poster.id) }}" class="default"><span style="color: {{ _p.poster.colour }};">{{ _p.poster.username }}</span></a>
                            </td>
                            <td class="rightAlign" style="border-bottom: 1px solid #9475b2;"><time datetime="{{ _p.time|date('r') }}">{{ _p.time|date('D Y-m-d H:i:s T') }}</time></td>
                        </tr>
                    {% endfor %}
                </table>
            </div>
            <div id="forumMostActivePoster">
                <div class="head">Today's most active poster</div>
                {% if activePoster.id %}
                    <a class="clean" href="{{ route('user.profile', activePoster.id) }}">
                        <div class="user-container" style="background-image: url({{ route('user.header', activePoster.id) }});">
                            <div class="default-avatar-setting user-container-avatar" style="background-image: url({{ route('file.avatar', activePoster.id) }}); box-shadow: 0 0 5px #{% if activePoster.isOnline %}484{% else %}844{% endif %};"></div>
                            <div class="user-container-info">
                                <h1 style="color: {{ activePoster.colour }}; text-shadow: 0 0 7px {% if activePoster.colour != 'inherit' %}{{ activePoster.colour }}{% else %}#222{% endif %}; padding: 0 0 2px;" {% if activePoster.getUsernameHistory %} title="Known as {{ activePoster.getUsernameHistory[0].username_old }} before {{ activePoster.getUsernameHistory[0].change_time|date('D Y-m-d H:i:s T') }}." {% endif %}>{{ activePoster.username }}</h1>
                                {% if activePoster.isPremium %}<img src="/images/tenshi.png" alt="Tenshi" style="vertical-align: middle;"> {% endif %}<img src="/images/flags/{{ activePoster.country|lower }}.png" alt="{{ activePoster.country }}" style="vertical-align: middle;" title="{{ activePoster.country(true) }}"> <span style="font-size: .8em;">{{ activePoster.title }}</span>
                            </div>
                        </div>
                    </a>
                {% else %}
                    <h1 class="stylised" style="margin: 1em 0; text-align: center;">No one yet!</h1>
                {% endif %}
            </div>
        </div>
        <div class="content-left content-column">
            {% include 'forum/elements/forumBase.twig' %}
        </div>
        <div class="clear"></div>
    </div>
{% endblock %}