Files
Swarm/DysonNetwork.Zone/Pages/About.cshtml
2025-11-22 01:47:10 +08:00

244 lines
12 KiB
Plaintext

@page
@using NodaTime.Serialization.Protobuf
@model AboutModel
@{
Layout = "_LayoutContained";
}
@if (Model.UserAccount != null)
{
@if (!string.IsNullOrEmpty(Model.UserBackgroundUrl))
{
<img src="@Model.UserBackgroundUrl" class="w-full max-h-48 object-cover mb-8" alt="Background Image"/>
}
<div class="container mx-auto px-8 pb-8">
<div class="flex items-center gap-6 mb-8">
@if (!string.IsNullOrEmpty(Model.UserPictureUrl))
{
<img src="@Model.UserPictureUrl" class="w-20 h-20 rounded-full object-cover" alt="Avatar"/>
}
else
{
<div class="w-20 h-20 rounded-full bg-gray-300 flex items-center justify-center">
<span class="text-2xl">@(Model.UserAccount.Name != null ? Model.UserAccount.Name[0] : '?')</span>
</div>
}
<div>
<div class="text-2xl font-bold">
@(Model.UserAccount.Nick ?? Model.UserAccount.Name)
</div>
<div class="text-body-2 text-base-content/60">@@@Model.UserAccount.Name</div>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="flex flex-col gap-4">
<div class="card bg-base-100 border">
<div class="card-body">
<h2 class="card-title"><span class="mdi mdi-home"></span> Info</h2>
<div class="space-y-2">
@if (!string.IsNullOrEmpty(Model.UserAccount.Profile?.TimeZone))
{
<div class="flex justify-between">
<span class="flex gap-2">
<span class="mdi mdi-map-clock"></span>
Time Zone
</span>
<span class="text-right">
@Model.GetCurrentTimeInTimeZone(Model.UserAccount.Profile.TimeZone)
<span class="text-base-content/50">·</span>
@Model.GetOffsetUtcString(Model.UserAccount.Profile.TimeZone)
<span class="text-base-content/50">·</span>
@Model.UserAccount.Profile.TimeZone
</span>
</div>
}
@if (!string.IsNullOrEmpty(Model.UserAccount.Profile?.Location))
{
<div class="flex justify-between">
<span class="flex gap-2">
<span class="mdi mdi-map-marker"></span> Location
</span>
<span>@Model.UserAccount.Profile.Location</span>
</div>
}
@if (!string.IsNullOrEmpty(Model.UserAccount.Profile?.FirstName) || !string.IsNullOrEmpty(Model.UserAccount.Profile?.LastName))
{
<div class="flex justify-between">
<span class="flex gap-2">
<span class="mdi mdi-card-bulleted-outline"></span> Name
</span>
<span>
@string.Join(" ", new[]
{
Model.UserAccount.Profile.FirstName,
Model.UserAccount.Profile.MiddleName,
Model.UserAccount.Profile.LastName
}.Where(s => !string.IsNullOrEmpty(s)))
</span>
</div>
}
@if (!string.IsNullOrEmpty(Model.UserAccount.Profile?.Gender))
{
<div class="flex justify-between">
<span class="flex gap-2">
<span class="mdi mdi-human-non-binary"></span> Gender
</span>
<span>
@Model.UserAccount.Profile.Gender
@if (!string.IsNullOrEmpty(Model.UserAccount.Profile?.Pronouns))
{
<span class="text-base-content/50">·</span>
@Model.UserAccount.Profile.Pronouns
}
</span>
</div>
}
<div class="flex justify-between">
<span class="flex gap-2">
<span class="mdi mdi-history"></span> Joined at
</span>
<span>
@Model.UserAccount.CreatedAt?.ToDateTimeOffset().ToString("MMMM d, yyyy")
</span>
</div>
@if (Model.UserAccount.Profile?.Birthday != null)
{
<div class="flex justify-between">
<span class="flex gap-2">
<span class="mdi mdi-cake-variant"></span> Birthday
</span>
<span>
@Model.CalculateAge(Model.UserAccount.Profile.Birthday.ToInstant()) yrs old
<span class="text-base-content/50">·</span>
@Model.UserAccount.Profile.Birthday?.ToDateTimeOffset().ToString("MMMM d")
</span>
</div>
}
</div>
</div>
</div>
@if (Model.UserAccount.PerkSubscription != null)
{
<div class="card bg-base-100 border">
<div class="card-body">
<div class="flex justify-between items-center">
<div class="flex flex-col">
<div class="text-xl font-bold">
@Model.GetPerkInfo(Model.UserAccount.PerkSubscription.Identifier).Name Tier
</div>
<div class="text-sm text-base-content/70">Stellar Program Member</div>
</div>
<div class="text-4xl"
style="color: @Model.GetPerkInfo(Model.UserAccount.PerkSubscription.Identifier).Color">
</div>
</div>
</div>
</div>
}
<div class="card bg-base-100 border">
<div class="card-body">
<div class="flex justify-between mb-2">
<div>Level @Model.UserAccount.Profile?.Level</div>
<div>@Model.UserAccount.Profile?.Experience XP</div>
</div>
<progress class="progress progress-success"
value="@(Model.UserAccount.Profile?.LevelingProgress ?? 0)" max="1"></progress>
</div>
</div>
</div>
@if (Model.UserAccount.Profile?.Links.Count > 0)
{
<div>
<div class="card bg-base-100 border">
<div class="card-body">
<h2 class="card-title">
<span class="mdi mdi-link-variant"></span> Links
</h2>
<ul class="list pt-2">
@foreach (var link in Model.UserAccount.Profile.Links)
{
<li class="list-row p-0">
<div class="list-col-grow">
<div>@(link.Name)</div>
<div class="text-xs font-semibold opacity-60">@(link.Url)</div>
</div>
<a class="btn btn-square btn-ghost" href="@link.Url" target="_blank">
<span class="mdi mdi-launch"></span>
</a>
</li>
}
</ul>
</div>
</div>
</div>
}
@if (Model.UserAccount.Contacts.Count > 0)
{
<div>
<div class="card bg-base-100 border">
<div class="card-body">
<h2 class="card-title">
<span class="mdi mdi-link-variant"></span> Links
</h2>
<ul class="list pt-2">
@foreach (var contact in Model.UserAccount.Contacts)
{
<li class="list-row p-0" x-data="{ content: '@contact.Content' }">
<div class="list-col-grow">
<div>@(contact.Content)</div>
<div class="text-xs font-semibold opacity-60">@(contact.Type.ToString())</div>
</div>
<button class="btn btn-square btn-ghost" x-clipboard="content">
<span class="mdi mdi-content-copy"></span>
</button>
</li>
}
</ul>
</div>
</div>
</div>
}
<div>
@if (!string.IsNullOrEmpty(Model.HtmlBio))
{
<div class="card bg-base-100 border">
<div class="card-body">
<h2 class="card-title">
<span class="mdi mdi-information"></span> Bio
</h2>
<div class="prose prose-sm max-w-none">
@Html.Raw(Model.HtmlBio)
</div>
</div>
</div>
}
</div>
</div>
</div>
}
else
{
<div class="hero min-h-[50vh]">
<div class="hero-content text-center">
<div>
<div class="text-6xl mb-4">
<span class="mdi mdi-account"></span>
</div>
<h1 class="text-3xl font-bold">User not found</h1>
<p class="py-6">The user profile you're trying to access is not found.</p>
</div>
</div>
</div>
}