Add PiP move threshold

Author: weeman1337

src/components/structures/PictureInPictureDragger.tsx

@@ -70,6 +70,8 @@ export default class PictureInPictureDragger extends React.Component<IProps> {
         () => this.animationCallback(),
         () => requestAnimationFrame(() => this.scheduledUpdate.trigger()),
     );
+    private startingPositionX = 0;
+    private startingPositionY = 0;
 
     private _moving = false;
     public get moving(): boolean {
@@ -192,11 +194,19 @@ export default class PictureInPictureDragger extends React.Component<IProps> {
         event.stopPropagation();
 
         this.mouseHeld = true;
+        this.startingPositionX = event.pageX;
+        this.startingPositionY = event.pageY;
     };
 
     private onMoving = (event: MouseEvent): void => {
         if (!this.mouseHeld) return;
 
+        if (Math.abs(this.startingPositionX - event.pageX) < 5 && Math.abs(this.startingPositionY - event.pageY) < 5) {
+            // User needs to move the widget by at least five pixels.
+            // Improves click detection when using a touchpad or with nervous hands.
+            return;
+        }
+
         event.preventDefault();
         event.stopPropagation();