Set the cursor to 'crosshair' when expected to draw (#142)

* Set the cursor to 'crosshair' when expected to draw

And reset it back to default on mouse up.

Fixes #102

* Also reset cursor on text selection

* Use 'text' cursor for text
This commit is contained in:
Lucas Azzola 2020-01-05 14:33:21 +11:00 committed by Christopher Chedeau
parent 85fe9f85fb
commit 30ccaf0152
1 changed files with 8 additions and 2 deletions

View File

@ -692,6 +692,10 @@ function clearSelection() {
});
}
function resetCursor() {
document.documentElement.style.cursor = "";
}
function deleteSelectedElements() {
for (let i = elements.length - 1; i >= 0; --i) {
if (elements[i].isSelected) {
@ -1042,6 +1046,8 @@ class App extends React.Component<{}, AppState> {
onChange={() => {
this.setState({ elementType: value });
clearSelection();
document.documentElement.style.cursor =
value === "text" ? "text" : "crosshair";
this.forceUpdate();
}}
/>
@ -1189,7 +1195,6 @@ class App extends React.Component<{}, AppState> {
let resizeHandle: string | false = false;
let isDraggingElements = false;
let isResizingElements = false;
const cursorStyle = document.documentElement.style.cursor;
if (this.state.elementType === "selection") {
const resizeElement = elements.find(element => {
return resizeTest(element, x, y, {
@ -1248,6 +1253,7 @@ class App extends React.Component<{}, AppState> {
}
if (isTextElement(element)) {
resetCursor();
const text = prompt("What text do you want?");
if (text === null) {
return;
@ -1410,7 +1416,7 @@ class App extends React.Component<{}, AppState> {
window.removeEventListener("mousemove", onMouseMove);
window.removeEventListener("mouseup", onMouseUp);
document.documentElement.style.cursor = cursorStyle;
resetCursor();
// if no element is clicked, clear the selection and redraw
if (draggingElement === null) {