API

<hexchess-board>

A hexagonal chess board used for playing Glinsky-style hex chess. Player variables

Attributes

Name	Description	Type	Default
turn	Whose turn it is initially	string
board	A hex-FEN notation describing the state of the board. If the string is empty, no pieces will be rendered.	Board
moves	A list of moves made on the board. This is useful for analyzing games already played or certain pre-determined openings.	Move[]
black-player-name	Black's player name	string	'Black'
white-player-name	White's player name	string	'White'
orientation	The orientation of the board.	Orientation	'white'
player-role	The role of the player. If `white`, you can only make moves when it is white's turn. If `black`, you can only make moves when it is black's turn. If `spectator`, then you cannot make moves at all via the UI. If `analyzer`, then you can make moves for both sides, and it simuluates a local game.	Role	'analyzer'
hide-coordinates	Show the board coordinates on the bottom and left sides of the board.	boolean	false
frozen	Do not allow any other moves beyond the predetermined ones set in the `moves` property.	boolean	false
show-hints	Clicking on an opponent's piece shows all the squares it can move to	boolean	true
hide-playernames	Hide player names - usually only used for custom websites to render player names separately.	boolean	false
hide-capturedpieces	Hide captured pieces - usually only used for custom websites to render captured pieces separately.	boolean	false

Methods

Name

Parameters

Description

Return

export

Exports the current game to a CSV list of moves that can be fed back into this same component.

string

fen

Converts to a hex-FEN notation describing the state of the board. Includes the positions of all the pieces along with whose turn it is.

string

flip

Flip the orientation of the board.

void

resize

Resize the board based on the latest dimensions given to the shadow root.

void

rewind

Rewinds one move to a previous position. If there are no previous moves, this does nothing.

void

rewindAll

Rewinds all moves until the starting position of the board is reached.

void

fastForward

Fast forwards one move to the next position. If there are no next moves, this does nothing.

void

fastForwardAll

Fast forwards all moves until the current state of the board is reached.

void

freeze

Prevent any more moves to the game. Usually called when the game is over.

void

unfreeze

Unfreeze the board and re-enable moves to be made.

void

move

Name	Description	Type
from		string

Make a move on the board.

move

Name	Description	Type
from		Square
to		Square

boolean

move

Name	Description	Type
arg		string \| Square
to		Square

boolean

promote

Name	Description	Type
piece		Piece

Promote a pawn.

reset

Resets and unfreezes the board to the default start state.

void

stopCustomEvents

Pauses all custom events from being emitted. This is useful when replaying many pre-programmed moves.

void

restartCustomEvents

void

Events

Name	Description
promoting	Fired when a pawn is ready to promote.
promoted	Fired when a pawn has been promoted to a piece.
gameover	Fired when the game is over.
move	Fired when a move is made on the board.
furthestback	Fired when the game is rewound to its starting position.
furthestforward	Fired when a game is fast forwarded back to its current position.

CSS Custom Properties

Name	Description
--hexchess-playername-size	The font size of the player names.
--hexchess-playername-color	The color of the player names. Board variables
--hexchess-board-bg	The background color of the whitespace of the board (not tiles).
--hexchess-white-bg	The background color of the white tiles.
--hexchess-selected-white-bg	The background color of a white tile that's selected to be moved.
--hexchess-black-bg	The background color of the black tiles.
--hexchess-selected-black-bg	The background color of a black tile that's selected to be moved.
--hexchess-grey-bg	The background color of the grey tiles.
--hexchess-selected-grey-bg	The background color of a grey tile that's selected to be moved.
--hexchess-label-bg	The background color of the column and row labels.
--hexchess-label-size	The font size of the column and row labels.
--hexchess-possible-move-bg	The fill color of the small dot shown on a hexagon indicating this is a legal move.
--hexchess-possible-move-opponent-bg	The fill color of the small dot shown on a hexagon indicating this is a move an opponent piece can make.
--hexchess-possible-capture-bg	The stroke color of the large circle outlining a piece that can be captured.
--hexchess-possible-move-stroke-white	The outline color of a hexagon when the user drags over a white square, trying to move there.
--hexchess-possible-move-stroke-grey	The outline color of a hexagon when the user drags over a grey square, trying to move there.
--hexchess-possible-move-stroke-black	The outline color of a hexagon when the user drags over a black square, trying to move there.
--hexchess-possible-move-stroke-opponent	The outline of a square when dragging an opponent piece to a possible move. Custom events