export const getTransformHandles = (
  element,
) => {
  return getTransformHandlesFromCoords(element);
};


export const getTransformHandlesFromCoords = (element) => {
  let { width, height, left, top } = element.rect
  
  const ratio = window.devicePixelRatio
  width = width * ratio
  height = height * ratio
  left = left * ratio
  top = top * ratio
  const lineWidth = element.lineWidth * 1
  const size = 6;
  const handleWidth = size;
  const handleHeight = size;

  const handleMarginX = 1;
  const handleMarginY = 1;

  const dashedLineMargin = 3;

  const transformHandles = {
    nw: [left - handleMarginX - handleWidth - lineWidth, top - handleMarginY - handleHeight - lineWidth, handleWidth, handleHeight],
    ne: [left + width + handleMarginX + lineWidth, top - handleMarginY - handleHeight - lineWidth, handleWidth, handleHeight],
    sw: [left - handleMarginX - handleWidth - lineWidth, top + height - lineWidth * 2 + handleHeight + handleMarginY, handleWidth, handleHeight],
    se: [left + width + handleMarginX + lineWidth, top + height - lineWidth * 2 + handleHeight + handleMarginY, handleWidth, handleHeight],
    n: [left + (width - handleWidth) / 2, top - handleMarginY - handleHeight - lineWidth, handleWidth, handleHeight],
    s: [left + (width - handleWidth) / 2, top + height - lineWidth * 2 + handleHeight + handleMarginY, handleWidth, handleHeight],
    w: [left - handleMarginX - handleWidth - lineWidth, top + (height - handleHeight) / 2, handleWidth, handleHeight],
    e: [left + width + handleMarginX + lineWidth, top + (height - handleHeight) / 2, handleWidth, handleHeight],
  };

  return transformHandles;
}
