{{define "title"}}Newest Posts - Forums{{end}}
{{define "content"}}
<div class="block">
    <section class="hero is-light is-success">
        <div class="hero-body">
            <h1 class="title">
                <span class="icon mr-4"><i class="fa fa-comments"></i></span>
                <span>Forums</span>
            </h1>
            <h2 class="subtitle">
                Newest Posts
            </h2>
        </div>
    </section>
</div>

{{$Root := .}}

<div class="block p-4 mb-0">
    <div class="tabs is-boxed">
        <ul>
            <li>
                <a href="/forum">
                    Categories
                </a>
            </li>
            <li class="is-active">
                <a href="/forum/newest">
                    Newest
                </a>
            </li>
            <li>
                <a href="/forum/search">
                    <i class="fa fa-search mr-2"></i> Search
                </a>
            </li>
        </ul>
    </div>
</div>

<div class="p-4">
    Found {{FormatNumberCommas .Pager.Total}} {{if .AllComments}}posts{{else}}threads{{end}} (page {{.Pager.Page}} of {{.Pager.Pages}})

    <div class="mt-2">
        {{if not .AllComments}}
            <!-- Default view is to deduplicate and show only threads and their newest comment -->
            Showing only the latest comment per thread. <a href="?{{QueryPlus "all" "true"}}">Show all comments instead?</a>
        {{else}}
            Showing <strong>all</strong> forum posts by most recent. <a href="{{.Request.URL.Path}}">Deduplicate by thread?</a>
        {{end}}
    </div>
</div>

<div class="p-4">
    {{SimplePager .Pager}}
</div>

<div class="p-4">
    {{range .RecentPosts}}
    {{$User := .Thread.Comment.User}}
    <div class="card block has-background-link-light">
        <div class="card-content">
            <div class="columns">
                <div class="column is-narrow has-text-centered pt-0 pb-1">
                    <a href="/u/{{$User.Username}}">
                        {{template "avatar-96x96" $User}}
                        <div>
                            <a href="/u/{{$User.Username}}" class="is-size-7">{{or $User.Username "[unavailable]"}}</a>
                        </div>
                    </a>
                </div>
                <div class="column py-0">
                    <h2 class="is-size-4 pt-0">
                        <a href="/forum/thread/{{.ThreadID}}" class="has-text-dark has-text-weight-bold">
                            {{.Thread.Title}}

                            {{if .Thread.Pinned}}
                            <sup class="has-text-success fa fa-thumbtack is-size-6 ml-1"></sup>
                            {{end}}

                            {{if .Thread.PollID}}
                            <sup class="has-text-info fa fa-poll is-size-6 ml-1"></sup>
                            {{end}}

                            {{if .Thread.Explicit}}
                            <sup class="has-text-danger fa fa-fire is-size-6 ml-1"></sup>
                            {{end}}

                            {{if .Thread.NoReply}}
                            <sup class="has-text-warning-dark fa fa-ban is-size-6 ml-1"></sup>
                            {{end}}
                        </a>
                    </h2>

                    <a href="/forum/thread/{{.ThreadID}}" class="has-text-dark">
                        {{TrimEllipses .Thread.Comment.Message 256}}
                    </a>

                    {{$Photos := $Root.PhotoMap.Get .Thread.Comment.ID}}
                    {{if $Photos}}
                    <div class="is-size-7 mt-2 has-text-success">
                        <i class="fa fa-image pr-1"></i>
                        Photo attachment
                    </div>
                    {{end}}

                    <div class="is-size-7 is-italic is-grey pt-1">
                        {{if eq .Comment.ID .Thread.CommentID}}new {{end}}thread by {{.Thread.Comment.User.Username}}
                        in <a href="/f/{{.Forum.Fragment}}">
                            {{.Forum.Title}}

                            {{if .Forum.Privileged}}
                            <small class="has-text-warning-dark fa fa-peace"></small>
                            {{end}}

                            {{if .Forum.Explicit}}
                            <small class="has-text-danger fa fa-fire"></small>
                            {{end}}
                        </a>
                        &ndash;
                        {{SincePrettyCoarse .Thread.Comment.UpdatedAt}} ago
                    </div>

                    <!-- If a reply to a thread, show the reply too -->
                    {{if ne .Comment.ID .Thread.CommentID}}
                        <hr class="has-background-grey my-2">

                        <div class="columns is-multiline is-gapless mb-0">
                            <div class="column is-narrow">
                                <a href="/go/comment?id={{.Comment.ID}}" class="has-text-grey">
                                    <h2 class="is-size-5 py-0 is-italic has-text-grey">
                                        <span class="icon"><i class="fa fa-reply"></i></span>
                                        Comment added by
                                    </h2>
                                </a>
                            </div>
                            <div class="column is-narrow">

                                <div class="columns is-gapless is-mobile">
                                    <div class="column is-narrow mx-2">
                                        <a href="/u/{{.Comment.User.Username}}">
                                            {{template "avatar-32x32" .Comment.User}}
                                        </a>
                                    </div>
                                    <div class="column is-narrow">
                                        <h2 class="is-size-5 py-0">
                                            <a href="/u/{{.Comment.User.Username}}" class="has-text-dark">{{.Comment.User.Username}}</a>
                                        </h2>
                                    </div>
                                </div>

                            </div>

                        </div>

                        <a href="/go/comment?id={{.Comment.ID}}" class="has-text-dark">
                            {{TrimEllipses .Comment.Message 256}}
                        </a>

                        {{$Photos := $Root.PhotoMap.Get .Comment.ID}}
                        {{if $Photos}}
                        <div class="is-size-7 mt-2 has-text-success">
                            <i class="fa fa-image pr-1"></i>
                            Photo attachment
                        </div>
                        {{end}}

                        <div class="is-size-7 is-italic is-grey mt-1">
                            {{SincePrettyCoarse .Comment.UpdatedAt}} ago
                        </div>
                    {{end}}
                </div>
            </div>
        </div>
    </div>
    {{end}}
