sambruk/excalidraw
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

simplify by replacing draggingElementPointIndex with isDragging (#1982)

Browse Source 
* simplify by replacing draggingElementPointIndex with isDragging

* add tsdoc
This commit is contained in:
David Luzar 2020-07-30 12:58:06 +02:00 committed by GitHub
parent 20500b7822
commit c171fb4c7f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/App.tsx
View File

@ -1876,7 +1876,7 @@ class App extends React.Component<ExcalidrawProps, AppState> {
if ( if (
this.state.editingLinearElement && this.state.editingLinearElement &&
this.state.editingLinearElement.draggingElementPointIndex === null !this.state.editingLinearElement.isDragging
) { ) {
const editingLinearElement = LinearElementEditor.handlePointerMove( const editingLinearElement = LinearElementEditor.handlePointerMove(
event, event,

49
src/element/linearElementEditor.ts
View File

@ -17,7 +17,8 @@ export class LinearElementEditor {
_brand: "excalidrawLinearElementId"; _brand: "excalidrawLinearElementId";
}; };
public activePointIndex: number | null; public activePointIndex: number | null;
public draggingElementPointIndex: number | null; /** whether you're dragging a point */
public isDragging: boolean;
public lastUncommittedPoint: Point | null; public lastUncommittedPoint: Point | null;
constructor(element: NonDeleted<ExcalidrawLinearElement>, scene: Scene) { constructor(element: NonDeleted<ExcalidrawLinearElement>, scene: Scene) {
@ -29,7 +30,7 @@ export class LinearElementEditor {
this.activePointIndex = null; this.activePointIndex = null;
this.lastUncommittedPoint = null; this.lastUncommittedPoint = null;
this.draggingElementPointIndex = null; this.isDragging = false;
} }
// --------------------------------------------------------------------------- // ---------------------------------------------------------------------------
@ -63,38 +64,22 @@ export class LinearElementEditor {
return false; return false;
} }
const { editingLinearElement } = appState; const { editingLinearElement } = appState;
let { draggingElementPointIndex, elementId } = editingLinearElement; const { activePointIndex, elementId, isDragging } = editingLinearElement;
const element = LinearElementEditor.getElement(elementId); const element = LinearElementEditor.getElement(elementId);
if (!element) { if (!element) {
return false; return false;
} }
const clickedPointIndex = if (activePointIndex != null && activePointIndex > -1) {
draggingElementPointIndex ?? if (isDragging === false) {
LinearElementEditor.getPointIndexUnderCursor(
element,
appState.zoom,
scenePointerX,
scenePointerY,
);
draggingElementPointIndex = draggingElementPointIndex ?? clickedPointIndex;
if (draggingElementPointIndex > -1) {
if (
editingLinearElement.draggingElementPointIndex !==
draggingElementPointIndex ||
editingLinearElement.activePointIndex !== clickedPointIndex
) {
setState({ setState({
editingLinearElement: { editingLinearElement: {
...editingLinearElement, ...editingLinearElement,
draggingElementPointIndex, isDragging: true,
activePointIndex: clickedPointIndex,
}, },
}); });
} }
const [deltaX, deltaY] = rotate( const [deltaX, deltaY] = rotate(
scenePointerX - lastX, scenePointerX - lastX,
scenePointerY - lastY, scenePointerY - lastY,
@ -102,8 +87,8 @@ export class LinearElementEditor {
0, 0,
-element.angle, -element.angle,
); );
const targetPoint = element.points[clickedPointIndex]; const targetPoint = element.points[activePointIndex];
LinearElementEditor.movePoint(element, clickedPointIndex, [ LinearElementEditor.movePoint(element, activePointIndex, [
targetPoint[0] + deltaX, targetPoint[0] + deltaX,
targetPoint[1] + deltaY, targetPoint[1] + deltaY,
]); ]);
@ -115,30 +100,30 @@ export class LinearElementEditor {
static handlePointerUp( static handlePointerUp(
editingLinearElement: LinearElementEditor, editingLinearElement: LinearElementEditor,
): LinearElementEditor { ): LinearElementEditor {
const { elementId, draggingElementPointIndex } = editingLinearElement; const { elementId, activePointIndex, isDragging } = editingLinearElement;
const element = LinearElementEditor.getElement(elementId); const element = LinearElementEditor.getElement(elementId);
if (!element) { if (!element) {
return editingLinearElement; return editingLinearElement;
} }
if ( if (
draggingElementPointIndex !== null && isDragging &&
(draggingElementPointIndex === 0 || (activePointIndex === 0 ||
draggingElementPointIndex === element.points.length - 1) && activePointIndex === element.points.length - 1) &&
isPathALoop(element.points) isPathALoop(element.points)
) { ) {
LinearElementEditor.movePoint( LinearElementEditor.movePoint(
element, element,
draggingElementPointIndex, activePointIndex,
draggingElementPointIndex === 0 activePointIndex === 0
? element.points[element.points.length - 1] ? element.points[element.points.length - 1]
: element.points[0], : element.points[0],
); );
} }
if (draggingElementPointIndex !== null) { if (isDragging) {
return { return {
...editingLinearElement, ...editingLinearElement,
draggingElementPointIndex: null, isDragging: false,
}; };
} }
return editingLinearElement; return editingLinearElement;