@100mslive/react-native-room-kit 0.0.3 → 0.1.0

package/lib/commonjs/components/MiniView.js

@@ -0,0 +1,163 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MiniView = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _reactRedux = require("react-redux");
+var _reactNative = require("react-native");
+var _reactNativeGestureHandler = require("react-native-gesture-handler");
+var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
+var _PeerVideoTileView = require("./PeerVideoTile/PeerVideoTileView");
+var _PeerMinimizedView = require("./PeerMinimizedView");
+var _actions = require("../redux/actions");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+const cornerOffset = {
+  x: 8,
+  y: 16
+};
+const MiniView = _ref => {
+  let {
+    boundingBoxRef,
+    onMoreOptionsPress
+  } = _ref;
+  const isPressed = (0, _reactNativeReanimated.useSharedValue)(false);
+  const xOffset = (0, _reactNativeReanimated.useSharedValue)(0);
+  const yOffset = (0, _reactNativeReanimated.useSharedValue)(0);
+  const start = (0, _reactNativeReanimated.useSharedValue)({
+    x: 0,
+    y: 0
+  });
+  const dispatch = (0, _reactRedux.useDispatch)();
+  const minimized = (0, _reactRedux.useSelector)(state => state.app.insetViewMinimized);
+  const miniviewPeerTrackNode = (0, _reactRedux.useSelector)(state => state.app.miniviewPeerTrackNode);
+  const {
+    height: minimizedViewHeigth,
+    width: minimizedViewWidth
+  } = (0, _PeerMinimizedView.usePeerMinimizedViewDimensions)();
+  const size = {
+    width: minimized ? minimizedViewWidth : 104,
+    height: minimized ? minimizedViewHeigth : 186
+  };
+  const dimensionStyles = {
+    width: size.width,
+    height: size.height
+  };
+  const animatedStyles = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
+    return {
+      transform: [{
+        translateX: xOffset.value
+      }, {
+        translateY: yOffset.value
+      }, {
+        scale: (0, _reactNativeReanimated.withSpring)(isPressed.value ? 1.05 : 1)
+      }]
+    };
+  }, []);
+  const handlePanGestureEnd = e => {
+    'worklet';
+
+    const {
+      snapPointX,
+      snapPointY
+    } = getSnappingPoints(xOffset.value, yOffset.value, size.width, size.height, cornerOffset.x, cornerOffset.y, boundingBoxRef.current);
+    const finalX = snapPointX;
+    const finalY = snapPointY;
+    xOffset.value = (0, _reactNativeReanimated.withSpring)(finalX, {
+      damping: 100,
+      stiffness: 100,
+      velocity: e.velocityX
+    });
+    yOffset.value = (0, _reactNativeReanimated.withSpring)(finalY, {
+      damping: 100,
+      stiffness: 100,
+      velocity: e.velocityY
+    });
+    start.value = {
+      x: finalX,
+      y: finalY
+    };
+  };
+  const panGesture = _reactNativeGestureHandler.Gesture.Pan().onUpdate(e => {
+    xOffset.value = e.translationX + start.value.x;
+    yOffset.value = e.translationY + start.value.y;
+  }).onEnd(handlePanGestureEnd);
+  const longPressGesture = _reactNativeGestureHandler.Gesture.LongPress().minDuration(800).maxDistance(1000).onBegin(() => {
+    isPressed.value = true;
+  }).onFinalize(() => {
+    isPressed.value = false;
+  });
+  React.useEffect(() => {
+    handlePanGestureEnd({
+      velocityX: 0,
+      velocityY: 0
+    });
+    return () => {
+      (0, _reactNativeReanimated.cancelAnimation)(xOffset);
+      (0, _reactNativeReanimated.cancelAnimation)(yOffset);
+    };
+  }, [minimized]);
+  const handleMaximize = () => {
+    _reactNative.LayoutAnimation.configureNext(_reactNative.LayoutAnimation.Presets.easeInEaseOut);
+    dispatch((0, _actions.setInsetViewMinimized)(false));
+  };
+  if (!miniviewPeerTrackNode) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(_reactNativeGestureHandler.GestureDetector, {
+    gesture: _reactNativeGestureHandler.Gesture.Simultaneous(panGesture, longPressGesture)
+  }, /*#__PURE__*/React.createElement(_reactNativeReanimated.default.View, {
+    style: [styles.miniAnimatedView, dimensionStyles, animatedStyles]
+  }, /*#__PURE__*/React.createElement(_reactNative.View, {
+    style: styles.contentContainer
+  }, minimized ? /*#__PURE__*/React.createElement(_PeerMinimizedView.PeerMinimizedView, {
+    peerTrackNode: miniviewPeerTrackNode,
+    onMaximizePress: handleMaximize
+  }) : /*#__PURE__*/React.createElement(_PeerVideoTileView.PeerVideoTileView, {
+    peerTrackNode: miniviewPeerTrackNode,
+    insetMode: true,
+    onMoreOptionsPress: onMoreOptionsPress
+  }))));
+};
+exports.MiniView = MiniView;
+const styles = _reactNative.StyleSheet.create({
+  miniAnimatedView: {
+    position: 'absolute',
+    bottom: cornerOffset.y,
+    right: cornerOffset.x,
+    zIndex: 1,
+    elevation: 3,
+    shadowOffset: {
+      height: 3,
+      width: 2
+    },
+    shadowOpacity: 0.3,
+    shadowRadius: 4
+  },
+  contentContainer: {
+    flex: 1,
+    overflow: 'hidden',
+    borderRadius: 8
+  }
+});
+const getSnappingPoints = (currentValueX, currentValueY, compWidth, compHeight, xCornerOffset, yCornerOffset, boundingBox) => {
+  'worklet';
+
+  if (!boundingBox) {
+    return {
+      snapPointX: 0,
+      snapPointY: 0
+    };
+  }
+  const {
+    height,
+    width
+  } = boundingBox;
+  return {
+    snapPointX: Math.abs(currentValueX) + compWidth < width / 2 ? 0 : -width + compWidth + xCornerOffset * 2,
+    snapPointY: Math.abs(currentValueY) + compHeight < height / 2 ? 0 : -height + compHeight + yCornerOffset * 2
+  };
+};
+//# sourceMappingURL=MiniView.js.map

