chess-console
Version:
ES6 Module for playing chess
90 lines (85 loc) • 3.84 kB
HTML
<html lang="en">
<head>
<title>Chess Console</title>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0"/>
<meta http-equiv="X-UA-Compatible" content="ie=edge"/>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"/>
<link rel="stylesheet" href="../assets/styles/screen.css"/>
</head>
<body>
<div class="container-fluid">
<h1><a href="../">chess-console</a></h1>
<h2>Load a game from a PGN</h2>
<div id="console-container"></div>
<p class="mt-4">The loaded PGN:</p>
<pre id="pgnOutput"></pre>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/es-module-shims@1.7.2/dist/es-module-shims.min.js"></script>
<!-- @formatter:off -->
<script type="importmap">
{
"imports": {
"cm-chessboard/": "../node_modules/cm-chessboard/",
"cm-web-modules/": "../node_modules/cm-web-modules/",
"chess.mjs/": "../node_modules/chess.mjs/",
"cm-pgn/": "../node_modules/cm-pgn/",
"cm-chess/": "../node_modules/cm-chess/",
"bootstrap-show-modal/": "../node_modules/bootstrap-show-modal/"
}
}
</script>
<!-- @formatter:on -->
<script type="module">
import {ChessConsole} from "../src/ChessConsole.js"
import {LocalPlayer} from "../src/players/LocalPlayer.js"
import {RandomPlayer} from "../src/players/RandomPlayer.js"
import {Board} from "../src/components/Board.js"
import {GameStateOutput} from "../src/components/GameStateOutput.js"
import {History} from "../src/components/History.js"
import {CapturedPieces} from "../src/components/CapturedPieces.js"
import {HistoryControl} from "../src/components/HistoryControl.js"
import {GameControl} from "../src/components/GameControl/GameControl.js"
import {Sound} from "../src/components/Sound.js"
import {Persistence} from "../src/components/Persistence.js"
const pgn =
`1.e4 e5 2.Nf3 Nc6 3.Bc4 Bc5 4.b4 Bxb4 5.c3 Ba5 6.d4 exd4 7.O-O
d3 8.Qb3 Qf6 9.e5 Qg6 10.Re1 Nge7 11.Ba3 b5 12.Qxb5 Rb8 13.Qa4
Bb6 14.Nbd2 Bb7 15.Ne4 Qf5 16.Bxd3 Qh5 17.Nf6+ gxf6 18.exf6
Rg8 19.Rad1 Qxf3 20.Rxe7+ Nxe7 21.Qxd7+ Kxd7 22.Bf5+ Ke8
23.Bd7+`
new ChessConsole(
document.getElementById("console-container"),
{name: "Player", type: LocalPlayer},
{name: "Opponent", type: RandomPlayer}
).initialized.then((chessConsole) => {
new Board(chessConsole, {
assetsUrl: "../node_modules/cm-chessboard/assets/"
}).initialized.then(() => {
new Persistence(chessConsole, {
savePrefix: "loadPgn"
})
chessConsole.initGame({
playerColor: "b",
pgn: pgn
})
})
new GameStateOutput(chessConsole)
new History(chessConsole)
new HistoryControl(chessConsole)
new CapturedPieces(chessConsole)
new GameControl(chessConsole)
new Sound(chessConsole, {
soundSpriteFile: "../assets/sounds/chess_console_sounds.mp3",
})
})
document.getElementById("pgnOutput").innerText = pgn
</script>
</body>
</html>