chess-console

ES6 Module for playing chess

Usage no npm install needed!

<script type="module">
  import chessConsole from 'https://cdn.skypack.dev/chess-console';
</script>

README

chess-console

chess-console is a chess game client framework, which uses cm-chessboard and Bootstrap 4 to create a browser based, mobile friendly, responsive chess game gui.

chess-console is used in Production

Used by chessmail as a framework for an online chess computer.

Component structure

Because if its component architecture chess-console is expandable for all kind of chess pages. You may check out the Stockfish Player for chess-console, with whom chess-console is a fully functional online chess computer.

Screenshot

Example chess-console

Installation

  • Option 1: Download from GitHub and run npm install without parameters, or
  • Option 2: Install the npm package with npm install --save chess-console

Documentation

Constructor

ChessConsole(container, player, opponent, props)

  • container: DOM parent element
  • player: {name: playerName, type: Class of player, props: {}}
  • opponent: {name: opponentName, type: Class of opponent, props: {}}
  • props: Properties

props

{
    // chess console
    locale: navigator.language, // locale for i18n
    playerColor: COLOR.white, // the players color (color at bottom)
    pgn: undefined // initial pgn, can contain header and history
    // Sound
    soundSpriteFile: "/assets/sounds/chess_console_sounds.mp3",
    // Board
    chessboardSpriteFile: "/assets/images/chessboard-sprite.svg",
    // Persistence
    savePrefix: "ChessConsole" // the name in LocalStorage
}

state

chessConsole.state

{
    this.chess = new Chess()
    this.playerColor = props.playerColor || COLOR.white
    this.orientation = props.playerColor || COLOR.white
    this.plyViewed = 0
    this.plyCount = 0
}

Methods

playerWhite()

returns the white player

playerBlack()

return the black player

playerToMove()

return the player who can make a move, null if game_over

loadPgn(pgn)

Loads the history part of a PGN, the metadata is ignored

nextMove()

Request the nextMove from playerToMove()

undoMove()

Take back the last move

initGame(props)

Set a position and player color

newGame(props)

Like initGame(props), but sends newGame event via messageBroker.

Messaging

chessConsole.messageBroker

Messages:

export const MESSAGE = {
    newGame: function newGame(props) { // A new game was started
        this.props = props
    },
    initGame: function initGame(props) { // The game was initialized
        this.props = props
    },
    gameOver: function gameOver(wonColor) { // w, b, null for draw
        this.wonColor = wonColor
    },
    moveRequest: function moveRequest(player) {
        this.player = player
    },
    legalMove: function legalMove(player, move, moveResult) {
        this.player = player
        this.move = move
        this.moveResult = moveResult
    },
    illegalMove: function illegalMove(player, move) {
        this.player = player
        this.move = move
    },
    moveUndone: function moveUndone() {
    },
    load: function load() {
    }
}

Licenses

Source code license: MIT,
License for the Sounds: CC BY 4.0,
License of the SVG pieces CC BY-SA 3.0.

Copyright © shaack.com engineering.