</div>

{{range .Categories}}
    <div class="block p-4">
        <h1 class="title">{{.Category}}</h1>

        {{if eq (len .Forums) 0}}
            <em>
                There are no forums under this category.
                {{if not $Root.CurrentUser.Explicit}}Your content filters (non-explicit) may be hiding some forums.{{end}}
            </em>
        {{else}}
            {{range .Forums}}
            {{$Stats := $Root.ForumMap.Get .ID}}
            <div class="card block has-background-primary-light">
                <div class="card-content">
                    <div class="columns">
                        <div class="column is-3 pt-0 pb-1">

                            <h2 class="is-size-4">
                                <strong><a href="/f/{{.Fragment}}">{{.Title}}</a></strong>
                            </h2>

                            <div class="content mb-1">
                                {{if .Description}}
                                    {{ToMarkdown .Description}}
                                {{else}}
                                    <em>No description</em>
                                {{end}}
                            </div>

                            <div>
                                {{if .Explicit}}
                                <span class="tag is-danger is-light">
                                    <span class="icon"><i class="fa fa-fire"></i></span>
                                    <span>Explicit</span>
                                </span>
                                {{end}}

                                {{if .Privileged}}
                                <span class="tag is-warning is-light">
                                    <span class="icon"><i class="fa fa-peace"></i></span>
                                    <span>Privileged</span>
                                </span>
                                {{end}}
                            </div>

                        </div>
                        <div class="column py-1">
                            <div class="box has-background-success-light">
                                <h2 class="subtitle mb-1">Latest Post</h2>
                                {{if $Stats.RecentThread}}
                                <a href="/forum/thread/{{$Stats.RecentThread.ID}}">
                                    <strong>{{$Stats.RecentThread.Title}}</strong>
                                </a>
                                <em>by {{$Stats.RecentThread.Comment.User.Username}}</em>
                                <div>
                                    <em>
                                    {{if and $Stats.RecentPost (not (eq $Stats.RecentPost.ID $Stats.RecentThread.CommentID))}}
                                        <small>Last comment by {{$Stats.RecentPost.User.Username}}</small>
                                    {{end}}
                                    <small title="{{$Stats.RecentThread.UpdatedAt.Format "2006-01-02 15:04:05"}}">{{SincePrettyCoarse $Stats.RecentThread.UpdatedAt}} ago</small>
                                    </em>
                                </div>
                                {{else}}
                                    <em>No posts found.</em>
                                {{end}}
                            </div>
                        </div>
                        <div class="column is-3 py-1">
                            <div class="columns is-mobile is-gapless">
                                <div class="column has-text-centered mr-1">
                                    <div class="box has-background-warning-light p-2">
                                        <p class="is-size-7">Topics</p>
                                        {{if $Stats}}
                                            {{$Stats.Threads}}
                                        {{else}}
                                            err
                                        {{end}}
                                    </div>
                                </div>
                                <div class="column has-text-centered mx-1">
                                    <div class="box has-background-warning-light p-2">
                                        <p class="is-size-7">Posts</p>
                                        {{if $Stats}}
                                            {{$Stats.Posts}}
                                        {{else}}
                                            err
                                        {{end}}
                                    </div>
                                </div>
                                <div class="column has-text-centered ml-1">
                                    <div class="box has-background-warning-light p-2">
                                        <p class="is-size-7">Users</p>
                                        {{if $Stats}}
                                            {{$Stats.Users}}
                                        {{else}}
                                            err
                                        {{end}}
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
            {{end}}
        {{end}}
    </div>
{{end}}<!-- range .Categories -->

<div class="p-4">
    {{SimplePager .Pager}}
</div>

{{end}}