feat : add move indicator on self game

This commit is contained in:
GuillaumeSD
2024-03-08 00:28:47 +01:00
parent 5aff42d5ff
commit e6df48063f

View File

@@ -15,15 +15,15 @@ const SquareRenderer = forwardRef<HTMLDivElement, CustomSquareProps>(
const toSquare = position.lastMove?.to; const toSquare = position.lastMove?.to;
const moveClassification = position?.eval?.moveClassification; const moveClassification = position?.eval?.moveClassification;
const showPlayerMove = moveClassification && showPlayerMoveIcon;
const customSquareStyle: CSSProperties | undefined = const customSquareStyle: CSSProperties | undefined =
showPlayerMove && (fromSquare === square || toSquare === square) fromSquare === square || toSquare === square
? { ? {
position: "absolute", position: "absolute",
width: "100%", width: "100%",
height: "100%", height: "100%",
backgroundColor: moveClassificationColors[moveClassification], backgroundColor: moveClassification
? moveClassificationColors[moveClassification]
: "#ffff33",
opacity: 0.5, opacity: 0.5,
} }
: undefined; : undefined;
@@ -32,7 +32,7 @@ const SquareRenderer = forwardRef<HTMLDivElement, CustomSquareProps>(
<div ref={ref} style={{ ...style, position: "relative" }}> <div ref={ref} style={{ ...style, position: "relative" }}>
{children} {children}
{customSquareStyle && <div style={customSquareStyle} />} {customSquareStyle && <div style={customSquareStyle} />}
{showPlayerMove && square === toSquare && ( {moveClassification && showPlayerMoveIcon && square === toSquare && (
<Image <Image
src={`/icons/${moveClassification}.png`} src={`/icons/${moveClassification}.png`}
alt="move-icon" alt="move-icon"