queenshow/src/modules/editor/controllers/TransferCtrl/transforms/transform.ts

import { TransCreateFn, TransferCtrl } from "..";

function getTransform(this: TransferCtrl, transType: string) {
  const { transEvent } = this;
  const { transform = {} } = this.currComp?.layout;
  const offset = {
    x: transform.x || 0,
    y: transform.y || 0,
    r: transform.r || 0,
    s: transform.s || 1,
  };
  switch (transType) {
    case "move":
      offset.x += transEvent.offsetX * 2;
      offset.y += transEvent.offsetY * 2;
      break;
    case "rotate":
      offset.r = (offset.r + transEvent.offsetX * -1) % 360;
      break;
    case "scale":
      offset.s = +(
        offset.s *
        (1 + (transEvent.offsetX * 2) / transEvent.width)
      ).toFixed(2);
  }

  return offset;
}

const transform: TransCreateFn = (transType: string) => ({
  mousemove() {
    const style = this.module.helper.createStyle({
      transform: getTransform.call(this, transType),
    });
    Object.entries(style).forEach(([key, value]: any[]) => {
      this.compEl.style[key] = value;
    });
  },
  mouseup() {
    this.module.actions.setCompTransform(
      this.currComp,
      getTransform.call(this, transType)
    );
  },
});

export const move = transform.bind(null, "move");
export const rotate = transform.bind(null, "rotate");
export const scale = transform.bind(null, "scale");