Clear selection if no element is clicked
This commit is contained in:
parent
874934e585
commit
61bdedaecf
19
src/index.js
19
src/index.js
@ -327,6 +327,7 @@ class App extends React.Component {
|
|||||||
onMouseDown={e => {
|
onMouseDown={e => {
|
||||||
const x = e.clientX - e.target.offsetLeft;
|
const x = e.clientX - e.target.offsetLeft;
|
||||||
const y = e.clientY - e.target.offsetTop;
|
const y = e.clientY - e.target.offsetTop;
|
||||||
|
const element = newElement(this.state.elementType, x, y);
|
||||||
let isDraggingElements = false;
|
let isDraggingElements = false;
|
||||||
const cursorStyle = document.documentElement.style.cursor;
|
const cursorStyle = document.documentElement.style.cursor;
|
||||||
if (this.state.elementType === "selection") {
|
if (this.state.elementType === "selection") {
|
||||||
@ -341,8 +342,7 @@ class App extends React.Component {
|
|||||||
if (isDraggingElements) {
|
if (isDraggingElements) {
|
||||||
document.documentElement.style.cursor = "move";
|
document.documentElement.style.cursor = "move";
|
||||||
}
|
}
|
||||||
} else {
|
}
|
||||||
const element = newElement(this.state.elementType, x, y);
|
|
||||||
|
|
||||||
if (this.state.elementType === "text") {
|
if (this.state.elementType === "text") {
|
||||||
const text = prompt("What text do you want?");
|
const text = prompt("What text do you want?");
|
||||||
@ -376,7 +376,6 @@ class App extends React.Component {
|
|||||||
} else {
|
} else {
|
||||||
this.setState({ draggingElement: element });
|
this.setState({ draggingElement: element });
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
let lastX = x;
|
let lastX = x;
|
||||||
let lastY = y;
|
let lastY = y;
|
||||||
@ -417,22 +416,30 @@ class App extends React.Component {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const onMouseUp = e => {
|
const onMouseUp = e => {
|
||||||
|
const { draggingElement, elementType } = this.state
|
||||||
|
|
||||||
window.removeEventListener("mousemove", onMouseMove);
|
window.removeEventListener("mousemove", onMouseMove);
|
||||||
window.removeEventListener("mouseup", onMouseUp);
|
window.removeEventListener("mouseup", onMouseUp);
|
||||||
|
|
||||||
document.documentElement.style.cursor = cursorStyle;
|
document.documentElement.style.cursor = cursorStyle;
|
||||||
|
|
||||||
const draggingElement = this.state.draggingElement;
|
// if no element is clicked, clear the selection and redraw
|
||||||
if (draggingElement === null) {
|
if (draggingElement === null) {
|
||||||
return;
|
clearSelection()
|
||||||
|
drawScene();
|
||||||
|
return
|
||||||
}
|
}
|
||||||
if (this.state.elementType === "selection") {
|
|
||||||
|
if (elementType === "selection") {
|
||||||
if (isDraggingElements) {
|
if (isDraggingElements) {
|
||||||
isDraggingElements = false;
|
isDraggingElements = false;
|
||||||
}
|
}
|
||||||
|
elements.pop()
|
||||||
setSelection(draggingElement);
|
setSelection(draggingElement);
|
||||||
} else {
|
} else {
|
||||||
draggingElement.isSelected = true;
|
draggingElement.isSelected = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
this.setState({
|
this.setState({
|
||||||
draggingElement: null,
|
draggingElement: null,
|
||||||
elementType: "selection"
|
elementType: "selection"
|
||||||
|
Loading…
x
Reference in New Issue
Block a user