Function onResizeMove

app.js:4397–4449

(e)

  });

  function onResizeMove(e) {
    if (!isResizing) return;
    const elLock = elements.find((el) => el.id === elementId);
    if (!elLock || elLock.locked || elLock.hidden) return;
    const scale = parseFloat(preview.dataset.scale || "1");
    const z = clamp(zoomFactor || 1, 0.5, 3);
    const effectiveScale = scale * z;
    const dx = (e.clientX - startX) / effectiveScale;
    const dy = (e.clientY - startY) / effectiveScale;

    const el = elements.find((el) => el.id === elementId);
    if (!el) return;

    let newWidth = startWidth;
    let newHeight = startHeight;
    let newX = startXPos;
    let newY = startYPos;

    
    if (direction.includes("e")) {
      newWidth = Math.max(10, startWidth + dx);
    }
    if (direction.includes("w")) {
      newWidth = Math.max(10, startWidth - dx);
      newX = startXPos + dx;
    }
    if (direction.includes("s")) {
      newHeight = Math.max(10, startHeight + dy);
    }
    if (direction.includes("n")) {
      newHeight = Math.max(10, startHeight - dy);
      newY = startYPos + dy;
    }

    
    if (snapToGrid && gridSize > 0 && !e.ctrlKey && !e.metaKey) {
      newWidth = Math.round(newWidth / gridSize) * gridSize;
      newHeight = Math.round(newHeight / gridSize) * gridSize;
      newX = Math.round(newX / gridSize) * gridSize;
      newY = Math.round(newY / gridSize) * gridSize;
    }

    el.w = Math.round(newWidth);
    el.h = Math.round(newHeight);
    el.x = Math.round(newX);
    el.y = Math.round(newY);

    updatePropsInputs(false);
    renderElements();
    renderLayers();
    updateCode();
    updateDistanceHintsForDrag(elementId, el.x, el.y, el.w, el.h);
  }

  function onResizeUp() {
    if (isResizing) {