package/lib/commonjs/components/MiniView.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","_interopRequireWildcard","require","_reactRedux","_reactNative","_reactNativeGestureHandler","_reactNativeReanimated","_PeerVideoTileView","_PeerMinimizedView","_actions","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","cornerOffset","x","y","MiniView","_ref","boundingBoxRef","onMoreOptionsPress","isPressed","useSharedValue","xOffset","yOffset","start","dispatch","useDispatch","minimized","useSelector","state","app","insetViewMinimized","miniviewPeerTrackNode","height","minimizedViewHeigth","width","minimizedViewWidth","usePeerMinimizedViewDimensions","size","dimensionStyles","animatedStyles","useAnimatedStyle","transform","translateX","value","translateY","scale","withSpring","handlePanGestureEnd","e","snapPointX","snapPointY","getSnappingPoints","current","finalX","finalY","damping","stiffness","velocity","velocityX","velocityY","panGesture","Gesture","Pan","onUpdate","translationX","translationY","onEnd","longPressGesture","LongPress","minDuration","maxDistance","onBegin","onFinalize","useEffect","cancelAnimation","handleMaximize","LayoutAnimation","configureNext","Presets","easeInEaseOut","setInsetViewMinimized","createElement","GestureDetector","gesture","Simultaneous","View","style","styles","miniAnimatedView","contentContainer","PeerMinimizedView","peerTrackNode","onMaximizePress","PeerVideoTileView","insetMode","exports","StyleSheet","create","position","bottom","right","zIndex","elevation","shadowOffset","shadowOpacity","shadowRadius","flex","overflow","borderRadius","currentValueX","currentValueY","compWidth","compHeight","xCornerOffset","yCornerOffset","boundingBox","Math","abs"],"sourceRoot":"../../../src","sources":["components/MiniView.tsx"],"mappings":"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"}