1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
|
import * as React from 'react';
import { View, Text, StyleSheet, TouchableOpacity, Image, Dimensions, Alert } from 'react-native';
// import * as ImageManipulator from "expo-image-manipulator";
import * as MediaLibrary from "expo-media-library";
import * as FileSystem from "expo-file-system";
import { shareAsync } from 'expo-sharing';
import { getIp } from "./Settings"
const w = Dimensions.get("window").width
const h = Dimensions.get("window").height
export default class PhotoBig extends React.Component {
constructor(props) {
super(props)
this.state = {}
}
async componentDidMount() {
}
render() {
const src = this.props.route.params.source;
// (async () => console.log(await isAvailableAsync(), src.uri.replace(/storage\/.*?\//, '')))()
const share = async () => {
let assetUriParts = src.uri.split("/");
let assetName = assetUriParts[assetUriParts.length - 1];
let uri = `${FileSystem.documentDirectory}/${assetName}`;
console.log('uri', uri)
await FileSystem.copyAsync({
from: src.uri,
to: uri,
});
// Share the image from the uri that you copied it to
await shareAsync(uri);
await FileSystem.deleteAsync(uri)
// shareAsync(src.uri, {})
}
const remove = async () => {
await MediaLibrary.deleteAssetsAsync(this.props.route.params.id);
this.props.navigation.goBack();
}
const upload = async () => {
const uri = this.props.route.params.source.uri;
const body = new FormData();
body.append('photo', {
uri: uri,
type: 'image/jpeg',
name: uri.split('/').pop(),
});
console.log(body)
const url = await getIp() + "/upload"
await fetch(url, {
method: "POST",
body
}).catch(e => console.log(e, url))
Alert.alert("Alert", "Galllery - file uploaded and saved!");
}
return (
<View style={[this.props.style, styles.cont]}>
<Image source={src} style={styles.img} />
<View style={styles.txts}>
{/* <TouchableOpacity onPress={() => } style={{ flex: 1 }}><Text style={styles.h1}>SHARE</Text></TouchableOpacity> */}
<TouchableOpacity onPress={share} style={{ flex: 1 }}><Text style={styles.h1}>SHARE</Text></TouchableOpacity>
<TouchableOpacity onPress={remove} style={{ flex: 1 }}><Text style={styles.h1}>DELETE</Text></TouchableOpacity>
<TouchableOpacity onPress={upload} style={{ flex: 1 }}><Text style={styles.h1}>UPLOAD</Text></TouchableOpacity>
</View>
</View>
)
}
}
const styles = StyleSheet.create({
cont: {
flexDirection: "column",
paddingTop: 20,
backgroundColor: "black",
// backgroundColor: "#EB1F63",
justifyContent: "center",
alignItems: "center",
height: "100%",
},
img: {
width: w * 0.9,
height: h * 0.65,
borderRadius: 15,
},
h1: {
color: "white",
fontSize: w / 15,
fontWeight: "bold",
},
txts: {
flex: 1,
flexDirection: "row",
justifyContent: "center",
alignItems: "center",
marginLeft: w / 15,
},
})
|
