Command clicking should "xor" selection (#300)
* Command clicking should "xor" selection * Only shift key should play a role * Get rid of `isDraggingElements` * Renamed someElementIsDragged to draggingOccured
This commit is contained in:
parent
3eb6d1de68
commit
c253c0b635
@ -20,7 +20,6 @@ import {
|
|||||||
deleteSelectedElements,
|
deleteSelectedElements,
|
||||||
setSelection,
|
setSelection,
|
||||||
isOverScrollBars,
|
isOverScrollBars,
|
||||||
someElementIsSelected,
|
|
||||||
restoreFromLocalStorage,
|
restoreFromLocalStorage,
|
||||||
saveToLocalStorage,
|
saveToLocalStorage,
|
||||||
getElementAtPosition,
|
getElementAtPosition,
|
||||||
@ -542,8 +541,10 @@ export class App extends React.Component<{}, AppState> {
|
|||||||
);
|
);
|
||||||
type ResizeTestType = ReturnType<typeof resizeTest>;
|
type ResizeTestType = ReturnType<typeof resizeTest>;
|
||||||
let resizeHandle: ResizeTestType = false;
|
let resizeHandle: ResizeTestType = false;
|
||||||
let isDraggingElements = false;
|
|
||||||
let isResizingElements = false;
|
let isResizingElements = false;
|
||||||
|
let draggingOccured = false;
|
||||||
|
let hitElement: ExcalidrawElement | null = null;
|
||||||
|
let elementIsAddedToSelection = false;
|
||||||
if (this.state.elementType === "selection") {
|
if (this.state.elementType === "selection") {
|
||||||
const resizeElement = getElementWithResizeHandler(
|
const resizeElement = getElementWithResizeHandler(
|
||||||
elements,
|
elements,
|
||||||
@ -569,7 +570,7 @@ export class App extends React.Component<{}, AppState> {
|
|||||||
if (!selected && !e.shiftKey) {
|
if (!selected && !e.shiftKey) {
|
||||||
elements = clearSelection(elements);
|
elements = clearSelection(elements);
|
||||||
}
|
}
|
||||||
const hitElement = getElementAtPosition(elements, x, y);
|
hitElement = getElementAtPosition(elements, x, y);
|
||||||
|
|
||||||
// If we click on something
|
// If we click on something
|
||||||
if (hitElement) {
|
if (hitElement) {
|
||||||
@ -577,7 +578,10 @@ export class App extends React.Component<{}, AppState> {
|
|||||||
// if shift is not clicked, this will always return true
|
// if shift is not clicked, this will always return true
|
||||||
// otherwise, it will trigger selection based on current
|
// otherwise, it will trigger selection based on current
|
||||||
// state of the box
|
// state of the box
|
||||||
|
if (!hitElement.isSelected) {
|
||||||
hitElement.isSelected = true;
|
hitElement.isSelected = true;
|
||||||
|
elementIsAddedToSelection = true;
|
||||||
|
}
|
||||||
|
|
||||||
// No matter what, we select it
|
// No matter what, we select it
|
||||||
// We duplicate the selected element if alt is pressed on Mouse down
|
// We duplicate the selected element if alt is pressed on Mouse down
|
||||||
@ -596,13 +600,9 @@ export class App extends React.Component<{}, AppState> {
|
|||||||
];
|
];
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
isDraggingElements = someElementIsSelected(elements);
|
|
||||||
|
|
||||||
if (isDraggingElements) {
|
|
||||||
document.documentElement.style.cursor = "move";
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
} else {
|
||||||
|
elements = clearSelection(elements);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (isTextElement(element)) {
|
if (isTextElement(element)) {
|
||||||
@ -754,7 +754,10 @@ export class App extends React.Component<{}, AppState> {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (isDraggingElements) {
|
if (hitElement?.isSelected) {
|
||||||
|
// Marking that click was used for dragging to check
|
||||||
|
// if elements should be deselected on mouseup
|
||||||
|
draggingOccured = true;
|
||||||
const selectedElements = elements.filter(el => el.isSelected);
|
const selectedElements = elements.filter(el => el.isSelected);
|
||||||
if (selectedElements.length) {
|
if (selectedElements.length) {
|
||||||
const { x, y } = viewportCoordsToSceneCoords(e, this.state);
|
const { x, y } = viewportCoordsToSceneCoords(e, this.state);
|
||||||
@ -809,17 +812,35 @@ export class App extends React.Component<{}, AppState> {
|
|||||||
|
|
||||||
resetCursor();
|
resetCursor();
|
||||||
|
|
||||||
// if no element is clicked, clear the selection and redraw
|
// If click occured on already selected element
|
||||||
|
// it is needed to remove selection from other elements
|
||||||
|
// or if SHIFT or META key pressed remove selection
|
||||||
|
// from hitted element
|
||||||
|
//
|
||||||
|
// If click occured and elements were dragged or some element
|
||||||
|
// was added to selection (on mousedown phase) we need to keep
|
||||||
|
// selection unchanged
|
||||||
|
if (
|
||||||
|
hitElement &&
|
||||||
|
!draggingOccured &&
|
||||||
|
!elementIsAddedToSelection
|
||||||
|
) {
|
||||||
|
if (e.shiftKey) {
|
||||||
|
hitElement.isSelected = false;
|
||||||
|
} else {
|
||||||
|
elements = clearSelection(elements);
|
||||||
|
hitElement.isSelected = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
if (draggingElement === null) {
|
if (draggingElement === null) {
|
||||||
|
// if no element is clicked, clear the selection and redraw
|
||||||
elements = clearSelection(elements);
|
elements = clearSelection(elements);
|
||||||
this.forceUpdate();
|
this.forceUpdate();
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (elementType === "selection") {
|
if (elementType === "selection") {
|
||||||
if (isDraggingElements) {
|
|
||||||
isDraggingElements = false;
|
|
||||||
}
|
|
||||||
elements = elements.slice(0, -1);
|
elements = elements.slice(0, -1);
|
||||||
} else {
|
} else {
|
||||||
draggingElement.isSelected = true;
|
draggingElement.isSelected = true;
|
||||||
|
Loading…
x
Reference in New Issue
Block a user