mirror of
https://github.com/balzack/databag.git
synced 2025-03-13 00:50:03 +00:00
show popup msg on download
This commit is contained in:
parent
b192e8a939
commit
8d473b342b
@ -26,6 +26,17 @@ export function AudioAsset({ asset, dismiss }) {
|
||||
<Icons name="play-circle-outline" size={92} color={Colors.text} />
|
||||
</TouchableOpacity>
|
||||
)}
|
||||
{ state.showDownloaded && (
|
||||
<View style={styles.downloaded}>
|
||||
<MatIcons name="folder-download-outline" size={22} color={Colors.white} />
|
||||
{ Platform.OS === 'ios' && (
|
||||
<Text style={styles.downloadedLabel}>Documents</Text>
|
||||
)}
|
||||
{ Platform.OS !== 'ios' && (
|
||||
<Text style={styles.downloadedLabel}>Downloads</Text>
|
||||
)}
|
||||
</View>
|
||||
)}
|
||||
{ state.playing && state.loaded && (
|
||||
<TouchableOpacity style={styles.control} onPress={actions.pause}>
|
||||
<Icons name="pause-circle-outline" size={92} color={Colors.text} />
|
||||
|
@ -59,5 +59,23 @@ export const styles = StyleSheet.create({
|
||||
fontSize: 12,
|
||||
color: '#888888',
|
||||
},
|
||||
downloaded: {
|
||||
top: 0,
|
||||
position: 'absolute',
|
||||
marginTop: 8,
|
||||
display: 'flex',
|
||||
backgroundColor: Colors.grey,
|
||||
borderRadius: 4,
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
paddingLeft: 8,
|
||||
paddingRight: 8,
|
||||
paddingTop: 2,
|
||||
paddingBottom: 2,
|
||||
},
|
||||
downloadedLabel: {
|
||||
color: Colors.white,
|
||||
paddingLeft: 8,
|
||||
},
|
||||
})
|
||||
|
||||
|
@ -13,6 +13,7 @@ export function useAudioAsset(asset) {
|
||||
playing: false,
|
||||
loaded: false,
|
||||
downloaded: false,
|
||||
showDownloaded: false,
|
||||
});
|
||||
|
||||
const closing = useRef(null);
|
||||
@ -61,7 +62,8 @@ export function useAudioAsset(asset) {
|
||||
else {
|
||||
await RNFS.downloadFile({ fromUrl: state.url, toFile: path }).promise;
|
||||
}
|
||||
await RNFS.moveFile(path, `${path}`);
|
||||
updateState({ showDownloaded: true });
|
||||
setTimeout(() => { updateState({ showDownloaded: false }) }, 2000);
|
||||
}
|
||||
},
|
||||
play: () => {
|
||||
|
@ -19,6 +19,18 @@ export function ImageAsset({ asset, dismiss }) {
|
||||
style={{ ...styles.main, width: state.imageWidth, height: state.imageHeight }}
|
||||
resizeMode={FastImage.resizeMode.contain} />
|
||||
)}
|
||||
{ state.showDownloaded && (
|
||||
<View style={styles.downloaded}>
|
||||
<MatIcons name="folder-download-outline" size={22} color={Colors.white} />
|
||||
{ Platform.OS === 'ios' && (
|
||||
<Text style={styles.downloadedLabel}>Documents</Text>
|
||||
)}
|
||||
{ Platform.OS !== 'ios' && (
|
||||
<Text style={styles.downloadedLabel}>Downloads</Text>
|
||||
)}
|
||||
</View>
|
||||
)}
|
||||
|
||||
{ state.loaded && state.controls && (
|
||||
<TouchableOpacity style={styles.share} onPress={actions.download}>
|
||||
{ state.downloaded && (
|
||||
|
@ -60,6 +60,24 @@ export const styles = StyleSheet.create({
|
||||
padding: 4,
|
||||
borderRadius: 4,
|
||||
backgroundColor: Colors.grey,
|
||||
}
|
||||
},
|
||||
downloaded: {
|
||||
top: 0,
|
||||
position: 'absolute',
|
||||
marginTop: 8,
|
||||
display: 'flex',
|
||||
backgroundColor: Colors.grey,
|
||||
borderRadius: 4,
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
paddingLeft: 8,
|
||||
paddingRight: 8,
|
||||
paddingTop: 2,
|
||||
paddingBottom: 2,
|
||||
},
|
||||
downloadedLabel: {
|
||||
color: Colors.white,
|
||||
paddingLeft: 8,
|
||||
},
|
||||
})
|
||||
|
||||
|
@ -17,6 +17,7 @@ export function useImageAsset(asset) {
|
||||
failed: false,
|
||||
controls: false,
|
||||
downloaded: false,
|
||||
showDownloaded: false,
|
||||
});
|
||||
|
||||
const conversation = useContext(ConversationContext);
|
||||
@ -102,6 +103,8 @@ export function useImageAsset(asset) {
|
||||
if (Platform.OS !== 'ios') {
|
||||
await RNFS.scanFile(`${path}.${ext}`);
|
||||
}
|
||||
updateState({ showDownloaded: true });
|
||||
setTimeout(() => { updateState({ showDownloaded: false }) }, 2000);
|
||||
}
|
||||
},
|
||||
loaded: () => {
|
||||
|
@ -27,6 +27,17 @@ export function VideoAsset({ asset, dismiss }) {
|
||||
{ (!state.playing || state.controls) && (
|
||||
<View style={styles.overlay} />
|
||||
)}
|
||||
{ state.showDownloaded && (
|
||||
<View style={styles.downloaded}>
|
||||
<MatIcons name="folder-download-outline" size={22} color={Colors.white} />
|
||||
{ Platform.OS === 'ios' && (
|
||||
<Text style={styles.downloadedLabel}>Documents</Text>
|
||||
)}
|
||||
{ Platform.OS !== 'ios' && (
|
||||
<Text style={styles.downloadedLabel}>Downloads</Text>
|
||||
)}
|
||||
</View>
|
||||
)}
|
||||
{ !state.playing && state.videoLoaded && (
|
||||
<TouchableOpacity style={styles.control} onPress={actions.play}>
|
||||
<Icons name="play-circle-outline" size={92} color={Colors.white} />
|
||||
|
@ -67,5 +67,23 @@ export const styles = StyleSheet.create({
|
||||
fontSize: 12,
|
||||
color: '#dddddd',
|
||||
},
|
||||
downloaded: {
|
||||
top: 0,
|
||||
position: 'absolute',
|
||||
marginTop: 8,
|
||||
display: 'flex',
|
||||
backgroundColor: Colors.grey,
|
||||
borderRadius: 4,
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
paddingLeft: 8,
|
||||
paddingRight: 8,
|
||||
paddingTop: 2,
|
||||
paddingBottom: 2,
|
||||
},
|
||||
downloadedLabel: {
|
||||
color: Colors.white,
|
||||
paddingLeft: 8,
|
||||
},
|
||||
})
|
||||
|
||||
|
@ -85,10 +85,11 @@ export function useVideoAsset(asset) {
|
||||
else {
|
||||
await RNFS.downloadFile({ fromUrl: state.url, toFile: path }).promise;
|
||||
}
|
||||
await RNFS.moveFile(path, `${path}`);
|
||||
if (Platform.OS !== 'ios') {
|
||||
await RNFS.scanFile(`${path}`);
|
||||
}
|
||||
updateState({ showDownloaded: true });
|
||||
setTimeout(() => { updateState({ showDownloaded: false }) }, 2000);
|
||||
}
|
||||
},
|
||||
setThumbSize: (e) => {
|
||||
|
Loading…
Reference in New Issue
Block a user