Move from the hand.
This commit is contained in:
@@ -59,9 +59,9 @@ else
|
||||
{
|
||||
var accountId = Account.User?.Id;
|
||||
|
||||
this.perspective = accountId == session.Player2 ? WhichPlayer.Player2 : WhichPlayer.Player1;
|
||||
this.isSpectating = !(accountId == this.session.Player1 || accountId == this.session.Player2);
|
||||
Console.WriteLine($"IsSpectating - {isSpectating}. AccountId - {accountId}. Player1 - {this.session.Player1}. Player2 - {this.session.Player2}");
|
||||
this.perspective = accountId == session.Player1.Id ? WhichPlayer.Player1 : WhichPlayer.Player2;
|
||||
Console.WriteLine(new { this.perspective, accountId });
|
||||
this.isSpectating = !(accountId == this.session.Player1.Id || accountId == this.session.Player2?.Id);
|
||||
|
||||
}
|
||||
StateHasChanged();
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
@using Shogi.Contracts.Types;
|
||||
@using System.Text.Json;
|
||||
@inject PromotePrompt PromotePrompt;
|
||||
@inject AccountState AccountState;
|
||||
|
||||
@@ -70,7 +71,6 @@
|
||||
<div class="hand">
|
||||
@if (opponentHand.Any())
|
||||
{
|
||||
|
||||
@foreach (var piece in opponentHand)
|
||||
{
|
||||
<div class="tile">
|
||||
@@ -78,20 +78,29 @@
|
||||
</div>
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
<i class="place-self-center">Hand is empty.</i>
|
||||
}
|
||||
</div>
|
||||
<p class="text-center">Opponent Hand</p>
|
||||
</div>
|
||||
|
||||
<div class="spacer place-self-center">
|
||||
<div class="spacer place-self-center text-center">
|
||||
<p>@opponentName</p>
|
||||
<p title="It is @(IsMyTurn ? "your" : "their") turn.">
|
||||
<svg width="32" height="32" fill="currentColor">
|
||||
@if (IsMyTurn)
|
||||
{
|
||||
<use xlink:href="css/bootstrap/bootstrap-icons.svg#chevron-down" />
|
||||
}
|
||||
else
|
||||
{
|
||||
<use xlink:href="css/bootstrap/bootstrap-icons.svg#chevron-up" />
|
||||
}
|
||||
</svg>
|
||||
</p>
|
||||
<p>@userName</p>
|
||||
</div>
|
||||
|
||||
<div class="player-area">
|
||||
@if (Session.Player2 == null && Session.Player1 != AccountState.User?.Id)
|
||||
@if (Session.Player2 == null && Session.Player1.Id != AccountState.User?.Id)
|
||||
{
|
||||
<div class="place-self-center">
|
||||
<p>Seat is Empty</p>
|
||||
@@ -100,20 +109,19 @@
|
||||
}
|
||||
else
|
||||
{
|
||||
<p class="text-center">Hand</p>
|
||||
<div class="hand">
|
||||
@if (userHand.Any())
|
||||
{
|
||||
@foreach (var piece in userHand)
|
||||
{
|
||||
<div class="title" @onclick="OnClickHandInternal(piece)">
|
||||
<div @onclick="OnClickHandInternal(piece)"
|
||||
class="tile"
|
||||
data-selected="@(piece.WhichPiece == SelectedPieceFromHand)">
|
||||
<GamePiece Piece="piece" Perspective="Perspective" />
|
||||
</div>
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
<i class="place-self-center">Hand is empty.</i>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
@@ -132,10 +140,12 @@
|
||||
[Parameter] public WhichPlayer Perspective { get; set; }
|
||||
[Parameter] public Session? Session { get; set; }
|
||||
[Parameter] public string? SelectedPosition { get; set; }
|
||||
[Parameter] public WhichPiece? SelectedPieceFromHand { get; set; }
|
||||
// TODO: Exchange these OnClick actions for events like "SelectionChangedEvent" and "MoveFromBoardEvent" and "MoveFromHandEvent".
|
||||
[Parameter] public Func<Piece?, string, Task>? OnClickTile { get; set; }
|
||||
[Parameter] public Func<Piece, Task>? OnClickHand { get; set; }
|
||||
[Parameter] public Func<Task>? OnClickJoinGame { get; set; }
|
||||
[Parameter] public bool IsMyTurn { get; set; }
|
||||
|
||||
private IReadOnlyCollection<Piece> opponentHand;
|
||||
private IReadOnlyCollection<Piece> userHand;
|
||||
@@ -152,7 +162,6 @@
|
||||
|
||||
protected override void OnParametersSet()
|
||||
{
|
||||
Console.WriteLine("Params changed. SelectedPosition = {0}", SelectedPosition);
|
||||
base.OnParametersSet();
|
||||
if (Session == null)
|
||||
{
|
||||
@@ -163,6 +172,7 @@
|
||||
}
|
||||
else
|
||||
{
|
||||
Console.WriteLine(JsonSerializer.Serialize(new { this.Session.Player1, this.Session.Player2, Perspective, this.Session.SessionName }));
|
||||
opponentHand = Perspective == WhichPlayer.Player1
|
||||
? this.Session.BoardState.Player2Hand
|
||||
: this.Session.BoardState.Player1Hand;
|
||||
@@ -170,11 +180,11 @@
|
||||
? this.Session.BoardState.Player1Hand
|
||||
: this.Session.BoardState.Player2Hand;
|
||||
userName = Perspective == WhichPlayer.Player1
|
||||
? this.Session.Player1
|
||||
: this.Session.Player2;
|
||||
? this.Session.Player1.Name
|
||||
: this.Session.Player2?.Name ?? "Empty Seat";
|
||||
opponentName = Perspective == WhichPlayer.Player1
|
||||
? this.Session.Player2
|
||||
: this.Session.Player1;
|
||||
? this.Session.Player2?.Name ?? "Empty Seat"
|
||||
: this.Session.Player1.Name;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
.game-board {
|
||||
display: grid;
|
||||
grid-template-areas: "board side-board icons";
|
||||
grid-template-columns: 3fr minmax(10rem, 1fr) auto;
|
||||
grid-template-columns: max-content minmax(25rem, 1fr) 2fr;
|
||||
gap: 0.5rem;
|
||||
background-color: #444;
|
||||
position: relative; /* For absolute positioned children. */
|
||||
@@ -58,17 +58,18 @@
|
||||
}
|
||||
|
||||
.tile {
|
||||
background-color: beige;
|
||||
display: grid;
|
||||
place-content: center;
|
||||
padding: 0.25rem;
|
||||
overflow: hidden; /* Because SVGs are shaped weird */
|
||||
transition: filter linear 0.25s;
|
||||
}
|
||||
|
||||
.tile[data-selected] {
|
||||
filter: invert(0.8);
|
||||
}
|
||||
.board .tile {
|
||||
background-color: beige;
|
||||
}
|
||||
|
||||
.tile[data-selected] {
|
||||
filter: invert(0.8);
|
||||
}
|
||||
|
||||
.ruler {
|
||||
color: beige;
|
||||
@@ -90,22 +91,32 @@
|
||||
}
|
||||
|
||||
.side-board {
|
||||
display: grid;
|
||||
grid-auto-rows: 1fr;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
place-content: space-between;
|
||||
padding: 1rem;
|
||||
background-color: var(--contrast-color);
|
||||
}
|
||||
|
||||
.side-board .player-area {
|
||||
display: grid;
|
||||
place-items: stretch;
|
||||
}
|
||||
|
||||
.side-board .hand {
|
||||
display: grid;
|
||||
grid-auto-columns: 1fr;
|
||||
border: 1px solid #ccc;
|
||||
grid-template-columns: repeat(7, 1fr);
|
||||
grid-template-rows: 4rem;
|
||||
place-items: center start;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.side-board .hand .tile {
|
||||
max-height: 100%; /* I have no idea why I need to set this here to prevent a height blowout. */
|
||||
background-color: var(--secondary-color);
|
||||
}
|
||||
|
||||
.promote-prompt {
|
||||
display: none;
|
||||
position: absolute;
|
||||
|
||||
@@ -9,7 +9,9 @@
|
||||
Perspective="Perspective"
|
||||
OnClickHand="OnClickHand"
|
||||
OnClickTile="OnClickTile"
|
||||
SelectedPosition="@selectedBoardPosition" />
|
||||
SelectedPosition="@selectedBoardPosition"
|
||||
SelectedPieceFromHand="@selectedPieceFromHand"
|
||||
IsMyTurn="IsMyTurn" />
|
||||
|
||||
@code {
|
||||
[Parameter, EditorRequired]
|
||||
@@ -23,6 +25,8 @@
|
||||
protected override void OnParametersSet()
|
||||
{
|
||||
base.OnParametersSet();
|
||||
selectedBoardPosition = null;
|
||||
selectedPieceFromHand = null;
|
||||
if (Session == null)
|
||||
{
|
||||
throw new ArgumentException($"{nameof(Session)} cannot be null.", nameof(Session));
|
||||
@@ -42,51 +46,77 @@
|
||||
return false;
|
||||
}
|
||||
|
||||
async Task OnClickTile(Piece? piece, string position)
|
||||
async Task OnClickTile(Piece? pieceAtPosition, string position)
|
||||
{
|
||||
Console.WriteLine("Is my turn?");
|
||||
Console.WriteLine(true);
|
||||
if (!IsMyTurn) return;
|
||||
|
||||
if (selectedBoardPosition == null || piece?.Owner == Perspective)
|
||||
{
|
||||
// Select a position.
|
||||
Console.WriteLine("Position {0}", position);
|
||||
selectedBoardPosition = position;
|
||||
StateHasChanged();
|
||||
return;
|
||||
}
|
||||
|
||||
if (selectedBoardPosition == position)
|
||||
{
|
||||
// Deselect the selected position.
|
||||
selectedBoardPosition = null;
|
||||
StateHasChanged();
|
||||
return;
|
||||
}
|
||||
if (piece == null)
|
||||
|
||||
if (selectedBoardPosition == null && pieceAtPosition?.Owner == Perspective)
|
||||
{
|
||||
if (ShouldPromptForPromotion(position) || ShouldPromptForPromotion(selectedBoardPosition))
|
||||
// Select an owned piece.
|
||||
Console.WriteLine("Selecting piece owned by {0} while I am perspective {1}", pieceAtPosition?.Owner, Perspective);
|
||||
selectedBoardPosition = position;
|
||||
// Prevent selecting pieces from the hand and board at the same time.
|
||||
selectedPieceFromHand = null;
|
||||
StateHasChanged();
|
||||
return;
|
||||
}
|
||||
|
||||
if (selectedPieceFromHand is not null)
|
||||
{
|
||||
if (pieceAtPosition is null)
|
||||
{
|
||||
PromotePrompt.Show(Session.SessionName, new MovePieceCommand
|
||||
{
|
||||
From = selectedBoardPosition,
|
||||
To = position
|
||||
});
|
||||
Console.WriteLine("Moving piece from hand.");
|
||||
// Placing a piece from the hand to an empty space.
|
||||
// await ShogiApi.Move(
|
||||
// Session.SessionName,
|
||||
// new MovePieceCommand(selectedPieceFromHand.Value, position));
|
||||
}
|
||||
else
|
||||
StateHasChanged();
|
||||
return;
|
||||
}
|
||||
|
||||
if (selectedBoardPosition != null)
|
||||
{
|
||||
if (pieceAtPosition == null || pieceAtPosition?.Owner != Perspective)
|
||||
{
|
||||
await ShogiApi.Move(Session.SessionName, new MovePieceCommand
|
||||
{
|
||||
From = selectedBoardPosition,
|
||||
IsPromotion = false,
|
||||
To = position
|
||||
});
|
||||
// Moving to an empty space or capturing an opponent's piece.
|
||||
if (ShouldPromptForPromotion(position) || ShouldPromptForPromotion(selectedBoardPosition))
|
||||
{
|
||||
PromotePrompt.Show(
|
||||
Session.SessionName,
|
||||
new MovePieceCommand(selectedBoardPosition, position, false));
|
||||
}
|
||||
else
|
||||
{
|
||||
await ShogiApi.Move(Session.SessionName, new MovePieceCommand(selectedBoardPosition, position, false));
|
||||
}
|
||||
StateHasChanged();
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
async Task OnClickHand(Piece piece)
|
||||
{
|
||||
selectedPieceFromHand = piece.WhichPiece;
|
||||
await Task.CompletedTask;
|
||||
if (!IsMyTurn) return;
|
||||
|
||||
// Prevent selecting from both the hand and the board.
|
||||
selectedBoardPosition = null;
|
||||
|
||||
selectedPieceFromHand = piece.WhichPiece == selectedPieceFromHand
|
||||
// Deselecting the already-selected piece
|
||||
? selectedPieceFromHand = null
|
||||
: selectedPieceFromHand = piece.WhichPiece;
|
||||
|
||||
StateHasChanged();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
@inject IShogiApi ShogiApi;
|
||||
|
||||
<GameBoardPresentation IsSpectating="true"
|
||||
Perspective="WhichPlayer.Player1"
|
||||
Perspective="WhichPlayer.Player2"
|
||||
Session="Session"
|
||||
OnClickJoinGame="OnClickJoinGame" />
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
@using Shogi.Contracts.Types
|
||||
|
||||
<div data-upsidedown="@(Piece?.Owner != Perspective)" data-owner="@Piece?.Owner.ToString()">
|
||||
<div class="game-piece" data-upsidedown="@(Piece?.Owner != Perspective)" data-owner="@Piece?.Owner.ToString()">
|
||||
@switch (Piece?.WhichPiece)
|
||||
{
|
||||
case WhichPiece.Bishop:
|
||||
|
||||
@@ -6,3 +6,7 @@
|
||||
[data-upsidedown] {
|
||||
transform: rotateZ(180deg);
|
||||
}
|
||||
|
||||
.game-piece {
|
||||
overflow: hidden; /* Because SVGs have weird sizes. */
|
||||
}
|
||||
@@ -63,8 +63,6 @@ static void ConfigureDependencies(IServiceCollection services, IConfiguration co
|
||||
|
||||
var serializerOptions = new JsonSerializerOptions
|
||||
{
|
||||
DictionaryKeyPolicy = JsonNamingPolicy.CamelCase,
|
||||
PropertyNamingPolicy = JsonNamingPolicy.CamelCase,
|
||||
WriteIndented = true
|
||||
};
|
||||
services.AddScoped((sp) => serializerOptions);
|
||||
|
||||
@@ -29,7 +29,6 @@
|
||||
|
||||
void OnModalChange(object? sender, ModalVisibilityChangedEventArgs args)
|
||||
{
|
||||
Console.WriteLine("Modal Change");
|
||||
if (args != null)
|
||||
{
|
||||
shouldShow = args.LoginModalIsVisible || args.GuestAccountDescriptionIsVisible;
|
||||
|
||||
@@ -38,11 +38,9 @@ public class ShogiSocket : IDisposable
|
||||
}.ToQueryString().Value;
|
||||
|
||||
await socket.ConnectAsync(this.uriBuilder.Uri, cancelToken.Token);
|
||||
Console.WriteLine("Socket Connected");
|
||||
// Fire and forget! I'm way too lazy to write my own javascript interop to a web worker. Nooo thanks.
|
||||
_ = Listen().ContinueWith(async antecedent =>
|
||||
{
|
||||
Console.WriteLine($"Socket fault. {antecedent.Exception}");
|
||||
this.cancelToken.Cancel();
|
||||
await this.socket.CloseAsync(WebSocketCloseStatus.NormalClosure, "Page was probably closed or refresh.", CancellationToken.None);
|
||||
if (antecedent.Exception != null)
|
||||
@@ -59,9 +57,9 @@ public class ShogiSocket : IDisposable
|
||||
var result = await socket.ReceiveAsync(this.memoryOwner.Memory, cancelToken.Token);
|
||||
var memory = this.memoryOwner.Memory[..result.Count].ToArray();
|
||||
var action = JsonDocument
|
||||
.Parse(memory[..result.Count])
|
||||
.Parse(memory)
|
||||
.RootElement
|
||||
.GetProperty(nameof(ISocketResponse.Action))
|
||||
.GetProperty(nameof(ISocketMessage.Action))
|
||||
.Deserialize<SocketAction>();
|
||||
|
||||
Console.WriteLine($"Socket action: {action}");
|
||||
@@ -76,14 +74,14 @@ public class ShogiSocket : IDisposable
|
||||
case SocketAction.SessionJoined:
|
||||
if (this.OnSessionJoined is not null)
|
||||
{
|
||||
var args = JsonSerializer.Deserialize<SessionJoinedByPlayerSocketMessage>(memory[..result.Count], serializerOptions);
|
||||
var args = JsonSerializer.Deserialize<SessionJoinedByPlayerSocketMessage>(memory, serializerOptions);
|
||||
await this.OnSessionJoined(args!);
|
||||
}
|
||||
break;
|
||||
case SocketAction.PieceMoved:
|
||||
if (this.OnPlayerMoved is not null)
|
||||
{
|
||||
var args = JsonSerializer.Deserialize<PlayerHasMovedMessage>(memory[..result.Count], serializerOptions);
|
||||
var args = JsonSerializer.Deserialize<PlayerHasMovedMessage>(memory, serializerOptions);
|
||||
await this.OnPlayerMoved(args!);
|
||||
}
|
||||
break;
|
||||
|
||||
Reference in New Issue
Block a user