import {DrawPile} from "./drawpile.ts";
import {AlignX, AlignY, Point, Rect, Size} from "./engine/datatypes.ts";
import {BG_INSET, FG_BOLD, FG_TEXT} from "./colors.ts";
import {D} from "./engine/public.ts";

export function addButton(
  drawpile: DrawPile,
  label: string,
  rect: Rect,
  enabled: boolean,
  cbClick: () => void,
) {
  let padding = 2;
  let topLeft = rect.top;
  let topLeftPadded = topLeft.offset(new Point(padding, padding));
  let sizePadded = new Size(rect.size.w - padding * 2, rect.size.h - padding * 2);
  let center = topLeft.offset(new Point(rect.size.w / 2, rect.size.h / 2));

  drawpile.addClickable(
    0,
    (hover) => {
      let [bg, fg, fgLabel] = [BG_INSET, FG_TEXT, FG_BOLD];
      if (hover) {
        [bg, fg, fgLabel] = [FG_BOLD, BG_INSET, BG_INSET];
      }
      D.fillRect(
        topLeftPadded.offset(new Point(-1, -1)),
        sizePadded.add(new Size(2, 2)),
        bg
      );
      D.drawRect(topLeftPadded, sizePadded, fg);
      D.drawText(label, center, fgLabel, {
        alignX: AlignX.Center,
        alignY: AlignY.Middle,
      })
    },
    new Rect(topLeftPadded, sizePadded),
    enabled,
    cbClick
  );
}