diff --git a/Views/Slideshow.js b/Views/Slideshow.js index cfa3150..7b063d4 100644 --- a/Views/Slideshow.js +++ b/Views/Slideshow.js @@ -1,31 +1,36 @@ import React from 'react'; -import { StyleSheet, TouchableHighlight, Image, TouchableWithoutFeedback, View } from 'react-native'; - +import { StyleSheet, View } from 'react-native'; +import { Text, List, RadioButton } from "react-native-paper"; +import { Image } from 'expo-image'; // Import Image from expo-image let Slideshow = (props) => { //console.log(route.params.postid) //return ; - console.log(props) + //console.log('RenderSlideSHow', props) const images = props.route.params.images; [imageIndex, setImageIndex] = React.useState(props.route.params.startIndex); - //images.length - console.log(imageIndex); - console.log(images[imageIndex][1], images.length); + // images.length + // console.log(imageIndex); + // console.log(images[imageIndex][1], images.length); + let touchY = 0; + let touchX = 0; return ( { - this.touchY = e.nativeEvent.pageY - this.touchX = e.nativeEvent.pageX + //console.log(e.nativeEvent) + touchY = e.nativeEvent.pageY + touchX = e.nativeEvent.pageX }} onTouchEnd={e => { - if ((this.touchX - e.nativeEvent.pageX > 20) && (images.length - 1 > imageIndex)) + if ((touchX - e.nativeEvent.pageX > 20) && (images.length - 1 > imageIndex)) setImageIndex(imageIndex + 1) - if ((this.touchX - e.nativeEvent.pageX < -20) && (imageIndex > 0)) + if ((touchX - e.nativeEvent.pageX < -20) && (imageIndex > 0)) setImageIndex(imageIndex - 1) }} > - + {imageIndex+1}/{images.length} + ) }; @@ -36,6 +41,11 @@ const styles = StyleSheet.create({ height: "100%", resizeMode: "contain", }, + countText: { + position: 'absolute', + left: '50%', + bottom: 10 + } }); export default Slideshow; diff --git a/app.json b/app.json index efb7d99..8a4ffb7 100644 --- a/app.json +++ b/app.json @@ -45,7 +45,15 @@ }, "plugins": [ [ - "expo-notifications" + "expo-notifications", + ], + [ + "expo-media-library", + { + "photosPermission": "Allow $(PRODUCT_NAME) to access your photos.", + "savePhotosPermission": "Allow $(PRODUCT_NAME) to save photos.", + "isAccessMediaLocationEnabled": true + } ], "expo-localization" ], diff --git a/components/Media.js b/components/Media.js index 017a04b..b24de56 100644 --- a/components/Media.js +++ b/components/Media.js @@ -1,5 +1,5 @@ import React, { useState, useEffect } from 'react'; -import { View, TouchableHighlight, Image, StyleSheet, FlatList, TouchableWithoutFeedback, Share } from 'react-native'; +import { View, TouchableHighlight, StyleSheet, FlatList, TouchableWithoutFeedback, Share } from 'react-native'; import { Button, Text, ProgressBar } from 'react-native-paper'; import API from './../API.js'; import VideoPlayer from './VideoPlayer.js'; @@ -9,6 +9,9 @@ import { useSnapshot } from 'valtio'; import GlobalState from '../contexts/GlobalState.js'; import Moment from 'moment'; import { useNavigation } from '@react-navigation/native'; +import { Image } from 'expo-image'; // Import Image from expo-image +import * as FileSystem from 'expo-file-system'; +import * as Sharing from 'expo-sharing'; const videoIdF = (content) => { let vimeoTag = content.match(/@vimeo:[0-9]+/); @@ -41,7 +44,7 @@ const imagesTagF = (content) => { images.forEach(i => { let tag = i.substring(1); let parts = [tag.substring(1, tag.indexOf(":")), tag.substring(tag.indexOf(":") + 1)]; - if (parts[1].substring(0, 4) != "http") parts[1] = "https://social.emmint.com/" + parts[1]; + if (parts[1].substring(0, 4) != "http") parts[1] = "https://social.emmint.com/" + parts[1] + '?width=1000&height=1000'; Tags.push(parts); }); return Tags; @@ -60,6 +63,7 @@ let Media = (props) => { const gState = useSnapshot(GlobalState); const viewer = gState.me; const imagesTag = imagesTagF(props.content); + const imagesTagLimited = imagesTag.slice(0, 10); const imageStyle = imagesTag.length == 1 ? styles.image : styles.multipleImage; const videosId = videoIdF(props.content); const hlsUrl = hlsIdF(props.content); @@ -88,7 +92,7 @@ let Media = (props) => { loaded ? : ( setLoaded(true)}> - + ) ) : @@ -102,7 +106,7 @@ let Media = (props) => { GlobalState.mediaPost = props.post; }}> {poster ? - : + :