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

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

Browse Source 
* 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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/index.tsx
View File

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