503 abalone

.gitignore

@@ -1,4 +1,3 @@
 node_modules/
 dist/
-
 .env.local

README.md

@@ -91,8 +91,16 @@ More? Please make a pull request to include it here.
 Commands are listed in package.json.
 In case you want to see the possibilities from the console, run `pnpm run`
 
+<<<<<<< HEAD
+
+### Install build dependencies:
+
+=======
+
 ### Install build dependencies:s
 
+> > > > > > > origin/master
+
 ```sh
 pnpm install
 ```
@@ -109,6 +117,12 @@ rm -rf node_modules pnpm-lock.yaml && pnpm store prune && pnpm install
 pnpm prepare --watch
 ```
 
+### Build the minified bundled dist files: (NOTE: from lila you will likely then need to restart the build as it does not watch for changes on the minified file):
+
+```sh
+pnpm dist
+```
+
 ### Run tests:
 
 ```sh

package.json

@@ -3,19 +3,26 @@
   "version": "7.11.1-pstrat3.3",
   "description": "playstrategy.org chess ui, forked from lichess.org",
   "type": "module",
+  "module": "dist/chessground.js",
   "main": "dist/chessground.js",
   "types": "chessground.d.ts",
-  "exports": {
-    ".": "./dist/chessground.js",
-    "./*": "./dist/*.js"
-  },
   "typesVersions": {
     "*": {
       "*": [
-        "dist/*"
+        "dist/types/*"
       ]
     }
   },
