// Metro module 10554 (f10555).
import * as Module19 from "react";
import { useState, useRef, useCallback, useMemo, useLayoutEffect } from "react";
import { ScrollView, StyleSheet, View } from "react-native";
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
import { useSurfaceDirectRendererExperiment } from "../SurfaceDirectRendererExperiment";
import useVideoSpinnerTimer from "../../useVideoSpinnerTimer";
import useVideoReadyTimeout from "../../../errors/hooks/useVideoReadyTimeout";
import { getWindowDimensions } from "../../../screen/useWindowDimensions.native";
import { isAndroid } from "../../../../utils/PlatformUtils";
import { useStore, OrientationType } from "../../../device/native/DeviceOrientation";
import MessageLoadingSpinner from "../../../../components_native/common/MessageLoadingSpinner";
import ZoomLayout_android from "../../../zoom_layout/ZoomLayout.android";
import DCDVideoRenderer from "./DCDVideoRenderer";
import ReanimatedRexport from "../../../reanimated/ReanimatedRexport";
const useStyles = createStyles({
  spinner: {
    height: 32,
    width: 32
  },
  center: {
    alignItems: "center",
    justifyContent: "center"
  },
  zoomLayoutAndroid: {
    flex: 1
  }
});
let c7091_11 = {
  COVER: 0,
  0: "COVER",
  CONTAIN: 1,
  1: "CONTAIN",
  AUTO: 2,
  2: "AUTO"
};
const r43 = Module19.memo(function(a0) {
  const { streamId, resizeMode = c7091_11.CONTAIN } = a0;
  let memo;
  const CONTAIN = resizeMode;
  const { gestureEnabled = false, renderTag, videoSpinnerContext, userId, streamKey, paused = false } = a0;
  memo = void 0;
  const styles = useStyles();
  const surfaceDirectRendererExperiment = useSurfaceDirectRendererExperiment(userId, {
    location: "VideoRenderer"
  });
  const [state, setState] = useState(0);
  const [state2, setState2] = useState(0);
  const [state3, setState3] = useState(0);
  const [state4, setState4] = useState(0);
  const [loading, setState5] = useState(true);
  useVideoSpinnerTimer({
    location: "VideoRenderer",
    videoSpinnerContext,
    userId,
    streamId,
    paused,
    loading
  });
  const onReady = useVideoReadyTimeout({
    streamId,
    userId,
    videoSpinnerContext,
    paused,
    loading,
    streamKey
  }).onReady;
  const ref = useRef(null);
  const ref2 = useRef(null);
  const ref3 = useRef({
    width: 0,
    height: 0
  });
  const callback2 = useCallback(({ nativeEvent }) => {
    const { width: width2, height: height2 } = nativeEvent;
    const windowDimensions = getWindowDimensions();
    const r27 = Math.min(Math.sqrt(windowDimensions.width * windowDimensions.height * 4 / (width2 * height2)), 1);
    setState3(width2 * r27);
    setState4(height2 * r27);
  }, [setState3, setState4]);
  const callback3 = useCallback(() => {
    setState5(false);
    onReady();
  }, [onReady]);
  const callback4 = useCallback((a0) => {
    const layout = a0.nativeEvent.layout;
    const { width: width2, height: height2 } = layout;
    setState(width2);
    setState2(height2);
    ref3.current = {
      width: width2,
      height: height2
    };
  }, []);
  const callback = useCallback((a0) => {
    const layout = a0.nativeEvent.layout;
    const { width, height } = layout;
    if (!(isAndroid() || ref.current == null)) {
      const current = ref.current;
      if (!(width <= 0 || height <= 0)) {
        current.scrollResponderZoomTo({
          x: 0,
          y: 0,
          width,
          height,
          animated: false
        });
        current.scrollTo({
          x: 0,
          y: 0,
          animated: false
        });
      }
      requestAnimationFrame(() => {
        if (ref.current != null) {
          const current = ref.current;
          if (!(width <= 0 || height <= 0)) {
            current.scrollResponderZoomTo({
              x: 0,
              y: 0,
              width,
              height,
              animated: false
            });
            current.scrollTo({
              x: 0,
              y: 0,
              animated: false
            });
          }
        }
      });
    }
  }, []);
  memo = useMemo(() => {
    if (state !== 0 && state2 !== 0 && state3 !== 0 && state4 !== 0) {
      let r10 = CONTAIN;
      const r8 = state / state2;
      const r7 = state3 / state4;
      if (CONTAIN === c7091_11.AUTO) {
        r10 = !(r8 > 1 && r7 > 1) && !(r8 < 1 && r7 < 1) ? c7091_11.CONTAIN : c7091_11.COVER;
      }
      return r10 === c7091_11.CONTAIN ? r8 > r7 ? state2 / state4 : state / state3 : r10 === c7091_11.COVER ? r7 > r8 ? state2 / state4 : state / state3 : 0;
    }
    return 0;
  }, [state, state2, state3, state4, CONTAIN]);
  const store = useStore((a0) => a0.orientation);
  useLayoutEffect(() => {
    if (isAndroid() && ref2.current != null) {
      const current = ref2.current;
      if (current != null) {
        current.unzoom({
          animated: false
        });
      }
    }
  }, [state, state2, state3, state4, memo]);
  useLayoutEffect(() => {
    if (!isAndroid() && ref.current != null && state3 > 0 && state4 > 0) {
      const current = ref3.current;
      const { width: width2, height: height2 } = current;
      const current2 = ref.current;
      if (!(width2 <= 0 || height2 <= 0)) {
        current2.scrollResponderZoomTo({
          x: 0,
          y: 0,
          width: width2,
          height: height2,
          animated: false
        });
        current2.scrollTo({
          x: 0,
          y: 0,
          animated: false
        });
      }
    }
  }, [state3, state4]);
  const memo2 = useMemo(() => ({
    width: state3 * memo,
    height: state4 * memo
  }), [memo, state3, state4]);
  const memo3 = useMemo(() => ({
    width: state3 * memo,
    height: state4 * memo
  }), [memo, state3, state4]);
  const memo4 = useMemo(() => {
    const width2 = Math.min(state3 * memo, state);
    const height2 = Math.min(state4 * memo, state2);
    return {
      position: "absolute",
      left: (state - width2) / 2,
      top: (state2 - height2) / 2,
      width: width2,
      height: height2,
      alignItems: "center",
      justifyContent: "center",
      overflow: "hidden"
    };
  }, [state3, memo, state, state4, state2]);
  const memo5 = useMemo(() => ({
    width: state,
    height: state2
  }), [state, state2]);
  const memo6 = useMemo(() => ({
    position: "absolute",
    top: state2 / 2 - Math.min(state4 * memo, state2) / 2,
    right: state / 2 - Math.min(state3 * memo, state) / 2
  }), [state3, memo, state, state4, state2]);
  const r127 = loading ? <MessageLoadingSpinner animate style={styles.spinner} /> : null;
  const r5 = store === OrientationType.PORTRAIT;
  return isAndroid() ? <View onLayout={callback4} style={[styles.center, StyleSheet.absoluteFillObject]}>
    <ZoomLayout_android ref={ref2} style={styles.zoomLayoutAndroid} minimumZoomScale={1} gestureEnabled={gestureEnabled}>
      <View collapsable={false} style={{
        width: state,
        height: state2,
        alignItems: "center",
        justifyContent: "center"
      }}>
        <DCDVideoRenderer useSurfaceDirectRenderer={surfaceDirectRendererExperiment} streamId={streamId} onSize={callback2} onReady={callback3} style={memo3} />
        {r127}
      </View>
    </ZoomLayout_android>
    <View style={memo6}>
      {loading ? null : gestureEnabled ? r5 ? renderTag == null ? void 0 : renderTag() : null : null}
    </View>
  </View> : gestureEnabled ? <ScrollView ref={ref} onLayout={callback4} style={StyleSheet.absoluteFillObject} contentContainerStyle={memo5} bounces={false} pinchGestureEnabled={!loading} maximumZoomScale={8} minimumZoomScale={1} showsVerticalScrollIndicator={false} showsHorizontalScrollIndicator={false} scrollEventThrottle={16}>
    <View collapsable={false} style={memo5} onLayout={callback}>
      <View style={memo4}>
        <ReanimatedRexport.View>
          <DCDVideoRenderer useSurfaceDirectRenderer={surfaceDirectRendererExperiment} streamId={streamId} onSize={callback2} onReady={callback3} style={memo2} />
        </ReanimatedRexport.View>
        {r5 ? renderTag == null ? void 0 : renderTag() : null}
      </View>
      {r127 != null ? <View style={[StyleSheet.absoluteFillObject, styles.center]}>{r127}</View> : null}
    </View>
  </ScrollView> : <View onLayout={callback4} style={[styles.center, StyleSheet.absoluteFillObject]}>
    <DCDVideoRenderer useSurfaceDirectRenderer={surfaceDirectRendererExperiment} streamId={streamId} onSize={callback2} onReady={callback3} style={memo2} />
    {r127}
  </View>;
});
export default r43;
export { c7091_11 as ResizeMode };