Browse Source

fix(whiteboard): disable user select on whiteboard pages on iOS

Peng Xiao 3 years ago
parent
commit
ecf5495edc

+ 10 - 0
src/main/frontend/components/whiteboard.css

@@ -212,3 +212,13 @@ input.tl-text-input {
     right: 0;
   }
 }
+
+/* disable user select globally for whiteboard on iOS/iPad. Is there a better option? */
+html:is(.is-ios, is-native-ios, is-native-ipad) [data-page="whiteboard"] * {
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -khtml-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}

+ 0 - 5
tldraw/apps/tldraw-logseq/src/styles.css

@@ -25,11 +25,6 @@
   --shadow-large: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
 
   backface-visibility: hidden;
-
-  * {
-    -webkit-touch-callout: none;
-    -webkit-user-drag: none;
-  }
 }
 
 .dark-theme,

+ 3 - 0
tldraw/packages/react/src/hooks/useGestureEvents.ts

@@ -74,6 +74,9 @@ export function useGestureEvents(ref: React.RefObject<HTMLDivElement>) {
       const elm = ref.current
       if (event instanceof WheelEvent) return
       if (!(event.target === elm || elm?.contains(event.target as Node))) return
+      if (!rOriginPoint.current) {
+        rOriginPoint.current = origin
+      }
       const delta = Vec.sub(rOriginPoint.current, origin)
       const trueDelta = Vec.sub(delta, rDelta.current)
       callbacks.onPinch?.(

+ 0 - 1
tldraw/packages/react/src/hooks/useSetup.ts

@@ -54,7 +54,6 @@ export function useSetup<
     if (onPaste) unsubs.push(app.subscribe('paste', onPaste))
     if (onCanvasDBClick) unsubs.push(app.subscribe('canvas-dbclick', onCanvasDBClick))
     // Kind of unusual, is this the right pattern?
-
     return () => unsubs.forEach(unsub => unsub())
   }, [app, onPersist, onSave, onSaveAs, onError])
 }