diff --git a/src/components/Board/GameplayInterface.tsx b/src/components/Board/GameplayInterface.tsx index 4cfcf2c..dd7ef1a 100644 --- a/src/components/Board/GameplayInterface.tsx +++ b/src/components/Board/GameplayInterface.tsx @@ -182,7 +182,15 @@ export const GameplayInterface: React.FC = ( > {Info} - +
+ + +
= ( ) : null}
- ) @@ -266,6 +273,12 @@ export const GameplayInterface: React.FC = (
{props.children}
+ diff --git a/src/components/Misc/ExportGame.tsx b/src/components/Misc/ExportGame.tsx index a6c02fe..7517aef 100644 --- a/src/components/Misc/ExportGame.tsx +++ b/src/components/Misc/ExportGame.tsx @@ -1,52 +1,117 @@ +/* eslint-disable jsx-a11y/click-events-have-key-events */ import { Chess } from 'chess.ts' -import { useEffect, useState } from 'react' +import { useContext, useEffect, useState } from 'react' -import { Move } from 'src/types' +import { Move, PlayedGame } from 'src/types' +import { GameControllerContext } from 'src/contexts' interface Props { - moves: Move[] + game: PlayedGame + whitePlayer: string + blackPlayer: string + maiaVersion: string } -export const ExportGame: React.FC = ({ moves }) => { +export const ExportGame: React.FC = ({ + game, + whitePlayer, + blackPlayer, + maiaVersion, +}) => { + const [fen, setFen] = useState('') const [pgn, setPgn] = useState('') + const { currentIndex } = useContext(GameControllerContext) useEffect(() => { const chess = new Chess() - moves.forEach((move) => { + game.moves.forEach((move) => { if (move.san) { chess.move(move.san) } }) setPgn(chess.pgn()) - }, [moves]) + }, [game.moves]) + + useEffect(() => { + const initial = new Chess(game.moves[0].board) + initial.addHeader('ID', game.id) + initial.addHeader('Event', `Play v. ${maiaVersion}`) + initial.addHeader('Site', `https://maiachess.com/`) + initial.addHeader('White', whitePlayer) + initial.addHeader('Black', blackPlayer) + if (game.termination) { + initial.addHeader('Result', game.termination.result) + if (game.termination.condition) { + initial.addHeader('Termination', game.termination.condition) + } + } + game.moves.forEach((move, index) => { + if (!move.san || index > currentIndex) { + return + } + + initial.move(move.san) + }) + setFen(game.moves[currentIndex].board) + setPgn(initial.pgn()) + }, [currentIndex, game.moves]) const copy = (content: string) => { navigator.clipboard.writeText(content) } return ( -
-
-
-

- {moves[moves.length - 1].board} +

+
+
+

+ FEN

+ copy(fen)} + className="material-symbols-outlined select-none text-base text-secondary hover:text-primary" + > + content_copy +
-
+
+
+

+ PGN +

+ copy(pgn)} + className="material-symbols-outlined select-none text-base text-secondary hover:text-primary" + > content_copy - - + +
+
copy(pgn)} + className="border-1 group flex cursor-pointer overflow-x-hidden rounded border border-white/5 bg-background-1/50 px-4 py-2" + > +

+ {pgn} +

+
-
) } diff --git a/src/hooks/useStockfishEngine/engine.ts b/src/hooks/useStockfishEngine/engine.ts index e6dfdf3..42ea963 100644 --- a/src/hooks/useStockfishEngine/engine.ts +++ b/src/hooks/useStockfishEngine/engine.ts @@ -83,8 +83,6 @@ class Engine { } if (!isNaN(mate) && isNaN(cp)) { - console.log(msg) - console.log(this.fen) cp = mate > 0 ? 10000 : -10000 }