github/motion-canvas
1
1
Fork 0
mirror of https://github.com/motion-canvas/motion-canvas.git synced 2026-01-11 14:57:56 -05:00
Code Issues Packages Projects Releases Wiki Activity

feat: pan with shift and left click (#7)

Browse Source 
Add another way to pan the view for trackpad users.

Closes #5
This commit is contained in:
Lucas Simon
2022-06-15 12:42:40 -07:00
committed by GitHub
parent 9d01aafdbf
commit 4ff82419bd
2 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/viewport/View.tsx
View File

@@ -52,7 +52,7 @@ export function View() {
[setState, state],
),
undefined,
1,
null,
);
useEffect(() => {
@@ -131,7 +131,7 @@ export function View() {
className={styles.viewport}
ref={containerRef}
onMouseDown={event => {
if (event.button === 0) {
if (event.button === 0 && !event.shiftKey) {
const position = {
x: event.x - size.x,
y: event.y - size.y,

4
src/hooks/useDrag.ts
View File

@@ -12,7 +12,7 @@ interface DropCallback {
export function useDrag(
onMove: MoveCallback,
onDrop?: DropCallback,
button = 0,
button: number | null = 0,
): [(event: MouseEvent) => void, boolean] {
const [isDragging, setDragging] = useState(false);
const [startPosition, setStartPosition] = useState({x: 0, y: 0});
@@ -51,7 +51,7 @@ export function useDrag(
const handleDrag = useCallback(
(event: MouseEvent) => {
if (event.button !== button) return;
if (button !== null && event.button !== button) return;
event.preventDefault();
event.stopPropagation();
setStartPosition({x: event.x, y: event.y});