lucas/Shogi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Working on "Join Game" feature.

Browse Source
This commit is contained in:
Lucas Morgan
2023-01-23 17:25:41 -06:00
parent 26fd955aa4
commit 11b387b928
18 changed files with 509 additions and 344 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
Shogi.UI/Pages/Home/GameBoard/GameBoard.razor
View File

@@ -15,7 +15,7 @@ else if (isSpectating)
}
else
{
<SeatedGameBoard Perspective="perspective" Session="session" />
<SeatedGameBoard Perspective="perspective" Session="session" OnRefetchSession="RefetchSession" />
}
@@ -29,7 +29,12 @@ else
protected override async Task OnParametersSetAsync()
{
if (!string.IsNullOrWhiteSpace(SessionName))
await RefetchSession();
}
async Task RefetchSession()
{
if (!string.IsNullOrWhiteSpace(SessionName))
{
this.session = await ShogiApi.GetSession(SessionName);
if (this.session != null)
@@ -42,4 +47,6 @@ else
}
}
}
}

66
Shogi.UI/Pages/Home/GameBoard/GameBoardPresentation.razor
View File

@@ -1,5 +1,6 @@
@using Shogi.Contracts.Types;
@inject PromotePrompt PromotePrompt;
@inject AccountState AccountState;
<article class="game-board">
@if (IsSpectating)
@@ -65,25 +66,56 @@
@if (Session != null)
{
<aside class="side-board">
<div class="hand">
@foreach (var piece in OpponentHand)
<div class="player-area">
<div class="hand">
@if (OpponentHand.Any())
{
@foreach (var piece in OpponentHand)
{
<div class="tile">
<GamePiece Piece="piece" Perspective="Perspective" />
</div>
}
}
else
{
<i class="place-self-center">Hand is empty.</i>
}
</div>
</div>
<div class="spacer place-self-center">
</div>
<div class="player-area">
@if (Session.Player2 == null && Session.Player1 != AccountState.User?.Id)
{
<div class="tile">
<GamePiece Piece="piece" Perspective="Perspective" />
<div class="place-self-center">
<p>Seat is Empty</p>
<button @onclick="OnClickJoinGameInternal()">Join Game</button>
</div>
}
else
{
<div class="hand">
@if (UserHand.Any())
{
@foreach (var piece in UserHand)
{
<div class="title" @onclick="OnClickHandInternal(piece)">
<GamePiece Piece="piece" Perspective="Perspective" />
</div>
}
}
else
{
<i class="place-self-center">Hand is empty.</i>
}
</div>
}
</div>
<div class="spacer" />
<div class="hand">
@foreach (var piece in UserHand)
{
<div class="title" @onclick="OnClickHandInternal(piece)">
<GamePiece Piece="piece" Perspective="Perspective" />
</div>
}
</div>
</aside>
}
</article>
@@ -94,8 +126,9 @@
[Parameter] public Session? Session { get; set; }
[Parameter] public string? SelectedPosition { get; set; }
// TODO: Exchange these OnClick actions for events like "SelectionChangedEvent" and "MoveFromBoardEvent" and "MoveFromHandEvent".
[Parameter] public Action<Piece?, string>? OnClickTile { get; set; }
[Parameter] public Action<Piece>? OnClickHand { get; set; }
[Parameter] public Func<Piece?, string, Task>? OnClickTile { get; set; }
[Parameter] public Func<Piece, Task>? OnClickHand { get; set; }
[Parameter] public Func<Task>? OnClickJoinGame { get; set; }
static readonly string[] Files = new[] { "A", "B", "C", "D", "E", "F", "G", "H", "I" };
@@ -124,4 +157,5 @@
private Action OnClickTileInternal(Piece? piece, string position) => () => OnClickTile?.Invoke(piece, position);
private Action OnClickHandInternal(Piece piece) => () => OnClickHand?.Invoke(piece);
private Action OnClickJoinGameInternal() => () => OnClickJoinGame?.Invoke();
}

18
Shogi.UI/Pages/Home/GameBoard/GameboardPresentation.razor.css
View File

@@ -14,6 +14,7 @@
.side-board {
grid-area: side-board;
}
.icons {
grid-area: icons;
}
@@ -90,12 +91,19 @@
.side-board {
display: grid;
grid-template-rows: auto 1fr auto;
grid-auto-rows: 1fr;
padding: 1rem;
background-color: var(--contrast-color);
}
.side-board .player-area {
display: grid;
}
.side-board .hand {
display: flex;
flex-wrap: wrap;
display: grid;
grid-auto-columns: 1fr;
border: 1px solid #ccc;
}
.promote-prompt {
@@ -116,9 +124,5 @@
}
.spectating {
position: absolute;
right: 0;
top: 0;
z-index: 100;
color: var(--contrast-color)
}

31
Shogi.UI/Pages/Home/GameBoard/SeatedGameBoard.razor
View File

@@ -1,14 +1,22 @@
@using Shogi.Contracts.Api;
@using Shogi.Contracts.Types;
@using System.Text.RegularExpressions;
@using System.Net;
@inject PromotePrompt PromotePrompt;
@inject IShogiApi ShogiApi;
<GameBoardPresentation OnClickHand="OnClickHand" OnClickTile="OnClickTile" Session="Session" Perspective="Perspective" />
<GameBoardPresentation Session="Session"
Perspective="Perspective"
OnClickHand="OnClickHand"
OnClickTile="OnClickTile"
OnClickJoinGame="OnClickJoinGame" />
@code {
[Parameter] public WhichPlayer Perspective { get; set; }
[Parameter] public Session Session { get; set; }
[Parameter, EditorRequired]
public WhichPlayer Perspective { get; set; }
[Parameter, EditorRequired]
public Session Session { get; set; }
[Parameter] public Func<Task>? OnRefetchSession { get; set; }
private bool IsMyTurn => Session?.BoardState.WhoseTurn == Perspective;
private string? selectedBoardPosition;
private WhichPiece? selectedPieceFromHand;
@@ -26,7 +34,7 @@
return false;
}
async void OnClickTile(Piece? piece, string position)
async Task OnClickTile(Piece? piece, string position)
{
if (!IsMyTurn) return;
@@ -64,8 +72,21 @@
}
}
void OnClickHand(Piece piece)
async Task OnClickHand(Piece piece)
{
selectedPieceFromHand = piece.WhichPiece;
await Task.CompletedTask;
}
async Task OnClickJoinGame()
{
if (Session != null && OnRefetchSession != null)
{
var status = await ShogiApi.PatchJoinGame(Session.SessionName);
if (status == HttpStatusCode.OK)
{
await OnRefetchSession.Invoke();
}
}
}
}