npm install ampersand-chess-view
Clone the repo and run
npm install && npm run demo.
boardConfig (object, optional)
Chessboard (function, optional)
This library isn't bundled with
ampersand-chess-view in case you only want to use other parts of it.
role (string, ['black', 'white', 'watcher', 'analysis'], default: 'watcher')
This is either the color that you want to be the active player for the board. Here's what each does:
whiteWhite is the currently playable color
blackBlack is the currently playable color
analysisBoth colors are playable
watcherneither color is playable. This is useful if you want to have the board be playable for two players and watchable by the rest.
computer (boolean, false)
true to have a computer player initialized for the unplayed
role. By default the computer will play a random move in 1 second. Extend the
playComputer() method to change this behavior.
This object will be passed directly to
ampersand-chess-state. See the documentation there for more details. You can use this to set the initial position with its
Out of the box, this view provides bindings and derived properties to bind some of the helpful
ampersand-chess-state values with elements in the default template. Most of the time you'ree going to want to supply your own template, but you can populate it with the following
data-hooks and they'll be populated and auto-upadte with the necessary values.
The element that will house the
The element will be populated with the current text status. This includes the current color's turn if the game is still going or the end result of the game if it is finished. Also changes to include "you/your" in place of the color based on the user's
This will set the
innerHTML of the elment to an ascii version of the position. Works best with a
This will be set to the text of the
FEN of the current position.
These are bound with click events which will call the data-hook's method on the
These will be disabled based on if there is the ability to undo/redo moves in the game. Watchers can always undo/redo but the current players cannot.
These will be updated with the current time left for each side. Will be displayed as
mm:ss with the milliseconds visible if the time is below 60 seconds.
npm test for the command line tests (using phantomjs) or
npm start to open a browser with the tests. Could use some more.