From 66bf5cf966ecabc4e1d1a20ca63661395f18ff09 Mon Sep 17 00:00:00 2001
From: Lyubo Marinov <lmarinov@atlassian.com>
Date: Tue, 17 Apr 2018 17:35:48 -0500
Subject: [PATCH] [RN] Avoid "pinch to zoom" onPress

It's too sensitive and most of the time I cannot perform an onPress. In
contrast, the builtin/default/standard onPress is noticeably more
forgiving. While we fix the sensitivity of "pinch to zoom", don't use
its onPress unless absolutely necessary i.e. use it only for desktop
streams.
---
 .../base/media/components/native/Video.js     | 44 ++++++++++++++-----
 1 file changed, 33 insertions(+), 11 deletions(-)

diff --git a/react/features/base/media/components/native/Video.js b/react/features/base/media/components/native/Video.js
index b1215cd50..2907df200 100644
--- a/react/features/base/media/components/native/Video.js
+++ b/react/features/base/media/components/native/Video.js
@@ -4,6 +4,8 @@ import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import { RTCView } from 'react-native-webrtc';
 
+import { Pressable } from '../../../react';
+
 import styles from './styles';
 import VideoTransform from './VideoTransform';
 
@@ -81,29 +83,49 @@ export default class Video extends Component<*> {
      * @returns {ReactElement|null}
      */
     render() {
-        const { stream, zoomEnabled } = this.props;
+        const { onPress, stream, zoomEnabled } = this.props;
 
         if (stream) {
-            const streamURL = stream.toURL();
+            // RTCView
             const style = styles.video;
             const objectFit
                 = zoomEnabled
                     ? 'contain'
                     : (style && style.objectFit) || 'cover';
-
-            return (
-                <VideoTransform
-                    enabled = { zoomEnabled }
-                    onPress = { this.props.onPress }
-                    streamId = { stream.id }
-                    style = { style }>
+            const rtcView
+                = ( // eslint-disable-line no-extra-parens
                     <RTCView
                         mirror = { this.props.mirror }
                         objectFit = { objectFit }
-                        streamURL = { streamURL }
+                        streamURL = { stream.toURL() }
                         style = { style }
                         zOrder = { this.props.zOrder } />
-                </VideoTransform>
+                );
+
+            // VideoTransform implements "pinch to zoom". As part of "pinch to
+            // zoom", it implements onPress, of course.
+            if (zoomEnabled) {
+                return (
+                    <VideoTransform
+                        enabled = { zoomEnabled }
+                        onPress = { onPress }
+                        streamId = { stream.id }
+                        style = { style }>
+                        { rtcView }
+                    </VideoTransform>
+                );
+            }
+
+            // XXX Unfortunately, VideoTransform implements a custom press
+            // detection which has been observed to be very picky about the
+            // precision of the press unlike the builtin/default/standard press
+            // detection which is forgiving to imperceptible movements while
+            // pressing. It's not acceptable to be so picky, especially when
+            // "pinch to zoom" is not enabled.
+            return (
+                <Pressable onPress = { onPress }>
+                    { rtcView }
+                </Pressable>
             );
         }