import { cubicBezierCommand, Pt } from "./bezier";

export function frame2preview(pts: Pt[][], width: number, height: number, px2mm = 0.1) {
    return `<svg viewbox="0 0 ${width} ${height}" width=360 height=220>
        <rect x=0 y=0 width=${width} height=${height} fill="#8001" stroke="#f008"></rect>
        <path d="${pts2command(pts)}" fill="#0001" stroke="#0008">
        </path>
      </svg><span>${ (width * px2mm).toFixed(1)}mm x ${(height * px2mm).toFixed(1)}mm</span>`;
}

function pts2command(pts: Pt[][]){
  return pts.map(
    path => {
      const pts = path.map(pt=> `${pt[0]} ${pt[1]}`).join(' L ');
      return `M ${pts} Z`;
    }
  ).join(' ');
}