+  "exports": {
+    ".": {
+      "import": "./dist/chessground.js",
+      "types": "./dist/types/chessground.d.ts"
+    },
+    "./*": {
+      "import": "./dist/*.js",
+      "types": "./dist/types/*.d.ts"
+    }
+  },
   "packageManager": "pnpm@9.1.0",
   "engines": {
     "node": ">=20",
@@ -35,7 +42,7 @@
   },
   "scripts": {
     "prepare": "$npm_execpath run compile",
-    "compile": "tsc --sourceMap --declaration",
+    "compile": "tsc --declarationDir dist/types --sourceMap",
     "test": "node node_modules/jest/bin/jest.js",
     "lint": "eslint src/*.ts",
     "format": "prettier --write .",
@@ -48,11 +55,9 @@
     "postinstall": "$npm_execpath run bundle"
   },
   "files": [
-    "/dist/*.js",
-    "/dist/*.d.ts",
-    "/dist/*.js.map",
-    "/assets/*.css",
-    "/src/*.ts"
+    "/src",
+    "/dist",
+    "/assets/*.css"
   ],
   "jest": {
     "globals": {

src/api.ts

@@ -144,11 +144,11 @@ export function start(state: State, redrawAll: cg.Redraw): Api {
     },
 
     move(orig, dest): void {
-      anim(state => board.baseMove(state, orig, dest), state);
+      anim(state => state.baseMove(state, orig, dest), state);
     },
 
     moveNoAnim(orig, dest): void {
-      board.baseMove(state, orig, dest);
+      state.baseMove(state, orig, dest);
       state.dom.redraw();
     },
 

src/board.ts

@@ -24,6 +24,8 @@
 import * as cg from './types';
 import * as T from './transformations';
 
+import { getKeyAtDomPos as abaloneGetKeyAtDomPos } from './variants/abalone/board';
+
 export function setOrientation(state: HeadlessState, o: cg.Orientation): void {
   state.orientation = o;
   state.animation.current = state.draggable.current = state.selected = undefined;
@@ -181,6 +183,10 @@
   state.pocketPieces = newPocketPieces;
 }
 
+/**
+ * called when a piece is moved from orig to dest
+ * @returns: false if the move is invalid, true if the move is valid but no capture happened, or the captured piece if a capture happened
+ */
 export function baseMove(state: HeadlessState, orig: cg.Key, dest: cg.Key): cg.Piece | boolean {
   const origPiece = state.pieces.get(orig),
     destPiece = state.pieces.get(dest);
@@ -234,6 +240,8 @@
     case 'oware':
       //TODO this is more complicated to calculate... (but its only used for sound in lila atm)
       return destPiece && destPiece.playerIndex !== origPiece.playerIndex ? destPiece : undefined;
+    case 'abalone':
+      return undefined; // we compute it from Abalone namespace using HOF
     default:
       return destPiece && destPiece.playerIndex !== origPiece.playerIndex ? destPiece : undefined;
   }
@@ -263,7 +271,7 @@
 }
 
 function baseUserMove(state: HeadlessState, orig: cg.Key, dest: cg.Key): cg.Piece | boolean {
-  const result = baseMove(state, orig, dest);
+  const result = state.baseMove(state, orig, dest);
   if (result) {
     state.movable.dests = undefined;
     state.dropmode.dropDests = undefined;
@@ -466,7 +474,7 @@
   const piece = state.pieces.get(orig);
   return (
     !!piece &&
     (!state.onlyDropsVariant || (state.onlyDropsVariant && orig === 'a0')) &&
     (state.movable.playerIndex === 'both' ||
       (state.movable.playerIndex === piece.playerIndex && state.turnPlayerIndex === piece.playerIndex))
   );
@@ -625,13 +633,18 @@
   cancelMove(state);
 }
 
+// triggered when we click on the svg area (a piece, a square or even an area outside the board drawn can be below the cursor).
+// @return the key of the square that was clicked, or undefined if the click was outside the board.
 export function getKeyAtDomPos(
   pos: cg.NumberPair,
   orientation: cg.Orientation,
   bounds: ClientRect,
   bd: cg.BoardDimensions,
   variant: cg.Variant = 'chess',
 ): cg.Key | undefined {
+  if (variant === 'abalone') {
+    return abaloneGetKeyAtDomPos(pos, orientation, bounds);
+  }
   const bgBorder = 1 / 15;
   const file =
     variant === 'backgammon' || variant === 'hyper' || variant === 'nackgammon'
@@ -729,6 +742,7 @@
   return s.myPlayerIndex === 'p1';
 }
 
+// at least triggered when we use right click to draw arrows or highlight a square
 export function getSnappedKeyAtDomPos(
   orig: cg.Key,
   pos: cg.NumberPair,

src/chessground.ts

@@ -3,7 +3,7 @@ import { Config, configure } from './config';
 import { HeadlessState, State, defaults } from './state';
 import { renderWrap } from './wrap';
 import * as events from './events';
-import { render, updateBounds } from './render';
+import { updateBounds } from './render';
 import * as svg from './svg';
 import * as util from './util';
 
@@ -18,7 +18,7 @@ export function Chessground(element: HTMLElement, config?: Config): Api {
       elements = renderWrap(element, maybeState, relative),
       bounds = util.memo(() => elements.board.getBoundingClientRect()),
       redrawNow = (skipSvg?: boolean): void => {
-        render(state);
+        maybeState.render(state);
         if (!skipSvg && elements.svg) svg.renderSvg(state, elements.svg, elements.customSvg!);
       },
       boundsUpdated = (): void => {

src/config.ts

@@ -1,8 +1,10 @@
+import * as cg from './types';
 import { HeadlessState } from './state';
 import { setSelected, setGoScore } from './board';
 import { read as fenRead, readPocket as fenReadPocket } from './fen';
 import { DrawShape, DrawBrush } from './draw';
-import * as cg from './types';
+
+import { configure as abaloneConfigure } from './variants/abalone/config';
 
 export interface Config {
   fen?: cg.FEN; // chess position in Forsyth notation
@@ -181,6 +183,11 @@ export function configure(state: HeadlessState, config: Config): void {
       ),
     );
   }
+
+  // configure variants
+  if (state.variant === 'abalone') {
+    abaloneConfigure(state);
+  }
 }
 
 function setCheck(state: HeadlessState, playerIndex: cg.PlayerIndex | boolean): void {

src/drag.ts

@@ -7,6 +7,8 @@
 import predrop from './predrop';
 import * as T from './transformations';
 
+import { processDrag as abaloneProcessDrag } from './variants/abalone/drag';
+
 export interface DragCurrent {
   orig: cg.Key; // orig key of dragging piece
   origPos: cg.Pos;
@@ -141,7 +143,7 @@
     force: !!force,
   };
 
   if (piece && board.isPredroppable(s)) {
     s.predroppable.dropDests = predrop(s.pieces, piece, s.dimensions, s.variant);
   }
 
@@ -150,6 +152,7 @@
 
 function processDrag(s: State): void {
   requestAnimationFrame(() => {
+    if (s.variant === 'abalone') return abaloneProcessDrag(s); // "working" WIP: have to use HOF
     const cur = s.draggable.current;
     if (!cur) return;
     // cancel animations while dragging
@@ -172,7 +175,7 @@
         cur.pos = [cur.epos[0] - cur.rel[0], cur.epos[1] - cur.rel[1]];
 
         // move piece
-        const translation = util.posToTranslateAbs(s.dom.bounds(), s.dimensions, s.variant)(cur.origPos, s.orientation);
+        const translation = util.posToTranslateAbs(s.dom.bounds(), s.dimensions, s.variant)(cur.origPos, s.orientation); // until translateAbs becomes a HOF, it has to remain invoked from util.
         translation[0] += cur.pos[0] + cur.dec[0];
         translation[1] += cur.pos[1] + cur.dec[1];
         util.translateAbs(cur.element, translation);
@@ -196,7 +199,7 @@
   if (e.type === 'touchend' && e.cancelable !== false) e.preventDefault();
   // comparing with the origin target is an easy way to test that the end event
   // has the same touch origin
   if (e.type === 'touchend' && cur && cur.originTarget !== e.target && !cur.newPiece) {
     s.draggable.current = undefined;
     return;
   }
@@ -217,7 +220,7 @@
     s.pieces.delete(cur.orig);
     util.callUserFunction(s.events.change);
   }
   if (cur && cur.orig === cur.previouslySelected && (cur.orig === dest || !dest)) board.unselect(s);
   else if (!s.selectable.enabled) board.unselect(s);
 
   removeDragElements(s);

src/fen.ts

@@ -1,11 +1,13 @@
 import { pos2key, NRanks, invNRanks } from './util';
 import * as cg from './types';
 
+import { read as abaloneRead } from './variants/abalone/fen';
+
 export const initial: cg.FEN = 'rnbqkbnr/pppppppp/8/8/8/8/PPPPPPPP/RNBQKBNR';
 const commaFenVariants: cg.Variant[] = ['oware', 'togyzkumalak', 'bestemshe', 'backgammon', 'hyper', 'nackgammon'];
 const mancalaFenVariants: cg.Variant[] = ['oware', 'togyzkumalak', 'bestemshe'];
 
-function roles(letter: string) {
+export function roles(letter: string) {
   return (letter.replace('+', 'p') + '-piece') as cg.Role;
 }
 
@@ -15,6 +17,7 @@ function letters(role: cg.Role) {
 }
 
 export function read(fen: cg.FEN, dimensions: cg.BoardDimensions, variant: cg.Variant): cg.Pieces {
+  if (variant === 'abalone') return abaloneRead(fen, dimensions);
   if (fen === 'start') fen = initial;
   if (fen.indexOf('[') !== -1) fen = fen.slice(0, fen.indexOf('['));
   const pieces: cg.Pieces = new Map();

src/premove.ts

@@ -1,7 +1,9 @@
 import * as util from './util';
 import * as cg from './types';
 
-type Mobility = (x1: number, y1: number, x2: number, y2: number) => boolean;
+import { marble as abaloneMarble } from './variants/abalone/premove';
+
+export type Mobility = (x1: number, y1: number, x2: number, y2: number) => boolean;
 
 function diff(a: number, b: number): number {
   return Math.abs(a - b);
@@ -52,7 +54,7 @@
   const backrank = playerIndex === 'p1' ? '1' : '8';
   const files = [];
   for (const [key, piece] of pieces) {
     if (key[1] === backrank && piece && piece.playerIndex === playerIndex && piece.role === 'r-piece') {
       files.push(util.key2pos(key)[0]);
     }
   }
@@ -96,7 +98,7 @@
   const backrank = playerIndex === 'p1' ? '2' : '9';
   const files = [];
   for (const [key, piece] of pieces) {
     if (key[1] === backrank && piece && piece.playerIndex === playerIndex && piece.role === 'r-piece') {
       files.push(util.key2pos(key)[0]);
     }
   }
@@ -554,7 +556,7 @@
   const piece = pieces.get(key)!;
   const role = piece.role;
   const playerIndex = piece.playerIndex;
   if (!piece) return [];
   const pos = util.key2pos(key);
   let mobility: Mobility;
 
@@ -1147,6 +1149,10 @@
       mobility = breakthroughPawn(pieces, playerIndex);
       break;
 
+    case 'abalone':
+      mobility = abaloneMarble(pieces, playerIndex);
+      break;
+
     // Variants using standard pieces and additional fairy pieces like S-chess, Capablanca, etc.
     default:
       switch (role) {

src/render.ts

@@ -1,28 +1,22 @@
 import { State } from './state';
-import {
-  key2pos,
-  createEl,
-  posToTranslateRel,
-  posToTranslateAbs,
-  translateRel,
-  translateAbs,
-  calculatePlayerEmptyAreas,
-} from './util';
+import { key2pos, createEl, posToTranslateAbs, translateRel, translateAbs, calculatePlayerEmptyAreas } from './util';
 import { p1Pov } from './board';
 import { AnimCurrent, AnimVectors, AnimVector, AnimFadings } from './anim';
 import { DragCurrent } from './drag';
 import * as cg from './types';
 import * as T from './transformations';
 
-type PieceName = string; // `$playerIndex $role`
-type SquareClasses = Map<cg.Key, string>;
+export type PieceName = string; // `$playerIndex $role`
+export type SquareClasses = Map<cg.Key, string>;
 
 // ported from https://github.com/veloce/lichobile/blob/master/src/js/chessground/view.js
 // in case of bugs, blame @veloce
 export function render(s: State): void {
   const orientation = s.orientation,
     asP1: boolean = p1Pov(s),
-    posToTranslate = s.dom.relative ? posToTranslateRel : posToTranslateAbs(s.dom.bounds(), s.dimensions, s.variant),
+    posToTranslate = s.dom.relative
+      ? s.posToTranslateRelative
+      : s.posToTranslateAbsolute(s.dom.bounds(), s.dimensions, s.variant),
     translate = s.dom.relative ? translateRel : translateAbs,
     boardEl: HTMLElement = s.dom.elements.board,
     pieces: cg.Pieces = s.pieces,
@@ -215,18 +209,18 @@ export function updateBounds(s: State): void {
   }
 }
 
-function isPieceNode(el: cg.PieceNode | cg.SquareNode): el is cg.PieceNode {
+export function isPieceNode(el: cg.PieceNode | cg.SquareNode): el is cg.PieceNode {
   return el.tagName === 'PIECE';
 }
-function isSquareNode(el: cg.PieceNode | cg.SquareNode): el is cg.SquareNode {
+export function isSquareNode(el: cg.PieceNode | cg.SquareNode): el is cg.SquareNode {
   return el.tagName === 'SQUARE';
 }
 
-function removeNodes(s: State, nodes: HTMLElement[]): void {
+export function removeNodes(s: State, nodes: HTMLElement[]): void {
   for (const node of nodes) s.dom.elements.board.removeChild(node);
 }
 
-function posZIndex(pos: cg.Pos, orientation: cg.Orientation, asP1: boolean, bd: cg.BoardDimensions): string {
+export function posZIndex(pos: cg.Pos, orientation: cg.Orientation, asP1: boolean, bd: cg.BoardDimensions): string {
   pos = T.mapToP1[orientation](pos, bd);
   let z = 2 + (pos[1] - 1) * bd.height + (bd.width - pos[0]);
   if (asP1) z = 67 - z;
@@ -354,7 +348,7 @@ function addSquare(squares: SquareClasses, key: cg.Key, klass: string): void {
   else squares.set(key, klass);
 }
 
-function appendValue<K, V>(map: Map<K, V[]>, key: K, value: V): void {
+export function appendValue<K, V>(map: Map<K, V[]>, key: K, value: V): void {
   const arr = map.get(key);
   if (arr) arr.push(value);
   else map.set(key, [value]);

src/state.ts

@@ -1,8 +1,11 @@
 import * as fen from './fen';
 import { AnimCurrent } from './anim';
+import { baseMove } from './board';
 import { DragCurrent } from './drag';
 import { Drawable } from './draw';
-import { timer } from './util';
+import { render } from './render';
+import { key2pos, posToTranslateAbs, posToTranslateRel, timer } from './util';
+import { pos2px } from './svg';
 import * as cg from './types';
 
 export interface HeadlessState {
@@ -136,6 +139,21 @@ export interface HeadlessState {
   notation: cg.Notation;
   onlyDropsVariant: boolean;
   singleClickMoveVariant: boolean;
+  baseMove: (state: HeadlessState, orig: cg.Key, dest: cg.Key) => cg.Piece | boolean;
+  render: (state: State) => void;
+  posToTranslateRelative: (
+    pos: cg.Pos,
+    orientation: cg.Orientation,
+    bt: cg.BoardDimensions,
+    v: cg.Variant,
+  ) => cg.NumberPair;
+  posToTranslateAbsolute: (
+    bounds: ClientRect,
+    bt: cg.BoardDimensions,
+    variant: cg.Variant,
+  ) => (pos: cg.Pos, orientation: cg.Orientation) => cg.NumberPair;
+  pos2px: (pos: cg.Pos, bounds: ClientRect, bd: cg.BoardDimensions) => cg.NumberPair;
+  key2pos: (k: cg.Key) => cg.Pos;
 }
 
 export interface State extends HeadlessState {
@@ -248,5 +266,11 @@ export function defaults(): HeadlessState {
     notation: cg.Notation.DEFAULT,
     onlyDropsVariant: false,
     singleClickMoveVariant: false,
+    baseMove,
+    render,
+    posToTranslateRelative: posToTranslateRel,
+    posToTranslateAbsolute: posToTranslateAbs,
+    pos2px,
+    key2pos,
   };
 }