chess2img 0.2.0 → 0.2.2

package/dist/index.d.cts

@@ -51,10 +51,13 @@ interface BoardColors {
     darkSquare?: string;
     highlight?: string;
 }
+type CoordinatesPosition = "border" | "inside";
 interface CoordinatesOptions {
     enabled?: boolean;
+    position?: CoordinatesPosition;
     color?: string;
 }
+type CoordinatesInput = boolean | CoordinatesPosition | CoordinatesOptions;
 interface RenderOptions {
     size?: number;
     padding?: Padding;
@@ -64,7 +67,7 @@ interface RenderOptions {
     theme?: string | ThemeDefinition;
     highlightSquares?: Square[];
     colors?: BoardColors;
-    coordinates?: boolean | CoordinatesOptions;
+    coordinates?: CoordinatesInput;
 }
 interface ChessImageGeneratorOptions extends RenderOptions {
 }
@@ -75,7 +78,8 @@ interface ResolvedColors {
 }
 interface ResolvedCoordinates {
     enabled: boolean;
-    color: string;
+    position: CoordinatesPosition;
+    color?: string;
 }
 interface ResolvedRenderOptions {
     size: number;
@@ -122,4 +126,4 @@ declare function renderChess(options: RenderChessOptions): Promise<Buffer>;
 
 declare function registerTheme(theme: ThemeDefinition): ThemeDefinition;
 
-export { type BoardArray, type BoardCell, type BoardColors, ChessImageGenerator, type ChessImageGeneratorOptions, type CoordinatesOptions, IOError, type Padding, ParseError, type PieceKey, type PieceStyle, type PngAssetSource, type RenderChessOptions, RenderError, type RenderOptions, type ResolvedColors, type ResolvedCoordinates, type ResolvedRenderOptions, type Square, type SvgAssetSource, type ThemeAssetSource, type ThemeDefinition, ThemeError, ValidationError, registerTheme, renderChess };
+export { type BoardArray, type BoardCell, type BoardColors, ChessImageGenerator, type ChessImageGeneratorOptions, type CoordinatesInput, type CoordinatesOptions, type CoordinatesPosition, IOError, type Padding, ParseError, type PieceKey, type PieceStyle, type PngAssetSource, type RenderChessOptions, RenderError, type RenderOptions, type ResolvedColors, type ResolvedCoordinates, type ResolvedRenderOptions, type Square, type SvgAssetSource, type ThemeAssetSource, type ThemeDefinition, ThemeError, ValidationError, registerTheme, renderChess };

package/dist/index.d.ts

@@ -51,10 +51,13 @@ interface BoardColors {
     darkSquare?: string;
     highlight?: string;
 }
+type CoordinatesPosition = "border" | "inside";
 interface CoordinatesOptions {
     enabled?: boolean;
+    position?: CoordinatesPosition;
     color?: string;
 }
+type CoordinatesInput = boolean | CoordinatesPosition | CoordinatesOptions;
 interface RenderOptions {
     size?: number;
     padding?: Padding;
@@ -64,7 +67,7 @@ interface RenderOptions {
     theme?: string | ThemeDefinition;
     highlightSquares?: Square[];
     colors?: BoardColors;
-    coordinates?: boolean | CoordinatesOptions;
+    coordinates?: CoordinatesInput;
 }
 interface ChessImageGeneratorOptions extends RenderOptions {
 }
@@ -75,7 +78,8 @@ interface ResolvedColors {
 }
 interface ResolvedCoordinates {
     enabled: boolean;
-    color: string;
+    position: CoordinatesPosition;
+    color?: string;
 }
 interface ResolvedRenderOptions {
     size: number;
@@ -122,4 +126,4 @@ declare function renderChess(options: RenderChessOptions): Promise<Buffer>;
 
 declare function registerTheme(theme: ThemeDefinition): ThemeDefinition;
 
-export { type BoardArray, type BoardCell, type BoardColors, ChessImageGenerator, type ChessImageGeneratorOptions, type CoordinatesOptions, IOError, type Padding, ParseError, type PieceKey, type PieceStyle, type PngAssetSource, type RenderChessOptions, RenderError, type RenderOptions, type ResolvedColors, type ResolvedCoordinates, type ResolvedRenderOptions, type Square, type SvgAssetSource, type ThemeAssetSource, type ThemeDefinition, ThemeError, ValidationError, registerTheme, renderChess };
+export { type BoardArray, type BoardCell, type BoardColors, ChessImageGenerator, type ChessImageGeneratorOptions, type CoordinatesInput, type CoordinatesOptions, type CoordinatesPosition, IOError, type Padding, ParseError, type PieceKey, type PieceStyle, type PngAssetSource, type RenderChessOptions, RenderError, type RenderOptions, type ResolvedColors, type ResolvedCoordinates, type ResolvedRenderOptions, type Square, type SvgAssetSource, type ThemeAssetSource, type ThemeDefinition, ThemeError, ValidationError, registerTheme, renderChess };

package/dist/index.js

@@ -158,16 +158,37 @@ function validateBoardColors(colors) {
 function isCoordinatesOptions(value) {
   return typeof value === "object" && value !== null && !Array.isArray(value);
 }
-function validateCoordinatesOption(coordinates) {
+function isCoordinatesPosition(value) {
+  return value === "border" || value === "inside";
+}
+function validateCoordinatesOption(coordinates, borderSize) {
   if (coordinates === void 0 || typeof coordinates === "boolean") {
     return;
   }
+  if (isCoordinatesPosition(coordinates)) {
+    if (coordinates === "border" && borderSize === 0) {
+      throw new ValidationError(
+        "coordinates position 'border' requires borderSize > 0"
+      );
+    }
+    return;
+  }
   if (!isCoordinatesOptions(coordinates)) {
-    throw new ValidationError("coordinates must be a boolean or an options object");
+    throw new ValidationError(
+      "coordinates must be false, true, 'border', 'inside', or an options object"
+    );
   }
   if (coordinates.enabled !== void 0 && typeof coordinates.enabled !== "boolean") {
     throw new ValidationError("coordinates.enabled must be a boolean");
   }
+  if (coordinates.position !== void 0 && !isCoordinatesPosition(coordinates.position)) {
+    throw new ValidationError("coordinates.position must be 'border' or 'inside'");
+  }
+  if (coordinates.enabled !== false && coordinates.position === "border" && borderSize === 0) {
+    throw new ValidationError(
+      "coordinates position 'border' requires borderSize > 0"
+    );
+  }
   if (coordinates.color !== void 0) {
     validateColorString(coordinates.color, "coordinates.color");
   }
@@ -269,16 +290,54 @@ function createBoardGeometry({
   );
   const displayedFiles = flipped ? [...FILES].reverse() : [...FILES];
   const displayedRanks = flipped ? [...RANKS].reverse() : [...RANKS];
-  const fileLabels = borderSize ? displayedFiles.map((file, fileIndex) => ({
+  const bottomEdgeRank = flipped ? "8" : "1";
+  const leftEdgeFile = flipped ? "h" : "a";
+  const borderFileLabels = borderSize ? displayedFiles.map((file, fileIndex) => ({
     text: file,
     x: boardX + fileIndex * squareSize + squareSize / 2,
-    y: boardOuterY + boardOuterSize - borderSize / 2
+    y: boardOuterY + boardOuterSize - borderSize / 2,
+    square: `${file}${bottomEdgeRank}`,
+    textAlign: "center",
+    textBaseline: "middle"
   })) : [];
-  const rankLabels = borderSize ? displayedRanks.map((rank, rankIndex) => ({
+  const borderRankLabels = borderSize ? displayedRanks.map((rank, rankIndex) => ({
     text: rank,
     x: boardOuterX + borderSize / 2,
-    y: boardY + rankIndex * squareSize + squareSize / 2
+    y: boardY + rankIndex * squareSize + squareSize / 2,
+    square: `${leftEdgeFile}${rank}`,
+    textAlign: "center",
+    textBaseline: "middle"
   })) : [];
+  const insideFileInsetX = squareSize * 0.14;
+  const insideFileInsetY = squareSize * 0.1;
+  const insideRankInsetX = squareSize * 0.14;
+  const insideRankInsetY = squareSize * 0.1;
+  const insideLabelMaxWidth = squareSize * 0.26;
+  const insideLabelMaxHeight = squareSize * 0.24;
+  const insideFileLabels = displayedFiles.map((file) => {
+    const square = `${file}${bottomEdgeRank}`;
+    const squareGeometry = squares[square];
+    return {
+      text: file,
+      x: squareGeometry.x + squareGeometry.size - insideFileInsetX,
+      y: squareGeometry.y + squareGeometry.size - insideFileInsetY,
+      square,
+      textAlign: "right",
+      textBaseline: "bottom"
+    };
+  });
+  const insideRankLabels = displayedRanks.map((rank) => {
+    const square = `${leftEdgeFile}${rank}`;
+    const squareGeometry = squares[square];
+    return {
+      text: rank,
+      x: squareGeometry.x + insideRankInsetX,
+      y: squareGeometry.y + insideRankInsetY,
+      square,
+      textAlign: "left",
+      textBaseline: "top"
+    };
+  });
   return {
     imageWidth: left + size + right,
     imageHeight: top + size + bottom,
@@ -290,8 +349,16 @@ function createBoardGeometry({
     boardX,
     boardY,
     boardSize,
-    fileLabels,
-    rankLabels,
+    borderFileLabels,
+    borderRankLabels,
+    insideFileLabels,
+    insideRankLabels,
+    insideFileInsetX,
+    insideFileInsetY,
+    insideRankInsetX,
+    insideRankInsetY,
+    insideLabelMaxWidth,
+    insideLabelMaxHeight,
     squares
   };
 }
@@ -395,6 +462,9 @@ var MIN_COORDINATE_FONT_SIZE = 8;
 var MAX_FILE_LABEL_WIDTH_RATIO = 0.75;
 var MAX_RANK_LABEL_WIDTH_RATIO = 0.7;
 var MAX_LABEL_HEIGHT_RATIO = 0.7;
+var INSIDE_COORDINATE_MAX_FONT_RATIO = 0.34;
+var INSIDE_LIGHT_LABEL_COLOR = "rgba(255,255,255,0.6)";
+var INSIDE_DARK_LABEL_COLOR = "rgba(0,0,0,0.45)";
 function isDarkSquare(square) {
   const fileIndex = square.charCodeAt(0) - 97;
   const rankNumber = Number(square[1]);
@@ -410,22 +480,25 @@ async function getPieceRaster(themeName, pieceKey, asset, squareSize) {
   pieceRasterCache.set(cacheKey, raster);
   return raster;
 }
-function drawCoordinates(context, request, geometry) {
-  if (!request.coordinates.enabled || geometry.borderSize === 0) {
-    return;
+function resolveInsideLabelColor(request, square) {
+  if (request.coordinates.color) {
+    return request.coordinates.color;
   }
+  return isDarkSquare(square) ? INSIDE_LIGHT_LABEL_COLOR : INSIDE_DARK_LABEL_COLOR;
+}
+function resolveBorderCoordinateFontSize(context, geometry) {
   const maxFontSize = Math.floor(
     Math.min(geometry.squareSize * 0.6, geometry.borderSize * 0.65)
   );
   let fontSize = null;
   for (let candidate = maxFontSize; candidate >= MIN_COORDINATE_FONT_SIZE; candidate -= 1) {
     context.font = `${candidate}px sans-serif`;
-    const filesFit = geometry.fileLabels.every((label) => {
+    const filesFit = geometry.borderFileLabels.every((label) => {
       const metrics = context.measureText(label.text);
       const textHeight = metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent;
       return metrics.width <= geometry.squareSize * MAX_FILE_LABEL_WIDTH_RATIO && textHeight <= geometry.borderSize * MAX_LABEL_HEIGHT_RATIO;
     });
-    const ranksFit = geometry.rankLabels.every((label) => {
+    const ranksFit = geometry.borderRankLabels.every((label) => {
       const metrics = context.measureText(label.text);
       const textHeight = metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent;
       return metrics.width <= geometry.borderSize * MAX_RANK_LABEL_WIDTH_RATIO && textHeight <= geometry.squareSize * MAX_LABEL_HEIGHT_RATIO;
@@ -435,20 +508,80 @@ function drawCoordinates(context, request, geometry) {
       break;
     }
   }
+  return fontSize;
+}
+function resolveInsideCoordinateFontSize(context, geometry) {
+  const maxFontSize = Math.floor(
+    geometry.squareSize * INSIDE_COORDINATE_MAX_FONT_RATIO
+  );
+  let fontSize = null;
+  for (let candidate = maxFontSize; candidate >= MIN_COORDINATE_FONT_SIZE; candidate -= 1) {
+    context.font = `${candidate}px sans-serif`;
+    const filesFit = geometry.insideFileLabels.every((label) => {
+      const metrics = context.measureText(label.text);
+      const textHeight = metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent;
+      return metrics.width <= geometry.insideLabelMaxWidth && textHeight <= geometry.insideLabelMaxHeight;
+    });
+    const ranksFit = geometry.insideRankLabels.every((label) => {
+      const metrics = context.measureText(label.text);
+      const textHeight = metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent;
+      return metrics.width <= geometry.insideLabelMaxWidth && textHeight <= geometry.insideLabelMaxHeight;
+    });
+    if (filesFit && ranksFit) {
+      fontSize = candidate;
+      break;
+    }
+  }
+  return fontSize;
+}
+function drawBorderCoordinates(context, request, geometry) {
+  if (geometry.borderSize === 0) {
+    return;
+  }
+  const fontSize = resolveBorderCoordinateFontSize(context, geometry);
   if (fontSize === null) {
     return;
   }
-  context.fillStyle = request.coordinates.color;
+  context.fillStyle = request.coordinates.color ?? "#333";
   context.font = `${fontSize}px sans-serif`;
   context.textAlign = "center";
   context.textBaseline = "middle";
-  for (const label of geometry.fileLabels) {
+  for (const label of geometry.borderFileLabels) {
     context.fillText(label.text, label.x, label.y);
   }
-  for (const label of geometry.rankLabels) {
+  for (const label of geometry.borderRankLabels) {
     context.fillText(label.text, label.x, label.y);
   }
 }
+function drawInsideCoordinates(context, request, geometry) {
+  const fontSize = resolveInsideCoordinateFontSize(context, geometry);
+  if (fontSize === null) {
+    return;
+  }
+  context.font = `${fontSize}px sans-serif`;
+  for (const label of geometry.insideFileLabels) {
+    context.fillStyle = resolveInsideLabelColor(request, label.square);
+    context.textAlign = label.textAlign;
+    context.textBaseline = label.textBaseline;
+    context.fillText(label.text, label.x, label.y);
+  }
+  for (const label of geometry.insideRankLabels) {
+    context.fillStyle = resolveInsideLabelColor(request, label.square);
+    context.textAlign = label.textAlign;
+    context.textBaseline = label.textBaseline;
+    context.fillText(label.text, label.x, label.y);
+  }
+}
+function drawCoordinates(context, request, geometry) {
+  if (!request.coordinates.enabled) {
+    return;
+  }
+  if (request.coordinates.position === "border") {
+    drawBorderCoordinates(context, request, geometry);
+    return;
+  }
+  drawInsideCoordinates(context, request, geometry);
+}
 var CanvasPngRenderer = class {
   async render(request) {
     try {
@@ -669,7 +802,7 @@ var DEFAULT_COLORS = {
 };
 var DEFAULT_COORDINATES = {
   enabled: false,
-  color: "#333"
+  position: "inside"
 };
 function normalizeColors(colors) {
   return {
@@ -678,19 +811,30 @@ function normalizeColors(colors) {
     highlight: colors?.highlight ?? DEFAULT_COLORS.highlight
   };
 }
-function normalizeCoordinates(coordinates) {
+function normalizeCoordinates(coordinates, borderSize) {
   if (coordinates === void 0 || coordinates === false) {
     return { ...DEFAULT_COORDINATES };
   }
+  const defaultPosition = borderSize > 0 ? "border" : "inside";
   if (coordinates === true) {
     return {
       enabled: true,
-      color: DEFAULT_COORDINATES.color
+      position: defaultPosition,
+      color: defaultPosition === "border" ? "#333" : void 0
+    };
+  }
+  if (coordinates === "border" || coordinates === "inside") {
+    return {
+      enabled: true,
+      position: coordinates,
+      color: coordinates === "border" ? "#333" : void 0
     };
   }
+  const position = coordinates.position ?? defaultPosition;
   return {
     enabled: coordinates.enabled ?? true,
-    color: coordinates.color ?? DEFAULT_COORDINATES.color
+    position,
+    color: coordinates.color ?? (position === "border" ? "#333" : void 0)
   };
 }
 function normalizeRenderInputs(options) {
@@ -700,7 +844,7 @@ function normalizeRenderInputs(options) {
     size
   );
   validateBoardColors(options.colors);
-  validateCoordinatesOption(options.coordinates);
+  validateCoordinatesOption(options.coordinates, borderSize);
   return {
     size,
     padding: normalizePadding(options.padding ?? DEFAULT_PADDING),
@@ -712,7 +856,7 @@ function normalizeRenderInputs(options) {
     }),
     highlightSquares: normalizeHighlights(options.highlightSquares ?? []),
     colors: normalizeColors(options.colors),
-    coordinates: normalizeCoordinates(options.coordinates)
+    coordinates: normalizeCoordinates(options.coordinates, borderSize)
   };
 }