lichess-org · ornicar · Jun 25, 2025 · Jun 15, 2025 · Jun 16, 2025 · Jun 16, 2025
diff --git a/ui/lib/src/nvui/chess.ts b/ui/lib/src/nvui/chess.ts
@@ -525,7 +525,7 @@ const squareSelector = (rank: string, file: string) =>
 
 const isKey = (maybeKey: string): maybeKey is Key => !!maybeKey.match(/^[a-h][1-8]$/);
 
-const keyFromAttrs = (el: HTMLElement): Key | undefined => {
+export const keyFromAttrs = (el: HTMLElement): Key | undefined => {
   const maybeKey = `${el.getAttribute('file') ?? ''}${el.getAttribute('rank') ?? ''}`;
   return isKey(maybeKey) ? maybeKey : undefined;
 };
@@ -552,5 +552,5 @@ const transSanToWords = (san: string): string =>
 const transRole = (role: Role): string =>
   (i18n.nvui[role as keyof typeof i18n.nvui] as string) || (role as string);
 
-const transPieceStr = (role: Role, color: Color, i18n: I18n): string =>
+export const transPieceStr = (role: Role, color: Color, i18n: I18n): string =>
   i18n.nvui[`${color}${role.charAt(0).toUpperCase()}${role.slice(1)}` as keyof typeof i18n.nvui] as string;
diff --git a/ui/lib/src/nvui/command.ts b/ui/lib/src/nvui/command.ts
@@ -47,6 +47,7 @@ export const boardCommands = (): VNode[] => [
       `shift+1 to 8: ${i18n.nvui.moveToFile}`,
       `shift+a/d: ${i18n.site.keyMoveBackwardOrForward}`,
       `alt+shift+a/d: ${i18n.site.cyclePreviousOrNextVariation}`,
+      'x: announce pieces around this square (try shift and alt)',
     ].reduce(addBreaks, []),
   ]),
 ];

