🐛 修复一次点击节点总是触发吸附对齐的问题

Author: Littlefean

app/src/core/render/canvas2d/renderer.tsx

@@ -761,7 +761,6 @@ export namespace Renderer {
       `鼠标上次松开位置: ${Controller.lastMouseReleaseLocationString()}`,
       `lastMousePressLocation Right: ${Controller.lastMousePressLocation[2].toString()}`,
       `框选框: ${Stage.selectMachine.selectingRectangle}`,
-      `正在移动节点: ${Controller.isMovingEntity}`,
       `正在切割: ${Stage.cuttingMachine.isUsing}`,
       `Stage.warningNodes: ${Stage.cuttingMachine.warningEntity.length}`,
       `Stage.warningEdges: ${Stage.cuttingMachine.warningEdges.length}`,

app/src/core/service/controlService/controller/Controller.tsx

@@ -12,9 +12,9 @@ import { ControllerEntityCreate } from "./concrete/ControllerEntityCreate";
 import { ControllerLayerMoving } from "./concrete/ControllerEntityLayerMoving";
 import { ControllerImageScale } from "./concrete/ControllerImageScale";
 // import { ControllerKeyboardOnly } from "./concrete/ControllerKeyboardOnly";
+import { ControllerEntityClickSelectAndMove } from "./concrete/ControllerEntityClickSelectAndMove";
 import { ControllerNodeConnection } from "./concrete/ControllerNodeConnection";
 import { ControllerNodeEdit } from "./concrete/ControllerNodeEdit";
-import { ControllerEntityMove } from "./concrete/ControllerEntityMove";
 import { ControllerNodeRotation } from "./concrete/ControllerNodeRotation";
 import { ControllerRectangleSelect } from "./concrete/ControllerRectangleSelect";
 import { ControllerSectionEdit } from "./concrete/ControllerSectionEdit";
@@ -64,11 +64,6 @@ export namespace Controller {
   export function lastMouseReleaseLocationString(): string {
     return lastMouseReleaseLocation.map((v) => v.toString()).join(",");
   }
-  /**
-   * 是否正在进行移动节点的操作
-   */
-  // eslint-disable-next-line prefer-const
-  export let isMovingEntity = false;
   /**
    * 是否正在进行移动(拖拽旋转)连线的操作
    */
@@ -131,7 +126,7 @@ export namespace Controller {
     ControllerNodeRotation.init();
     ControllerNodeConnection.init();
     ControllerCutting.init();
-    ControllerEntityMove.init();
+    ControllerEntityClickSelectAndMove.init();
     ControllerRectangleSelect.init();
     ControllerNodeEdit.init();
     ControllerEntityCreate.init();
@@ -293,7 +288,7 @@ export namespace Controller {
     ControllerNodeRotation.destroy();
     ControllerNodeConnection.destroy();
     ControllerCutting.destroy();
-    ControllerEntityMove.destroy();
+    ControllerEntityClickSelectAndMove.destroy();
     ControllerRectangleSelect.destroy();
     ControllerNodeEdit.destroy();
     ControllerEntityCreate.destroy();

app/src/core/service/controlService/controller/concrete/ControllerEntityMove.tsx renamed to app/src/core/service/controlService/controller/concrete/ControllerEntityClickSelectAndMove.tsx

@@ -12,15 +12,19 @@ import { ControllerClass } from "../ControllerClass";
  * 拖拽节点使其移动的控制器
  *
  */
-export const ControllerEntityMove = new ControllerClass();
+export const ControllerEntityClickSelectAndMove = new ControllerClass();
 
-ControllerEntityMove.mousedown = (event: MouseEvent) => {
+let isMovingEntity = false;
+let mouseDownViewLocation = Vector.getZero();
+
+ControllerEntityClickSelectAndMove.mousedown = (event: MouseEvent) => {
   if (event.button !== 0) {
     return;
   }
+  mouseDownViewLocation = new Vector(event.clientX, event.clientY);
 
-  const pressWorldLocation = Renderer.transformView2World(new Vector(event.clientX, event.clientY));
-  ControllerEntityMove.lastMoveLocation = pressWorldLocation.clone();
+  const pressWorldLocation = Renderer.transformView2World(mouseDownViewLocation);
+  ControllerEntityClickSelectAndMove.lastMoveLocation = pressWorldLocation.clone();
   const clickedEntity = StageManager.findConnectableEntityByLocation(pressWorldLocation);
 
   // 防止跳跃式移动的时候改变选中内容
@@ -30,7 +34,7 @@ ControllerEntityMove.mousedown = (event: MouseEvent) => {
 
   // 单击选中
   if (clickedEntity !== null) {
-    Controller.isMovingEntity = true;
+    isMovingEntity = true;
 
     if (Controller.pressingKeySet.has("shift") && Controller.pressingKeySet.has("control")) {
       // ctrl + shift 同时按下
@@ -72,19 +76,19 @@ ControllerEntityMove.mousedown = (event: MouseEvent) => {
   }
 };
 
-ControllerEntityMove.mousemove = (event: MouseEvent) => {
+ControllerEntityClickSelectAndMove.mousemove = (event: MouseEvent) => {
   if (Stage.selectMachine.isUsing || Stage.cuttingMachine.isUsing || Controller.pressingKeySet.has("alt")) {
     return;
   }
-  if (!Controller.isMovingEntity) {
+  if (!isMovingEntity) {
     return;
   }
   const worldLocation = Renderer.transformView2World(new Vector(event.clientX, event.clientY));
-  const diffLocation = worldLocation.subtract(ControllerEntityMove.lastMoveLocation);
+  const diffLocation = worldLocation.subtract(ControllerEntityClickSelectAndMove.lastMoveLocation);
 
   if (StageManager.isHaveEntitySelected()) {
     // 移动节点
-    Controller.isMovingEntity = true;
+    isMovingEntity = true;
     // 暂不监听alt键。因为windows下切换窗口时，alt键释放监听不到
     if (Controller.pressingKeySet.has("control")) {
       // 和子节点一起移动
@@ -104,21 +108,28 @@ ControllerEntityMove.mousemove = (event: MouseEvent) => {
       StageManager.preAlignAllSelected();
     }
 
-    ControllerEntityMove.lastMoveLocation = worldLocation.clone();
+    ControllerEntityClickSelectAndMove.lastMoveLocation = worldLocation.clone();
   }
 };
 
-ControllerEntityMove.mouseup = (event: MouseEvent) => {
+ControllerEntityClickSelectAndMove.mouseup = (event: MouseEvent) => {
   if (event.button !== 0) {
     return;
   }
-  if (Controller.isMovingEntity) {
-    // 这个时候可以触发对齐吸附事件
-    if (Stage.enableDragAutoAlign) {
-      StageManager.alignAllSelected();
-    }
 
-    StageManager.moveEntityFinished();
+  const mouseUpViewLocation = new Vector(event.clientX, event.clientY);
+  const diffLocation = mouseUpViewLocation.subtract(mouseDownViewLocation);
+  if (diffLocation.magnitude() > 5) {
+    // 判定为有效吸附的拖拽操作
+    if (isMovingEntity) {
+      // 这个时候可以触发对齐吸附事件
+      if (Stage.enableDragAutoAlign) {
+        StageManager.alignAllSelected();
+      }
+
+      StageManager.moveEntityFinished();
+    }
   }
-  Controller.isMovingEntity = false;
+
+  isMovingEntity = false;
 };

app/src/core/service/controlService/controller/concrete/ControllerRectangleSelect.tsx

@@ -186,7 +186,7 @@ class ControllerRectangleSelectClass extends ControllerClass {
     }
     selectedEntityNormalizing();
 
-    Controller.isMovingEntity = false;
+    // Controller.isMovingEntity = false;
     Controller.isMovingEdge = false;
     ControllerRectangleSelect.lastMoveLocation = worldLocation.clone();
   };