{pgn.toString()}
+} diff --git a/src/components/GameReplay.jsx b/src/components/GameReplay.jsx new file mode 100644 index 000000000..97ec5d282 --- /dev/null +++ b/src/components/GameReplay.jsx @@ -0,0 +1,64 @@ +import React, { useState } from 'react' +import pgnParser from 'pgn-parser' +import { Pgn } from 'chess-pgn' +import { Button, Container, Row, Col } from 'react-bootstrap' + +export default function GameReplay(props) { + const [image, setImage] = useState(null) + const [moveNumber, setMoveNumber] = useState(0) + + let moves = props.currentGame + moves = moves.slice(0, moveNumber) + + let pgn = new Pgn() + for (let move of moves) { + pgn = pgn.move(move) + } + + fetch( + '/createImage?' + + new URLSearchParams({ + pgn: pgn.toString(), + }) + ) + .then((res) => res.json()) + .then((res) => setImage(res.image)) + + return ( +WebChess was created by Cooper Dean, Harrison Rubin, Zachary Sarrett and Henry Yoder.
+ WebChess is a quick and easy way for users to play against various chess engines with selectable difficulty.
+ WebChess was created as a final assignment for CS4241 Webware.
On the home page, start a new game by selecting which color you want to play as, which bot you want to play against, and the difficulty of the bot.
+After playing a game, you can visit the game history page to review the game. In the game history page, you can revisit the previous games you've played on WebChess
+After you have played enough games, you can view the stats page to view your history of wins and losses against each bot,
+ average difficulty for each bot, and the total number of games you've played
| select | +engine | +strength | +color | +result | +PGN | +
|---|---|---|---|---|---|
| + + | +{game.engine} | +{game.engineStrength} | +{game.colorPlayed} | +{game.result} | +{makePGN(game.game).substring(0, 50)} | +