1
0
mirror of https://github.com/excalidraw/excalidraw.git synced 2024-11-10 11:35:52 +01:00

Shift drag to add to selection (#355)

* Shift drag to add to selection

* Inlined variable
This commit is contained in:
Timur Khazamov 2020-01-13 04:32:25 +05:00 committed by Christopher Chedeau
parent 4c62cbf57e
commit bc2bae2a9a
3 changed files with 24 additions and 14 deletions

@ -15,7 +15,7 @@ import {
import {
clearSelection,
deleteSelectedElements,
setSelection,
getElementsWithinSelection,
isOverScrollBars,
restoreFromLocalStorage,
saveToLocalStorage,
@ -510,11 +510,11 @@ export class App extends React.Component<{}, AppState> {
document.documentElement.style.cursor = `${resizeHandle}-resize`;
isResizingElements = true;
} else {
hitElement = getElementAtPosition(elements, x, y);
// clear selection if shift is not clicked
if (!e.shiftKey) {
if (!hitElement?.isSelected && !e.shiftKey) {
elements = clearSelection(elements);
}
hitElement = getElementAtPosition(elements, x, y);
// If we click on something
if (hitElement) {
@ -746,13 +746,23 @@ export class App extends React.Component<{}, AppState> {
this.state.scrollY;
draggingElement.width = width;
// Make a perfect square or circle when shift is enabled
draggingElement.height = e.shiftKey
draggingElement.height =
e.shiftKey && this.state.elementType !== "selection"
? Math.abs(width) * Math.sign(height)
: height;
draggingElement.shape = null;
if (this.state.elementType === "selection") {
elements = setSelection(elements, draggingElement);
if (!e.shiftKey) {
elements = clearSelection(elements);
}
const elementsWithinSelection = getElementsWithinSelection(
elements,
draggingElement
);
elementsWithinSelection.forEach(element => {
element.isSelected = true;
});
}
// We don't want to save history when moving an element
history.skipRecording();

@ -4,7 +4,7 @@ export {
getSelectedIndices,
deleteSelectedElements,
someElementIsSelected,
setSelection,
getElementsWithinSelection,
getSelectedAttribute
} from "./selection";
export {

@ -1,7 +1,7 @@
import { ExcalidrawElement } from "../element/types";
import { getElementAbsoluteCoords } from "../element";
export function setSelection(
export function getElementsWithinSelection(
elements: readonly ExcalidrawElement[],
selection: ExcalidrawElement
) {
@ -11,22 +11,22 @@ export function setSelection(
selectionX2,
selectionY2
] = getElementAbsoluteCoords(selection);
elements.forEach(element => {
return elements.filter(element => {
const [
elementX1,
elementY1,
elementX2,
elementY2
] = getElementAbsoluteCoords(element);
element.isSelected =
return (
element.type !== "selection" &&
selectionX1 <= elementX1 &&
selectionY1 <= elementY1 &&
selectionX2 >= elementX2 &&
selectionY2 >= elementY2;
selectionY2 >= elementY2
);
});
return elements;
}
export function clearSelection(elements: readonly ExcalidrawElement[]) {