203 lines
10 KiB
TypeScript
203 lines
10 KiB
TypeScript
// Metro module 15736 (f15737).
|
|
import _slicedToArray from "../../../../_bundle/_slicedToArray";
|
|
import * as Module19 from "react";
|
|
import { useCallback, useMemo, useState } from "react";
|
|
import { StyleSheet, TouchableOpacity, View } from "react-native";
|
|
import EmbeddedActivitiesStore from "../../../activities/EmbeddedActivitiesStore";
|
|
import ChannelRTCStore from "../../../calls/ChannelRTCStore";
|
|
import { useBestActiveChatInputContainerHeight } from "../../../chat_input/native/useChatBottomManagerUIStore";
|
|
import AuthenticationStore from "../../../../stores/AuthenticationStore";
|
|
import MediaEngineStore from "../../../../stores/MediaEngineStore";
|
|
import { PictureInPicturePositions } from "../../../../Constants";
|
|
import { ParticipantTypes } from "../../../calls/CallConstants";
|
|
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
|
|
import * as _native from "../../../../design/void/native";
|
|
import { generateBoxShadowStyle, EIGHT_DP_ELEVATION_SHADOW_PARAMS, AvatarSizes } from "../../../../design/void/native";
|
|
import Module712 from "../../../../_bundle/Module712";
|
|
import usePipVideoOrStream from "../usePipVideoOrStream";
|
|
import { useStateFromStores } from "../../../../_bundle/Module589";
|
|
import { getEmbeddedActivityParticipantId } from "../../../calls/ChannelRTCParticipants";
|
|
import useIsActivityFocused from "../../../activities/useIsActivityFocused";
|
|
import { openGuildVoiceModal } from "../../../../utils/native/PrivateChannelCallUtils";
|
|
import { useShouldForcePipOrientation } from "./useShouldForcePipOrientation";
|
|
import { useIsScreenLandscape } from "../../../screen/useIsScreenLandscape.native";
|
|
import usePipDimensions from "./usePipDimensions";
|
|
import { OrientationType } from "../../../device/native/DeviceOrientation";
|
|
import isWatchTogetherApplication from "../../../activities/utils/isWatchTogetherApplication";
|
|
import StreamTile from "./StreamTile";
|
|
import { ResizeMode } from "./VideoRenderer";
|
|
import UserTile from "./UserTile";
|
|
import ActivityTile from "./ActivityTile";
|
|
import transitionToActivity_native from "../../../activities/utils/transitionToActivity.native";
|
|
import ScreenshareTile from "./ScreenshareTile";
|
|
import PictureInPicture from "./PictureInPicture";
|
|
import { useIsChannelFocused } from "../../../panels/isChannelFocused.native";
|
|
import * as _ReanimatedRexport from "../../../reanimated/ReanimatedRexport";
|
|
import ReanimatedRexport, { useDerivedValue, useAnimatedStyle } from "../../../reanimated/ReanimatedRexport";
|
|
import * as _timing from "../../../../design/animation/reanimated/timing/timing";
|
|
import * as _NavigatorConstants_native from "../../../../design/components/Navigator/native/NavigatorConstants.native";
|
|
import * as _getPIPBottomOffsetForPIPMode from "../../../panels/morphable/native/getPIPBottomOffsetForPIPMode";
|
|
import useSafeAreaInsets_native from "../../../safe_area/useSafeAreaInsets.native";
|
|
let Component2, __initData, __initData2;
|
|
const PADDING = 12;
|
|
const useStyles = createStyles({
|
|
container: {
|
|
flex: 1,
|
|
marginLeft: 12,
|
|
marginRight: 12
|
|
},
|
|
elevationShadow: generateBoxShadowStyle(EIGHT_DP_ELEVATION_SHADOW_PARAMS),
|
|
pip: {
|
|
borderRadius: Module712.radii.sm,
|
|
overflow: "hidden"
|
|
},
|
|
background: {
|
|
backgroundColor: Module712.colors.BLACK,
|
|
borderRadius: Module712.radii.sm,
|
|
overflow: "hidden"
|
|
}
|
|
});
|
|
let Component = Module19.memo(function({ channel }) {
|
|
let r92;
|
|
let stateFromStores, callback, shouldForcePipOrientation, isScreenLandscape, width, height;
|
|
stateFromStores = void 0;
|
|
callback = void 0;
|
|
shouldForcePipOrientation = void 0;
|
|
isScreenLandscape = void 0;
|
|
width = void 0;
|
|
height = void 0;
|
|
const styles = useStyles();
|
|
const pipVideoOrStream = usePipVideoOrStream(channel.id);
|
|
const stateFromStores3 = useStateFromStores([ChannelRTCStore, AuthenticationStore], () => ChannelRTCStore.getStreamParticipants(channel.id).find((item) => item.user.id === AuthenticationStore.getId()));
|
|
const stateFromStores2 = useStateFromStores([ChannelRTCStore, EmbeddedActivitiesStore], () => {
|
|
const currentEmbeddedActivity = EmbeddedActivitiesStore.getCurrentEmbeddedActivity();
|
|
return currentEmbeddedActivity != null ? ChannelRTCStore.getParticipant(channel.id, getEmbeddedActivityParticipantId({
|
|
applicationId: currentEmbeddedActivity.applicationId,
|
|
instanceId: currentEmbeddedActivity.compositeInstanceId
|
|
})) : null;
|
|
});
|
|
const isActivityFocused = useIsActivityFocused(channel.id);
|
|
let r39 = pipVideoOrStream != null ? pipVideoOrStream.user.id !== AuthenticationStore.getId() ? pipVideoOrStream : stateFromStores2 : stateFromStores2;
|
|
if (isActivityFocused) {
|
|
r39 = stateFromStores2;
|
|
}
|
|
stateFromStores = r39;
|
|
const stateFromStores4 = useStateFromStores([MediaEngineStore], () => stateFromStores != null && MediaEngineStore.isLocalVideoDisabled(stateFromStores.id), [stateFromStores]);
|
|
const stateFromStores5 = useStateFromStores([ChannelRTCStore, AuthenticationStore], () => {
|
|
const participant = ChannelRTCStore.getParticipant(channel.id, AuthenticationStore.getId());
|
|
return participant != null ? participant.type === ParticipantTypes.USER ? participant.streamId != null ? participant : null : null : null;
|
|
});
|
|
callback = useCallback(() => {
|
|
openGuildVoiceModal(channel, "PIP");
|
|
}, [channel]);
|
|
shouldForcePipOrientation = useShouldForcePipOrientation({
|
|
channel
|
|
});
|
|
isScreenLandscape = useIsScreenLandscape();
|
|
const pipDimensions = usePipDimensions({
|
|
channelId: channel.id,
|
|
forcedOrientation: shouldForcePipOrientation
|
|
});
|
|
width = pipDimensions.width;
|
|
height = pipDimensions.height;
|
|
const memo = useMemo(() => ({
|
|
height,
|
|
width,
|
|
flexDirection: isScreenLandscape ? "row" : shouldForcePipOrientation === OrientationType.LANDSCAPE ? "row" : "column"
|
|
}), [shouldForcePipOrientation, isScreenLandscape, height, width]);
|
|
const r82 = stateFromStores?.type === ParticipantTypes.ACTIVITY && isWatchTogetherApplication(stateFromStores.applicationId) && stateFromStores3 == null;
|
|
const type = stateFromStores?.type;
|
|
L22: {
|
|
if (ParticipantTypes.HIDDEN_STREAM !== type && ParticipantTypes.STREAM !== type) {
|
|
if (ParticipantTypes.USER === type) {
|
|
r92 = stateFromStores4 ? null : <UserTile participant={stateFromStores} avatarSize={AvatarSizes.PROFILE} resizeMode={ResizeMode.COVER} onSingleTap={callback} onDoubleTap={callback} />;
|
|
break L22;
|
|
}
|
|
const ACTIVITY = ParticipantTypes.ACTIVITY;
|
|
r92 = null;
|
|
if (ACTIVITY !== type) {
|
|
break L22;
|
|
}
|
|
r92 = <ActivityTile participant={stateFromStores} channel={channel} onSingleTap={() => {
|
|
const currentEmbeddedActivity = EmbeddedActivitiesStore.getCurrentEmbeddedActivity();
|
|
if (currentEmbeddedActivity != null) {
|
|
transitionToActivity_native(channel.guild_id, currentEmbeddedActivity?.location);
|
|
}
|
|
callback();
|
|
}} />;
|
|
} else {
|
|
r92 = <StreamTile resizeMode={ResizeMode.CONTAIN} participant={stateFromStores} onSingleTap={callback} onDoubleTap={callback} />;
|
|
}
|
|
}
|
|
return <View style={styles.background}>
|
|
<TouchableOpacity activeOpacity={0.7}>
|
|
<View style={[styles.pip, styles.elevationShadow, memo]}>
|
|
{stateFromStores5 != null && !r82 && <UserTile participant={stateFromStores5} avatarSize={AvatarSizes.PROFILE} resizeMode={ResizeMode.COVER} onSingleTap={callback} />}
|
|
{stateFromStores3 != null && !r82 && <ScreenshareTile onSingleTap={callback} />}
|
|
{(stateFromStores5 == null || stateFromStores3 == null || stateFromStores2 == null) && r92}
|
|
</View>
|
|
</TouchableOpacity>
|
|
</View>;
|
|
});
|
|
Component2 = Module19.memo(function({ channel: channel2 }) {
|
|
const r12 = _slicedToArray(useState(() => PictureInPicturePositions.TOP_RIGHT), 2);
|
|
return <PictureInPicture channel={channel2} preferredPosition={r12[0]} onMove={r12[1]}>
|
|
<Component channel={channel2} />
|
|
</PictureInPicture>;
|
|
});
|
|
__initData = {
|
|
code: "function PictureInPictureGlobalTsx1(){const{withTiming,drawerState,STANDARD_EASING}=this.__closure;return withTiming(drawerState,{easing:STANDARD_EASING,duration:250});}"
|
|
};
|
|
__initData2 = {
|
|
code: "function PictureInPictureGlobalTsx2(){const{interpolate,animatedDrawerState,NAV_BAR_HEIGHT,PADDING,chatInputContainerHeight,PIP_AVOIDANCE_TAB_BAR_HEIGHT}=this.__closure;return{marginTop:interpolate(animatedDrawerState.get(),[0,1],[NAV_BAR_HEIGHT+PADDING,PADDING]),marginBottom:interpolate(animatedDrawerState.get(),[0,1],[chatInputContainerHeight+PADDING,PIP_AVOIDANCE_TAB_BAR_HEIGHT+PADDING])};}"
|
|
};
|
|
export default function PictureInPictureGlobal(props) {
|
|
let derivedValue;
|
|
const channel2 = props.channel;
|
|
derivedValue = void 0;
|
|
const styles = useStyles();
|
|
const drawerState = useIsChannelFocused() ? 0 : 1;
|
|
let c22401_0 = drawerState;
|
|
const bestActiveChatInputContainerHeight = useBestActiveChatInputContainerHeight();
|
|
const n = function n() {
|
|
return _timing.withTiming(c22401_0, {
|
|
easing: _native.STANDARD_EASING,
|
|
duration: 250
|
|
});
|
|
};
|
|
n.__closure = {
|
|
withTiming: _timing.withTiming,
|
|
drawerState,
|
|
STANDARD_EASING: _native.STANDARD_EASING
|
|
};
|
|
n.__workletHash = 5168896066356;
|
|
n.__initData = __initData;
|
|
derivedValue = useDerivedValue(n);
|
|
const r36 = function() {
|
|
return {
|
|
marginTop: _ReanimatedRexport.interpolate(derivedValue.get(), [0, 1], [_NavigatorConstants_native.NAV_BAR_HEIGHT + PADDING, PADDING]),
|
|
marginBottom: _ReanimatedRexport.interpolate(derivedValue.get(), [0, 1], [bestActiveChatInputContainerHeight + PADDING, _getPIPBottomOffsetForPIPMode.PIP_AVOIDANCE_TAB_BAR_HEIGHT + PADDING])
|
|
};
|
|
};
|
|
r36.__closure = {
|
|
interpolate: _ReanimatedRexport.interpolate,
|
|
animatedDrawerState: derivedValue,
|
|
NAV_BAR_HEIGHT: _NavigatorConstants_native.NAV_BAR_HEIGHT,
|
|
PADDING,
|
|
chatInputContainerHeight: bestActiveChatInputContainerHeight,
|
|
PIP_AVOIDANCE_TAB_BAR_HEIGHT: _getPIPBottomOffsetForPIPMode.PIP_AVOIDANCE_TAB_BAR_HEIGHT
|
|
};
|
|
r36.__workletHash = 8833756900366;
|
|
r36.__initData = __initData2;
|
|
const animatedStyle = useAnimatedStyle(r36);
|
|
const safeAreaInsets_native = useSafeAreaInsets_native();
|
|
return <View style={[StyleSheet.absoluteFill, {
|
|
paddingLeft: safeAreaInsets_native.left,
|
|
paddingRight: safeAreaInsets_native.right
|
|
}]} pointerEvents="box-none">
|
|
<ReanimatedRexport.View style={[styles.container, animatedStyle]} pointerEvents="box-none">
|
|
<Component2 channel={channel2} />
|
|
</ReanimatedRexport.View>
|
|
</View>;
|
|
};
|