import { getRegionDelta, Point } from "@noya-app/noya-geometry";
import { DEFAULT_MOVEMENT_THRESHOLD, isMoving } from "../utils/isMoving";
import { getMovingOptionsForEvent, MovingOptions } from "../utils/movingUtils";
import { createCanvasPlugin } from "./baseCanvas";
import {
  BaseContextProperties,
  ElementProperties,
  MovableProperties,
} from "./contextProperties";
import { modeSwitch, NoneMode } from "./PluginSystem";
import { PointerData } from "./pointerPlugin";

export type MoveMode<StateSnapshot> =
  | NoneMode
  | { type: "moving"; delta: Point; snapshot: StateSnapshot };

export type MoveData = {
  zoom: number;
  selectedElementIds: string[];
} & Pick<PointerData, "pointerDown">;

export type MoveElementParameters<StateSnapshot> = {
  elementIds: string[];
  delta: Point;
  snapshot: StateSnapshot;
  options: MovingOptions;
};

export type DuplicateElementsResult<StateSnapshot> = Pick<
  MoveElementParameters<StateSnapshot>,
  "elementIds" | "snapshot"
>;

export interface MoveContextProperties<CanvasElement, StateSnapshot>
  extends BaseContextProperties<MoveMode<StateSnapshot>, MoveData>,
    ElementProperties<CanvasElement>,
    MovableProperties<CanvasElement> {
  adjustMoveDelta?: (
    event: React.PointerEvent,
    options: MoveElementParameters<StateSnapshot>
  ) => Point;
  finalizeMove?: (options: MoveElementParameters<StateSnapshot>) => void;
  duplicateElements?: (
    event: React.PointerEvent,
    options: MoveElementParameters<StateSnapshot>
  ) => DuplicateElementsResult<StateSnapshot> | undefined;
  getStateSnapshot: () => StateSnapshot;
  moveElements: (parameters: MoveElementParameters<StateSnapshot>) => void;
}

export type MovePluginOptions = {
  movementThreshold?: number;
};

export function movePlugin<CanvasElement, StateSnapshot>(
  options: MovePluginOptions = {}
) {
  const { movementThreshold = DEFAULT_MOVEMENT_THRESHOLD } = options;

  return createCanvasPlugin({
    name: "move",
    data: {
      zoom: 1,
      selectedElementIds: [],
    },
    handlers: ({
      getMode,
      setMode,
      getData,
      setData,
      adjustMoveDelta = (_, options) => options.delta,
      ...context
    }: MoveContextProperties<CanvasElement, StateSnapshot>) => ({
      onPointerMove(event) {
        modeSwitch(getMode(), {
          none: () => {
            const data = getData();

            if (!data.pointerDown) return;

            const elements = context.filterElements({
              at: data.pointerDown.anchor,
              predicate: context.isMovable,
            });

            if (
              elements.length > 0 &&
              isMoving(
                data.pointerDown.anchor,
                data.pointerDown.head,
                data.zoom,
                movementThreshold
              )
            ) {
              const snapshot = context.getStateSnapshot();

              const baseParameters: MoveElementParameters<StateSnapshot> = {
                elementIds: data.selectedElementIds,
                delta: getRegionDelta(data.pointerDown),
                snapshot,
                options: getMovingOptionsForEvent(event),
              };

              const duplicated = event.altKey
                ? context.duplicateElements?.(event, baseParameters)
                : undefined;

              const parameters = duplicated
                ? { ...baseParameters, ...duplicated }
                : baseParameters;

              if (duplicated) {
                setData((data) => ({
                  ...data,
                  selectedElementIds: duplicated.elementIds,
                }));
              }

              const delta = adjustMoveDelta(event, parameters);

              setMode({
                type: "moving",
                delta,
                snapshot: parameters.snapshot,
              });

              event.preventDefault();
            }
          },
          moving: ({ snapshot }) => {
            const data = getData();

            if (!data.pointerDown) return;

            const parameters: MoveElementParameters<StateSnapshot> = {
              elementIds: data.selectedElementIds,
              delta: getRegionDelta(data.pointerDown),
              snapshot,
              options: getMovingOptionsForEvent(event),
            };

            const delta = adjustMoveDelta(event, parameters);

            setMode({ type: "moving", delta, snapshot });

            context.moveElements?.({ ...parameters, delta });

            event.preventDefault();
          },
        });
      },
      onPointerUp(event) {
        const mode = getMode();

        if (mode.type !== "moving") return;

        const data = getData();

        const parameters: MoveElementParameters<StateSnapshot> = {
          elementIds: data.selectedElementIds,
          delta: mode.delta,
          snapshot: mode.snapshot,
          options: getMovingOptionsForEvent(event),
        };

        context.finalizeMove?.(parameters);

        setMode({ type: "none" });

        event.preventDefault();
      },
    }),
  });
}