export namespace Draw {
  export function particle(
      ctx: CanvasRenderingContext2D, 
      x: number, y: number, 
      radius: number, 
      fill: string, 
      stroke = "lightblue"
    ) {
    ctx.beginPath();
    ctx.arc(x, y, radius, 0, Math.PI * 2);
    ctx.fillStyle = fill;
    ctx.fill();
    ctx.strokeStyle = stroke;
    ctx.lineWidth = 1;
    ctx.stroke();
  }

  export function crosshair(
    ctx: CanvasRenderingContext2D, 
    x: number, y: number, 
    size: number, 
    color: string, 
  ) {
    const circleRadius = size * 0.5;

    ctx.strokeStyle = color;
    ctx.lineWidth = 2; // Fixed thickness

    // The Cross
    ctx.beginPath();
    // Horizontal line
    ctx.moveTo(x - size, y); 
    ctx.lineTo(x + size, y);
    // Vertical line
    ctx.moveTo(x, y - size); 
    ctx.lineTo(x, y + size);
    ctx.stroke();

    // The Circle
    ctx.beginPath();
    ctx.arc(x, y, circleRadius, 0, Math.PI * 2);
    ctx.stroke();
  }
}