Files
imexmobile/components-old/media-cache-overlay/media-cache-overlay.component.jsx

83 lines
2.4 KiB
JavaScript

import { SafeAreaView } from "react-native";
import React from "react";
import ImageView from "react-native-image-viewing";
export default function MediaCacheOverlay({
photos,
previewVisible,
setPreviewVisible,
imgIndex,
setImgIndex,
}) {
//const videoRef = React.useRef(null);
return (
<SafeAreaView>
<ImageView
onRequestClose={() => setPreviewVisible(false)}
visible={previewVisible}
images={photos}
imageIndex={imgIndex}
// onImageIndexChange={(...props) => {
// // console.log(props);
// }}
/>
</SafeAreaView>
);
// return (
// <Modal
// onDismiss={() => setPreviewVisible(false)}
// onRequestClose={() => setPreviewVisible(false)}
// visible={previewVisible}
// transparent={false}
// >
// <SafeAreaView style={{ flex: 1, backgroundColor: "black" }}>
// <Gallery
// initialPage={imgIndex}
// images={photos}
// onPageScroll={({ position }) => setcurrentIndex(position)}
// onPageScrollStateChanged={(state) =>
// state === "idle" ? setDragging(false) : setDragging(true)
// }
// />
// <TouchableOpacity
// style={{ position: "absolute" }}
// onPress={() => setPreviewVisible(false)}
// >
// <Ionicons
// name="ios-close"
// size={64}
// color="dodgerblue"
// style={{ margin: 20 }}
// />
// </TouchableOpacity>
// {!dragging && photos[currentIndex] && photos[currentIndex].videoUrl && (
// <TouchableOpacity
// style={{
// position: "absolute",
// left: Dimensions.get("window").width / 2 - 32,
// top: Dimensions.get("window").height / 2 - 32,
// justifyContent: "center",
// alignItems: "center",
// }}
// onPress={async () => {
// await videoRef.current.loadAsync(
// { uri: photos[currentIndex].videoUrl },
// {},
// false
// );
// videoRef.current.presentFullscreenPlayer();
// }}
// >
// <Ionicons name="play" size={64} color="white" />
// </TouchableOpacity>
// )}
// </SafeAreaView>
// <Video ref={videoRef} useNativeControls />
// </Modal>
// );
}