PancakesWeb/PancakesWeb/Components/Pages/Home.razor

@page "/"
@using System.ComponentModel.DataAnnotations
@using System.Text.Json
@using PancakesWeb.Data
@using PancakesWeb.Schema

<PageTitle>Home</PageTitle>

<main class="container">
    <h1 id="pancakes">pancakes</h1>
    <p>I'm a cat <abbr title="non-binary">enby</abbr> (<abbr
                                                           title="they/them/their/theirs/themself or it/it/its/its/itself in English">they/it</abbr>) from Australia
        that likes cats, Linux, and programming. You can find my links, projects, and other pages here.</p>

    <h2 id="accounts">Accounts</h2>
    <p>Other places you can find me</p>

    <ul class="accounts">
        @foreach (var link in Links.Accounts)
        {
            <li class="account card">
                <img src="@Assets[$"imgs/icons/{link.Icon}"]" alt="" aria-hidden="true"
                     class="@(link.IconInvert ? "account-img img-invert" : "account-img")">
                <span class="account-details">
                    @if (link.Href != null)
                    {
                        <a href="@link.Href" target="_blank">@link.Name</a>
                    }
                    else
                    {
                        <span>@link.Name</span>
                    }
                    <span class="account-username">@link.Description</span>
                </span>
            </li>
        }
    </ul>

    <h2 id="blog-posts">Blog Posts</h2>
    <p>Things I've written. Licensing can be found in the appropriate page footers</p>

    @* TODO: Add blog index *@

    <h2 id="projects">Projects</h2>
    <p>Projects that I have created</p>

    <ul class="links">
        @foreach (var link in Links.Projects)
        {
            <li class="link card">
                @if (link.Href != null)
                {
                    <a href="@link.Href" target="_blank" class="link-heading">@link.Name</a>
                }
                else
                {
                    <span class="link-heading">@link.Name</span>
                }
                <p>@link.Description</p>
            </li>
        }
    </ul>

    <h2 id="contributions">Contributions</h2>
    <p>Projects that I do not maintain but have contributed to</p>

    <ul class="links">
        @foreach (var link in Links.Contributions)
        {
            <li class="link card">
                @if (link.Href != null)
                {
                    <a href="@link.Href" target="_blank" class="link-heading">@link.Name</a>
                }
                else
                {
                    <span class="link-heading">@link.Name</span>
                }
                <p>@link.Description</p>
            </li>
        }
    </ul>

    <h2 id="buttons">Buttons</h2>
    <p>Click my buttons</p>

    <ImageButton Data="@Buttons.Pancakes"/>
    <details>
        <summary>Add my button</summary>
        <pre><code>&lt;a href="@Buttons.Pancakes.Href" target="_blank"&gt;
    &lt;img src="@Buttons.Pancakes.Href@Assets[$"imgs/buttons/{Buttons.Pancakes.Image}"]" alt"@Buttons.Pancakes.Title"&gt;
&lt;/a&gt;</code></pre>
        <p>The image URL may change in the future. Instead of hotlinking it you should <a href="@Assets[$"imgs/buttons/{Buttons.Pancakes.Image}"]" download="pancakes.png">download the image</a> manually.</p>
    </details>

    <ul class="buttons card">
        @foreach (var button in Buttons.Entities.OrderBy(p => p.Title))
        {
            <li class="button">
                <ImageButton Data="button"/>
            </li>
        }
    </ul>

    <ul class="buttons card">
        @foreach (var button in Buttons.Things.OrderBy(p => p.Title))
        {
            <li class="button">
                <ImageButton Data="button"/>
            </li>
        }
    </ul>

    <h2 id="webrings">Webrings</h2>
    <p>Adjacent websites</p>

    <ul class="accounts">
        @foreach (var ring in Webrings.Rings.OrderBy(p => p.Name))
        {
            <li class="account card">
                <a href="@ring.PrevUrl" class="no-decorations">←</a>
                <a href="@ring.MainUrl">@ring.Name</a>
                <a href="@ring.NextUrl" class="no-decorations">→</a>
            </li>
        }
    </ul>

    <h2 id="notify">Notify</h2>
    <p>Send me a push notification. This will be a silent notification on my phone with no popup, vibration, or sound.</p>

    <EditForm Model="Ntfy" OnValidSubmit="SubmitNtfy" FormName="Ntfy">
        <DataAnnotationsValidator/>
        <InputText @bind-Value="Ntfy.Message" maxlength="128" placeholder="Message"/>
        <button type="submit">Send</button>
        <ValidationSummary/>
    </EditForm>
</main>

@code {
    [Inject] private HttpClient Http { get; set; } = null!;
    [Inject] private IConfiguration Config { get; set; } = null!;

    [SupplyParameterFromForm] private NtfyModel Ntfy { get; set; } = new NtfyModel();

    private async Task SubmitNtfy()
    {
        var ntfy = new NtfyRequest
        {
            Topic = Config["Ntfy:Topic"]!,
            Message = Ntfy.Message,
            Title = "pancakes.gay",
            Priority = 2,
            Tags = ["black_cat"]
        };

        await Http.PostAsJsonAsync(Config["Ntfy:Url"], ntfy, JsonSerializerOptions.Web);
    }

    public class NtfyModel
    {
        [StringLength(128)]
        public string Message { get; set; } = "";
    }
}