@page
@using Humanizer
@using OliverBooth.Data.Blog
@using OliverBooth.Services
@model OliverBooth.Pages.Blog.Index
@inject BlogService BlogService

@foreach (BlogPost post in BlogService.AllPosts)
{
    BlogService.TryGetAuthor(post, out Author? author);
    DateTimeOffset published = post.Published;
    DateTimeOffset timestamp = post.Updated ?? published;
    bool isUpdated = post.Updated.HasValue;
    var year = published.ToString("yyyy");
    var month = published.ToString("MM");
    var day = published.ToString("dd");

    <div class="card blog-card" style="margin-bottom: 50px;">
        <div class="card-body">
            <h2>
                <a asp-page="/blog/article"
                   asp-route-year="@year"
                   asp-route-month="@month"
                   asp-route-day="@day"
                   asp-route-slug="@post.Slug">
                    @post.Title
                </a>
            </h2>

            <p class="text-muted">
                <img class="blog-author-icon" src="https://gravatar.com/avatar/@author?.AvatarHash?s=28" alt="@author?.Name">
                @author?.Name &bull;

                <abbr data-bs-toggle="tooltip" data-bs-title="@timestamp.ToString("f")">
                    @(isUpdated ? "Updated" : "Published") @timestamp.Humanize()
                </abbr>

                @if (post.EnableComments)
                {
                    <span> &bull;</span>
                    <a asp-page="/blog/article"
                       asp-fragment="disqus_thread"
                       asp-route-year="@year"
                       asp-route-month="@month"
                       asp-route-day="@day"
                       asp-route-slug="@post.Slug"
                       data-disqus-identifier="@post.GetDisqusIdentifier()">
                        0 Comments
                    </a>
                }
            </p>

            <p>@Html.Raw(BlogService.GetExcerpt(post, out bool trimmed))</p>

            <article>
                @if (trimmed)
                {
                    <p>
                        <a asp-page="/blog/article"
                           asp-route-year="@year"
                           asp-route-month="@month"
                           asp-route-day="@day"
                           asp-route-slug="@post.Slug">
                            Read more...
                        </a>
                    </p>
                }
            </article>
        </div>
    </div>

    <script id="dsq-count-scr" src="https://oliverbooth-dev.disqus.com/count.js" async></script>
}