Quellcode durchsuchen

Fix corner resize for multi-point arrows (#1105)

The logic to support it was not implemented. This is not the prettiest way to solve it in the world but it does work. Some more refactoring here is probably warranted.

Fixes #1039
Christopher Chedeau vor 5 Jahren
Ursprung
Commit
8e6d55cf75
2 geänderte Dateien mit 59 neuen und 23 gelöschten Zeilen
  1. 59 16
      src/components/App.tsx
  2. 0 7
      src/element/handlerRectangles.ts

+ 59 - 16
src/components/App.tsx

@@ -1964,15 +1964,26 @@ export class App extends React.Component<any, AppState> {
                 }
                 resizeArrowFn(element, 1, deltaX, deltaY, x, y, event.shiftKey);
               } else {
+                const width = element.width - deltaX;
+                const height = event.shiftKey
+                  ? element.width
+                  : element.height - deltaY;
                 mutateElement(element, {
                   x: element.x + deltaX,
                   y: event.shiftKey
                     ? element.y + element.height - element.width
                     : element.y + deltaY,
-                  width: element.width - deltaX,
-                  height: event.shiftKey
-                    ? element.width
-                    : element.height - deltaY,
+                  width,
+                  height,
+                  ...(isLinearElement(element) && width >= 0 && height >= 0
+                    ? {
+                        points: rescalePoints(
+                          0,
+                          width,
+                          rescalePoints(1, height, element.points),
+                        ),
+                      }
+                    : {}),
                 });
               }
               break;
@@ -1988,13 +1999,23 @@ export class App extends React.Component<any, AppState> {
                 }
                 resizeArrowFn(element, 1, deltaX, deltaY, x, y, event.shiftKey);
               } else {
-                const nextWidth = element.width + deltaX;
+                const width = element.width + deltaX;
+                const height = event.shiftKey ? width : element.height - deltaY;
                 mutateElement(element, {
                   y: event.shiftKey
-                    ? element.y + element.height - nextWidth
+                    ? element.y + element.height - width
                     : element.y + deltaY,
-                  width: nextWidth,
-                  height: event.shiftKey ? nextWidth : element.height - deltaY,
+                  width,
+                  height,
+                  ...(isLinearElement(element) && width >= 0 && height >= 0
+                    ? {
+                        points: rescalePoints(
+                          0,
+                          width,
+                          rescalePoints(1, height, element.points),
+                        ),
+                      }
+                    : {}),
                 });
               }
               break;
@@ -2010,12 +2031,23 @@ export class App extends React.Component<any, AppState> {
                 }
                 resizeArrowFn(element, 1, deltaX, deltaY, x, y, event.shiftKey);
               } else {
+                const width = element.width - deltaX;
+                const height = event.shiftKey
+                  ? element.width
+                  : element.height + deltaY;
                 mutateElement(element, {
                   x: element.x + deltaX,
-                  width: element.width - deltaX,
-                  height: event.shiftKey
-                    ? element.width
-                    : element.height + deltaY,
+                  width,
+                  height,
+                  ...(isLinearElement(element) && width >= 0 && height >= 0
+                    ? {
+                        points: rescalePoints(
+                          0,
+                          width,
+                          rescalePoints(1, height, element.points),
+                        ),
+                      }
+                    : {}),
                 });
               }
               break;
@@ -2031,11 +2063,22 @@ export class App extends React.Component<any, AppState> {
                 }
                 resizeArrowFn(element, 1, deltaX, deltaY, x, y, event.shiftKey);
               } else {
+                const width = element.width + deltaX;
+                const height = event.shiftKey
+                  ? element.width
+                  : element.height + deltaY;
                 mutateElement(element, {
-                  width: element.width + deltaX,
-                  height: event.shiftKey
-                    ? element.width
-                    : element.height + deltaY,
+                  width,
+                  height,
+                  ...(isLinearElement(element) && width >= 0 && height >= 0
+                    ? {
+                        points: rescalePoints(
+                          0,
+                          width,
+                          rescalePoints(1, height, element.points),
+                        ),
+                      }
+                    : {}),
                 });
               }
               break;

+ 0 - 7
src/element/handlerRectangles.ts

@@ -131,13 +131,6 @@ export function handlerRectangles(
         } as typeof handlers;
       }
     }
-
-    return {
-      n: handlers.n,
-      s: handlers.s,
-      w: handlers.w,
-      e: handlers.e,
-    } as typeof handlers;
   }
 
   return handlers;