import { Pos } from "@/utils/math.ts";
import { flatPositions, onlyId } from "@/utils/shared.ts";
import { ArrowConfig } from "konva/lib/shapes/Arrow";
import { themeMouseColors } from "@/constant/help-style.ts";
import { BaseItem, generateSnapInfos, getBaseItem } from "../util.ts";
import { getMouseColors } from "@/utils/colors.ts";
import { AddMessage } from "@/core/hook/use-draw.ts";

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

export enum PointerPosition {
  start = 'start',
  end = 'end',
  all = 'all',
}
export const shapeName = "箭头";
export const defaultStyle = {
  fill: themeMouseColors.theme,
  pointerPosition: PointerPosition.end,
  strokeWidth: 2,
  pointerLength: 10,
};

export const addMode = "area";

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

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

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

export const dataToConfig = (data: ArrowData): ArrowConfig => ({
  ...defaultStyle,
  ...data,
  points: flatPositions(data.points),
  hitStrokeWidth: 20,
});

export const getSnapInfos = (data: ArrowData) => {
  return generateSnapInfos(getSnapPoints(data), true, false);
};

export const getSnapPoints = (data: ArrowData) => data.points

export const interactiveToData = (
  info: AddMessage<'arrow'>,
  preset: Partial<ArrowData> = {}
): ArrowData | undefined => {
  if (info.cur) {
    return interactiveFixData(
      {
        ...getBaseItem(),
        ...preset,
        id: onlyId(),
        points: [info.cur[0]],
        attitude: [1, 0, 0, 1, 0, 0],
      },
      info
    );
  }
};

export const interactiveFixData = (
  data: ArrowData,
  info: AddMessage<'arrow'>
) => {
  data.points[1] = info.cur![1];
  return data;
};
