<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<th:block th:fragment="tweet-list">
    <main>
        <th:block th:if="${null != pageQuery}">
            <th:block th:each="post, iterStat : ${pageQuery.records}">
                <th:block th:with="postHasPassword=${!PostPassJar.validFromSession(request.session, post)},
                                   postStatistic=${@statisticsService.getPostStatistic(post, '###,###')}">
                    <article th:class="${!postHasPassword}?'post index-page':'post index-page post-lock'"
                        th:attr="post-id=${post.postId},id=${'post-' + post.postId}">
                    <header>
                        <div class="tweet-author">
                            <img class="avatar" referrerpolicy="same-origin" loading="lazy" width="36" height="36"
                                 th:src="${post.avatarUrl}" th:attr="alt=${post.creatorNickname}">
                        
                            <div class="author-name">
                                <b><a th:href="@{${post.link}}" title="查看详情">[[${post.creatorNickname}]]</a></b>
                            </div>
                            <div class="author-date">
                                <small th:attr="title=${#temporals.format(post.createTime, 'yyyy-MM-dd HH:mm:ss')}">
                                [[${AgoUtils.ago(post.createTime)}]]
                                </small>
                            </div>
                        </div>
                    </header>
                        <th:block th:if="${!postHasPassword}">
                            <div class="post-content"
                            th:utext="${@markdownService.renderPostPreface(post)}">
                            </div>
                            <div class="post-meta">
                                <div 
                                    th:with="categoriesFriendlyName=${post.categoriesFriendlyNamesEncoded},
                                             tagsFriendlyName = ${post.tagsFriendlyNamesEncoded}">
                                    <th:block 
                                        th:if="${!#strings.isEmpty(post.categoriesName)}"
                                        th:each="cate, i : ${#strings.arraySplit(post.categoriesName, ',')}">
                                        <a class="cate" rel="cate" th:href="@{'/tweet/category/' + ${categoriesFriendlyName[i.index]}}">
                                            <th:block th:text="${cate}"></th:block>
                                        </a>
                                    </th:block>
                                    <th:block
                                        th:if="${!#strings.isEmpty(post.tagsName)}"
                                        th:each="tag, i : ${#strings.arraySplit(post.tagsName, ',')}">
                                        <a 
                                        th:classappend="'macaron-tag-' + ${i.index % 8}"
                                        class="tag" rel="tag" th:href="@{'/tweet/tag/' + ${tagsFriendlyName[i.index]}}">
                                            <th:block th:text="${'#'+tag}"></th:block>
                                        </a>
                                    </th:block>
                                </div>
                            </div>
                            <div class="statistic">
                                <p>
                                    <a href="#" class="tweet-make-comment"
                                    th:attr="post-id=${post.postId}"
                                    title="发表评论">
                                        <i class="post-icon icon-comment"></i>
                                        发表评论[[${post.commentCount > 0 ? '(' + post.commentCount +')' : ''}]]
                                    </a>
                                </p>
                            </div>
                        </th:block>
                        <th:block th:if="${postHasPassword}">
                            <div class="post-content">
                                <p>这是一篇加密说说，请输入密码后查看</p>
                            </div>
                        </th:block>
                    </article>
                    <div class="comment-area" th:attr="post-id=${post.postId}">
                        <th:block th:if="${!postHasPassword}">
                            <div id="comment-page"
                             th:with="commentPage = ${@commentService.getPostCommentPage(1, @tweetConfig.commentPageSize, post.postId)},
                                      enableComment = ${post.enableComment},
                                      commentPaginationPrefix = ${post.link + '/'}"
                             class="comment-page tweet-list-comment">
                                <th:block th:insert="~{blog/bleaching/comment::tweet-comment-list}"></th:block>
                             </div>
                        </th:block>
                        <comment th:replace="~{blog/bleaching/comment::reply-comment}"></comment>
                    </div>
                </th:block>
            </th:block>
        </th:block>
        <th:block th:if="${null == pageQuery or pageQuery.total == 0}">
            <article class="post index-page">
                <header>
                    <div class="post-content">没有找到内容<br/>No result found.
                    </div>
                </header>
            </article>
        </th:block>
    <ol class="page-navigator"
        th:attr="data-pagination-prefix=${pageQuery.paginationPrefix}">
        <th:block th:if="${pageQuery.pages >= 1}">
            <th:block th:if="${pageQuery.current > 2}">
                <li>
                    <a th:href="@{${pageQuery.paginationPrefix} + 1}">1</a>
                </li>
                <li th:if="${pageQuery.current > 3}">
                    <span>...</span>
                </li>
            </th:block>
            <th:block th:if="${pageQuery.pages > 1}" 
                th:each="page : 
                    ${#numbers.sequence(
                        T(java.lang.Math).max(pageQuery.current - 1, 1L), 
                        T(java.lang.Math).min(pageQuery.current + 1, pageQuery.pages))}" >
                <li th:class="${pageQuery.current == page}?current">
                    <a th:href="@{${pageQuery.paginationPrefix} + ${page}}" th:text="${page}"></a>
                </li>
            </th:block>
            <th:block th:if="${pageQuery.current < pageQuery.pages - 1}">
                <li th:if="${pageQuery.current < pageQuery.pages - 2}">
                    <span>...</span>
                </li>
                <li>
                    <a th:href="@{${pageQuery.paginationPrefix} + ${pageQuery.pages}}" th:text="${pageQuery.pages}"></a>
                </li>
            </th:block>
        </th:block>
    </ol>
    <footer th:replace="~{blog/bleaching/footer::footer}"></footer>
    </main>
</th:block>
</html>