Files
Shogi/Shogi.UI/Pages/Home/GameBrowser.razor

110 lines
3.2 KiB
Plaintext

@using Shogi.Contracts.Types
@using System.ComponentModel.DataAnnotations
@using System.Net
@inject IShogiApi ShogiApi;
@inject ShogiSocket ShogiSocket;
<section class="game-browser">
<ul class="nav nav-tabs">
<li class="nav-item">
<button class="nav-link active" data-bs-toggle="tab" data-bs-target="#search-pane">Search</button>
</li>
<li class="nav-item">
<button class="nav-link" data-bs-toggle="tab" data-bs-target="#create-pane">Create</button>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane fade show active" id="search-pane">
<div class="list-group">
@if (!sessions.Any())
{
<p>No games exist</p>
}
@foreach (var session in sessions)
{
<button class="list-group-item list-group-item-action @ActiveCss(session)" @onclick="() => OnClickSession(session)">
<span>@session.Name</span>
<span>(@session.PlayerCount/2)</span>
</button>
}
</div>
</div>
<div class="tab-pane fade" id="create-pane">
<EditForm Model="createForm" OnValidSubmit="async () => await CreateSession()">
<DataAnnotationsValidator />
<h3>Start a new session</h3>
<div class="form-floating mb-3">
<InputText type="text" class="form-control" id="session-name" placeholder="Session name" @bind-Value="createForm.Name" />
<label for="session-name">Session name</label>
</div>
<div class="flex-between mb-3">
<div class="form-check">
<InputCheckbox class="form-check-input" role="switch" id="session-privacy" @bind-Value="createForm.IsPrivate" />
<label class="form-check-label" for="session-privacy">Private?</label>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</div>
@if (createSessionStatusCode == HttpStatusCode.Created)
{
<div class="alert alert-success" role="alert">
Session started. View it in the search tab.
</div>
}
else if (createSessionStatusCode == HttpStatusCode.Conflict)
{
<div class="alert alert-warning" role="alert">
The name you chose is taken; choose another.
</div>
}
</EditForm>
</div>
</div>
</section>
@code {
[Parameter]
public Action<SessionMetadata>? ActiveSessionChanged { get; set; }
CreateForm createForm = new();
SessionMetadata[] sessions = Array.Empty<SessionMetadata>();
SessionMetadata? activeSession;
HttpStatusCode? createSessionStatusCode;
protected override async Task OnInitializedAsync()
{
ShogiSocket.OnCreateGameMessage += async (sender, message) => await FetchSessions();
await FetchSessions();
}
string ActiveCss(SessionMetadata s) => s == activeSession ? "active" : string.Empty;
void OnClickSession(SessionMetadata s)
{
activeSession = s;
ActiveSessionChanged?.Invoke(s);
}
async Task FetchSessions()
{
var sessions = await ShogiApi.GetSessions();
if (sessions != null)
{
this.sessions = sessions.PlayerHasJoinedSessions.Concat(sessions.AllOtherSessions).ToArray();
}
}
async Task CreateSession()
{
createSessionStatusCode = await ShogiApi.PostSession(createForm.Name, createForm.IsPrivate);
}
private class CreateForm
{
[Required]
public string Name { get; set; } = string.Empty;
public bool IsPrivate { get; set; }
}
}