import React, { useState, useEffect } from "react"; import { View, StyleSheet, Dimensions, ScrollView, SafeAreaView, StatusBar, LayoutAnimation, Text, Platform, } from "react-native"; import { connect } from "react-redux"; import { publicApi } from "../../redux/actions"; import { Video } from "expo-av"; import * as ScreenOrientation from "expo-screen-orientation"; //components import Navbar from "../../components/Navbar"; import Drawer from "../../components/Drawer"; import Season from "./components/Season"; import Divider from "../../components/Divider"; //assets import tw from "tailwind-rn"; import fontSize from "../../constants/fontSize"; import Colors from "../../constants/Colors"; const ios = Platform.OS === "ios"; function VideoDisplay({ route, mobile, theme }) { const video = React.useRef(null); const [width, setWidth] = useState(Dimensions.get("window").width); const [position, setPosition] = useState("100%"); const setBoxPosition = () => { LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut); setPosition(position === "100%" ? "0%" : "100%"); }; React.useEffect(() => { video.current.replayAsync(); video.current.playAsync(); }, [route]); return ( video.current.presentFullscreenPlayer()} > {!mobile ? : null} ); } const styles = StyleSheet.create({ contentContainerStyle: { paddingBottom: 100, }, container: { paddingVertical: 5, paddingHorizontal: 16, }, }); const mapStateToProps = (state) => ({ grades: state.publicApi.grades, mobile: state.publicApi.mobile, theme: state.publicApi.theme, }); export default connect(mapStateToProps)(VideoDisplay);