diff --git a/ui/lib/src/nvui/directionScan.ts b/ui/lib/src/nvui/directionScan.ts
@@ -0,0 +1,92 @@
+import { Pieces, Pos } from '@lichess-org/chessground/types';
+import { key2pos, pos2key } from '@lichess-org/chessground/util';
+import { keyFromAttrs, MoveStyle, renderKey, transPieceStr } from './chess';
+
+const directions = ['top', 'topRight', 'right', 'bottomRight', 'bottom', 'bottomLeft', 'left', 'topLeft'];
+type Direction = (typeof directions)[number];
+
+function getKeysOnRay(originKey: Key, direction: Direction, pov: Color): Key[] {
+  const originPos = key2pos(originKey);
+  const [fileIndex, rankIndex] = originPos;
+  const asWhite = pov === 'white';
+  const result = [] as Key[];
+
+  for (let d = 1; d < 8; d++) {
+    let possibleKey = [-1, -1];
+    switch (direction) {
+      case 'top':
+        possibleKey = asWhite ? [fileIndex, rankIndex + d] : [fileIndex, rankIndex - d];
+        break;
+      case 'topRight':
+        possibleKey = asWhite ? [fileIndex + d, rankIndex + d] : [fileIndex - d, rankIndex - d];
+        break;
+      case 'right':
+        possibleKey = asWhite ? [fileIndex + d, rankIndex] : [fileIndex - d, rankIndex];
+        break;
+      case 'bottomRight':
+        possibleKey = asWhite ? [fileIndex + d, rankIndex - d] : [fileIndex - d, rankIndex + d];
+        break;
+      case 'bottom':
+        possibleKey = asWhite ? [fileIndex, rankIndex - d] : [fileIndex, rankIndex + d];
+        break;
+      case 'bottomLeft':
+        possibleKey = asWhite ? [fileIndex - d, rankIndex - d] : [fileIndex + d, rankIndex + d];
+        break;
+      case 'left':
+        possibleKey = asWhite ? [fileIndex - d, rankIndex] : [fileIndex + d, rankIndex];
+        break;
+      case 'topLeft':
+        possibleKey = asWhite ? [fileIndex - d, rankIndex + d] : [fileIndex + d, rankIndex - d];
+        break;
+    }
+    if (possibleKey[0] > -1 && possibleKey[0] < 8 && possibleKey[1] > -1 && possibleKey[1] < 8)
+      result.push(pos2key(possibleKey as Pos));
+    else break;
+  }
+  return result;
+}
+
+export function scanDirectionsHandler(pov: Color, pieces: Pieces, style: MoveStyle) {
+  return (ev: KeyboardEvent): void => {
+    const target = ev.target as HTMLElement;
+    const originKey = keyFromAttrs(target) as Key;
+    const currentDirection: Direction | null = target.getAttribute('ray') as Direction | null;
+
+    let nextRay: Key[] = [];
+    let nextDirectionIndex = 0;
+
+    if (currentDirection == null) {
+      nextDirectionIndex = ev.altKey ? 0 : 1;
+    } else {
+      nextDirectionIndex = directions.indexOf(currentDirection);
+      if ((ev.altKey && nextDirectionIndex % 2 === 0) || (!ev.altKey && nextDirectionIndex % 2 === 1))
+        nextDirectionIndex = (nextDirectionIndex + (ev.shiftKey ? 6 : 2)) % 8;
+      else nextDirectionIndex = (nextDirectionIndex + (ev.shiftKey ? 7 : 1)) % 8;
+    }
+
+    for (let i = 0; i < 4; i++) {
+      const rayKeys = getKeysOnRay(originKey, directions[nextDirectionIndex], pov);
+      if (rayKeys.length == 0) {
+        nextDirectionIndex = (nextDirectionIndex + (ev.shiftKey ? 6 : 2)) % 8;
+      } else {
+        nextRay = rayKeys;
+        target.setAttribute('ray', directions[nextDirectionIndex]);
+        break;
+      }
+    }
+
+    const $boardLive = $('.boardstatus');
+    const renderedPieces = nextRay.reduce<string[]>(
+      (acc, key) =>
+        pieces.get(key)
+          ? acc.concat(
+              `${renderKey(key, style)} ${transPieceStr(pieces.get(key)!.role, pieces.get(key)!.color, i18n)}`,
+            )
+          : acc,
+      [],
+    );
+    $boardLive.text(
+      `${renderKey(originKey, style)}: ${directions[nextDirectionIndex]}: ${renderedPieces.length > 0 ? renderedPieces.join(' , ') : i18n.site.none}`,
+    );
+  };
+}
diff --git a/ui/round/src/plugins/round.nvui.ts b/ui/round/src/plugins/round.nvui.ts
@@ -31,6 +31,7 @@ import {
   type DropMove,
   pocketsStr,
 } from 'lib/nvui/chess';
+import { scanDirectionsHandler } from 'lib/nvui/directionScan';
 import { makeSetting, renderSetting, Setting } from 'lib/nvui/setting';
 import { Notify } from 'lib/nvui/notify';
 import { commands, boardCommands } from 'lib/nvui/command';
@@ -181,6 +182,7 @@ function renderBoard(ctrl: RoundController): LooseVNodes {
   const prefixStyle = prefixSetting(),
     pieceStyle = pieceSetting(),
     positionStyle = positionSetting(),
+    moveStyle = styleSetting(),
     boardStyle = boardSetting();
 
   return [
@@ -191,12 +193,22 @@ function renderBoard(ctrl: RoundController): LooseVNodes {
         hook: onInsert(el => {
           const $board = $(el);
           const $buttons = $board.find('button');
+          $buttons.on('blur', (ev: KeyboardEvent) => {
+            const $currBtn = $(ev.target as HTMLElement);
+            $currBtn.removeAttr('ray');
+          });
           $buttons.on(
             'click',
             selectionHandler(() => ctrl.data.opponent.color, selectSound),
           );
           $buttons.on('keydown', (e: KeyboardEvent) => {
             if (e.shiftKey && e.key.match(/^[ad]$/i)) nextOrPrev(ctrl)(e);
+            else if (e.key.match(/^x$/i))
+              scanDirectionsHandler(
+                ctrl.data.player.color,
+                ctrl.chessground.state.pieces,
+                moveStyle.get(),
+              )(e);
             else if (['o', 'l', 't'].includes(e.key)) boardCommandsHandler()(e);
             else if (e.key.startsWith('Arrow')) arrowKeyHandler(ctrl.data.player.color, borderSound)(e);
             else if (e.key === 'c')