cm-chessboard-eight-queens-puzzle
Version:
TheeEight queens puzzle as an extensions for the cm-chessboard
43 lines (40 loc) • 1.48 kB
HTML
<html lang="en" data-emc-theme="auto">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./node_modules/extreme-minimal-css/styles/screen.css"/>
<link rel="stylesheet" href="./node_modules/cm-chessboard/assets/chessboard.css"/>
<link rel="stylesheet" href="./node_modules/cm-chessboard/assets/extensions/markers/markers.css"/>
<link rel="stylesheet" href="./assets/styles/eight-queens-puzzle.css"/>
<title>Document Title</title>
<script type="importmap">
{
"imports": {
"cm-chessboard/": "./node_modules/cm-chessboard/",
"src/": "./src/"
}
}
</script>
</head>
<body>
<h1>Eight Queens Puzzle</h1>
<p>Place eight queens on the chessboard so that no two queens attack each other.</p>
<div class="board board-eight-queens"></div>
<script type="module">
import {Chessboard} from "cm-chessboard/src/Chessboard.js"
import {EightQueensPuzzle} from "src/EightQueensPuzzle.js"
new Chessboard(document.querySelector(".board-eight-queens"), {
assetsUrl: "../node_modules/cm-chessboard/assets/",
style: {showCoordinates: true},
extensions: [{
class: EightQueensPuzzle, props: {
onGameEvent: (event) => {
console.log("onGameEvent", event)
}
}
}]
})
</script>
</body>
</html>