github.com/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-02-18 13:29:36 +01:00
Code Releases Wiki Activity

pan canvas on wheel button drag (#375)

Browse Source 
* pan canvas on wheel button drag

* make mousemove passive
This commit is contained in:
David Luzar 2020-01-16 00:21:39 +01:00 committed by Christopher Chedeau
parent 80cee4d3c0
commit 0e56cd4f56
1 changed files with 28 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/index.tsx
View File

@ -627,6 +627,34 @@ export class App extends React.Component<{}, AppState> {
// being in a weird state, we clean up on the next mousedown
lastMouseUp(e);
}
// pan canvas on wheel button drag
if (e.button === 1) {
let { clientX: lastX, clientY: lastY } = e;
const onMouseMove = (e: MouseEvent) => {
document.documentElement.style.cursor = `grabbing`;
let deltaX = lastX - e.clientX;
let deltaY = lastY - e.clientY;
lastX = e.clientX;
lastY = e.clientY;
this.setState(state => ({
scrollX: state.scrollX - deltaX,
scrollY: state.scrollY - deltaY
}));
};
const onMouseUp = (lastMouseUp = (e: MouseEvent) => {
lastMouseUp = null;
resetCursor();
window.removeEventListener("mousemove", onMouseMove);
window.removeEventListener("mouseup", onMouseUp);
});
window.addEventListener("mousemove", onMouseMove, {
passive: true
});
window.addEventListener("mouseup", onMouseUp);
return;
}
// only handle left mouse button
if (e.button !== 0) return;
// fixes mousemove causing selection of UI texts #32