Aislo/B06_Section/B06_Section_UI_Cross_Design_Surface.ts

import type { CrossDesign } from "./B06_Section_Api_Fetch";

const SVG_NS = "http://www.w3.org/2000/svg";

export function appendRockBoundaryOverlay(
  svg: SVGElement,
  samples: Array<{ offset_m?: number; elevation_m?: number | null; valid: boolean }>,
  offsetM: number,
  x: (offset: number) => number,
  y: (elevation: number) => number,
): void {
  const segments: string[][] = [];
  let current: string[] = [];
  for (const sample of samples) {
    const elevation = sample.elevation_m;
    if (sample.valid === false || elevation === null || !Number.isFinite(elevation ?? NaN)) {
      if (current.length > 1) segments.push(current);
      current = [];
      continue;
    }
    current.push(`${x(sample.offset_m ?? 0)},${y((elevation as number) + offsetM)}`);
  }
  if (current.length > 1) segments.push(current);
  for (const points of segments) {
    const polyline = document.createElementNS(SVG_NS, "polyline");
    polyline.setAttribute("points", points.join(" "));
    polyline.setAttribute("class", "b06-chart__rock-boundary");
    svg.append(polyline);
  }
}

export function appendPavementOverlay(
  svg: SVGElement,
  design: CrossDesign,
  x: (offset: number) => number,
  y: (elevation: number) => number,
): void {
  const edges = design.carriageway_edges ?? design.road_edges;
  if (!design.paved || !edges) return;
  const thickness = design.pavement_thickness_m ?? 0.2;
  const { left, right } = edges;
  const polygon = document.createElementNS(SVG_NS, "polygon");
  polygon.setAttribute(
    "points",
    [
      `${x(left.offset_m)},${y(left.elevation_m)}`,
      `${x(right.offset_m)},${y(right.elevation_m)}`,
      `${x(right.offset_m)},${y(right.elevation_m - thickness)}`,
      `${x(left.offset_m)},${y(left.elevation_m - thickness)}`,
    ].join(" "),
  );
  polygon.setAttribute("class", "b06-chart__pavement");
  svg.append(polygon);
}