import { Pos } from "@/utils/math.ts";
import { themeMouseColors } from "@/constant/help-style.ts";
import { BaseItem, generateSnapInfos, getBaseItem } from "../util.ts";
import { getMouseColors } from "@/utils/colors.ts";
import { InteractiveFix, InteractiveTo } from "../index.ts";

export { default as Component } from "./line.vue";
export { default as TempComponent } from "./temp-line.vue";

export const shapeName = "线段";
export const defaultStyle = {
  stroke: themeMouseColors.theme,
  strokeWidth: 5,
  dash: [30, 0],
};

export const addMode = "dots";

export const getMouseStyle = (data: LineData) => {
  const strokeStatus = getMouseColors(data.stroke || defaultStyle.stroke);
  const strokeWidth = data.strokeWidth || defaultStyle.strokeWidth;

  return {
    default: { stroke: strokeStatus.pub, strokeWidth },
    hover: { stroke: strokeStatus.hover },
    select: { stroke: strokeStatus.select },
    press: { stroke: strokeStatus.press },
  };
};

export const getSnapInfos = (data: LineData) =>
  generateSnapInfos(getSnapPoints(data), true, true, true);

export const getSnapPoints = (data: LineData) => {
  return data.points;
};

export type LineData = Partial<typeof defaultStyle> &
  BaseItem & {
    points: Pos[];
    attitude: number[];
  };

export const interactiveToData: InteractiveTo<"line"> = ({
  info,
  preset = {},
  ...args
}) => {
  if (info.cur) {
    return interactiveFixData({
      ...args,
      info,
      data: {
        ...getBaseItem(),
        ...preset,
        points: [],
        attitude: [1, 0, 0, 1, 0, 0],
      },
    });
  }
};

export const interactiveFixData: InteractiveFix<"line"> = ({ data, info }) => {
  data.points = [...info.consumed, info.cur!];
  return data;
};