/**
 * Background: grid (faint reference grid).
 *
 * Data-heavy uses this. Thin horizontal + vertical lines at the theme's
 * configured `spacing` interval, drawn in `subtle` colour with high
 * transparency so they never compete with content.
 *
 * Reads as "this deck takes itself seriously about numbers."
 */
import { SLIDE_DIMENSIONS } from '../grid.js';

export default function applyGrid(slide, resolved) {
  slide.background = { color: resolved.palette.bg };

  const spacing = resolved.decoration?.grid?.spacing || 0.5;
  const opacity = resolved.decoration?.grid?.lineOpacity || 8; // 0–100, lower = fainter
  const lineColor = resolved.palette.subtle;
  const transparency = 100 - opacity;

  // Horizontal lines.
  for (let y = spacing; y < SLIDE_DIMENSIONS.height; y += spacing) {
    slide.addShape('line', {
      x: 0, y, w: SLIDE_DIMENSIONS.width, h: 0,
      line: { color: lineColor, width: 0.5, transparency },
    });
  }

  // Vertical lines.
  for (let x = spacing; x < SLIDE_DIMENSIONS.width; x += spacing) {
    slide.addShape('line', {
      x, y: 0, w: 0, h: SLIDE_DIMENSIONS.height,
      line: { color: lineColor, width: 0.5, transparency },
    });
  }
}
