Neighbourhood.omg.lol/Components/Pages/Person.razor

137 lines
4.3 KiB
Text

@page "/person/{Address}"
@inject State State
@inject IJSRuntime JS
@inject NavigationManager Nav
<div class="row center-align">
<h3 class="page-heading"><i class="fa-solid fa-fw fa-at"></i>@Address</h3>
</div>
<div class="row center-align">
<img class="profile avatar" src="https://profiles.cache.lol/@Address/picture" alt="@Address" />
</div>
<div class="responsive">
<div class="tabs scroll">
<a data-ui="#profile" @onclick="ReloadProfile">
<i class="fa-solid fa-id-card"></i>
<span>@(Address).omg.lol</span>
</a>
<a data-ui="#statuses" class="active">
<i class="fa-solid fa-message-smile"></i>
<span>Status.lol</span>
</a>
<a data-ui="#pics">
<i class="fa-solid fa-images"></i>
<span>Some.pics</span>
</a>
@if(now != null){
<a data-ui="#now" @onclick="ReloadNow">
<i class="fa-duotone fa-seedling"></i>
<span>/Now</span>
</a>
}
</div>
</div>
<div class="responsive page-container">
<div id="profile" class="page no-padding">
<a href="@ProfileUrl" target="_blank" class="hover absolute top right chip fill large-elevate">Open in browser <i class="fa-solid fa-arrow-up-right-from-square tiny"></i></a>
<ExternalPageComponent id="profile_page" @ref="ProfilePage" Url="@ProfileUrl"></ExternalPageComponent>
</div>
<div id="statuses" class="page padding active">
<div id="info" class="box basis transparent">
<article id="bio" class="container shadowed blue-2-bg gray-9-fg">
@if (bio == null) {
<p><progress class="circle small"></progress></p>
}
else {
@bio
}
</article>
</div>
<StatusList @ref="StatusList" StatusFunc="@(async() => await State.GetStatuses(Address))" Editable="@Editable"></StatusList>
@if(Address == State.SelectedAddressName) {
<button class="fab circle extra large-elevate" data-ui="#post-modal">
<i class="fa-solid fa-pen-to-square"></i>
</button>
<NewStatusDialog id="post-modal"></NewStatusDialog>
}
</div>
<div id="pics" class="page padding">
<PicList @ref="PicList" PicsFunc="@(async() => await State.GetPics(Address))" Editable="@Editable"></PicList>
@if (Address == State.SelectedAddressName) {
<button class="fab circle extra large-elevate" data-ui="#post-modal">
<i class="fa-solid fa-camera-retro"></i>
</button>
<NewPicDialog id="post-modal"></NewPicDialog>
}
</div>
@if(now != null){
<div id="now" class="page no-padding">
<a href="@now.Url" target="_blank" class="hover absolute top right chip fill large-elevate">Open in browser <i class="fa-solid fa-arrow-up-right-from-square tiny"></i></a>
<ExternalPageComponent id="now_page" @ref="NowPage" Url="@now.Url"></ExternalPageComponent>
</div>
}
</div>
@code {
private string _address;
[Parameter]
public string Address {
get => _address;
set {
_address = value;
if(StatusList != null) StatusList.StatusFunc = async () => await State.GetStatuses(_address);
if(PicList != null) PicList.PicsFunc = async () => await State.GetPics(_address);
}
}
public string ProfileUrl {
get => $"https://{Address}.omg.lol/";
}
public ExternalPageComponent? NowPage { get; set; }
public ExternalPageComponent? ProfilePage { get; set; }
private StatusList StatusList { get; set; }
private PicList PicList { get; set; }
private bool Editable {
get => Address == State.SelectedAddressName;
}
private MarkupString? bio;
private NowData? now;
protected override async Task OnInitializedAsync() {
List<NowData>? garden = await State.GetNowGarden();
now = garden?.FirstOrDefault(n => n.Address == Address);
await InvokeAsync(StateHasChanged);
string fragment = new Uri(Nav.Uri).Fragment;
await JS.InvokeVoidAsync("ui", fragment);
if (fragment.EndsWith("now")) await ReloadNow();
else if (fragment.EndsWith("profile")) await ReloadProfile();
bio = await State.GetBio(Address);
}
private async Task ReloadNow() {
if(NowPage != null) {
await NowPage.Reload();
await ResizeIframes();
}
}
private async Task ReloadProfile() {
if (ProfilePage != null) {
await ProfilePage.Reload();
await ResizeIframes();
}
}
private async Task ResizeIframes() {
await JS.InvokeVoidAsync("iframeResize", new { license = "GPLv3" });
}
}