geometry.js

/**
 * Compute the overlapping dimensions of two rectangles.
 * Along the moving axis, the size becomes the overlap.
 * Along the other axis, the size remains constrained.
 *
 * @returns { width, height } or null if there is no overlap
 */
const computeOverlapSize = (
  movingAxis,
  topRectangleSize,
  belowRectangleSize,
  topRectanglePosition,
  belowRectanglePosition
) => {
  const constrainedWidth = Math.min(topRectangleSize.width, belowRectangleSize.width);
  const constrainedHeight = Math.min(topRectangleSize.height, belowRectangleSize.height);

  const sizeAlongAxis =
    movingAxis === "x" ? constrainedWidth : constrainedHeight;
  const gap = Math.abs(topRectanglePosition - belowRectanglePosition);
  const overlap = Math.max(0, sizeAlongAxis - gap);

  const width = movingAxis === "x" ? Math.round(overlap) : constrainedWidth;
  const height = movingAxis === "y" ? Math.round(overlap) : constrainedHeight;

  if (width <= 0 || height <= 0) {
    return null;
  }

  return { width, height };
};

/**
 * Compute the center of the overlap along the moving axis.
 * The perpendicular coordinate is preserved.
 *
 * @returns { ox, oy } overlap center
 */
const computeOverlapCenter = (
  movingAxis,
  topRectangleSize,
  belowRectangleSize,
  topRectanglePosition,
  belowRectanglePosition,
  belowPerpPosition
) => {
  const topAxisSize =
    movingAxis === "x" ? topRectangleSize.width : topRectangleSize.height;
  const belowAxisSize =
    movingAxis === "x" ? belowRectangleSize.width : belowRectangleSize.height;

  const topStart = topRectanglePosition - topAxisSize / 2;
  const topEnd = topRectanglePosition + topAxisSize / 2;
  const belowStart = belowRectanglePosition - belowAxisSize / 2;
  const belowEnd = belowRectanglePosition + belowAxisSize / 2;

  const overlapStart = Math.max(topStart, belowStart);
  const overlapEnd = Math.min(topEnd, belowEnd);
  const center = Math.round((overlapStart + overlapEnd) / 2);
  const perpOffset = Math.round(belowPerpPosition);

  return {
    ox: movingAxis === "x" ? center : perpOffset,
    oy: movingAxis === "y" ? center : perpOffset,
  };
};

/**
 * Returns the size along the given axis.
 */
const axisLength = (axis, size) => {
  return axis === "x" ? size.width : size.height;
};

/**
 * If topRectanglePosition is within snapPercent of belowRectanglePosition on the moving axis,
 * snap the result to match the below block exactly.
 *
 * @returns { size: Size, origin: Point, snapped: boolean }
 */
const snapOverlapIfClose = ({
  axis,
  topRectanglePosition,
  belowRectanglePosition,
  belowRectangleSize,
  belowRectangleOrigin,
  overlapSize,
  overlapOrigin,
  snapPercentage,
}) => {
  const delta = topRectanglePosition - belowRectanglePosition;
  const threshold = axisLength(axis, belowRectangleSize) * snapPercentage;

  if (Math.abs(delta) <= threshold) {
    return {
      size: belowRectangleSize,
      origin: belowRectangleOrigin,
      snapped: true,
    };
  }

  return {
    size: overlapSize,
    origin: overlapOrigin,
    snapped: false,
  };
}