Link effect #199
3 changed files with 31 additions and 5 deletions
|
@ -2,19 +2,37 @@ import React from 'react';
|
|||
import { Linking, Text, TouchableOpacity } from 'react-native';
|
||||
|
||||
export default class Link extends React.PureComponent {
|
||||
|
||||
constructor(props) {
|
||||
super(props)
|
||||
this.state = {
|
||||
tappedStyle: false,
|
||||
}
|
||||
this.addTappedStyle = this.addTappedStyle.bind(this)
|
||||
}
|
||||
|
||||
handlePress = () => {
|
||||
const { error, href, navigation, notify } = this.props;
|
||||
|
||||
if (navigation && href.startsWith('#')) {
|
||||
navigation.navigate(href.substring(1));
|
||||
} else {
|
||||
Linking.openURL(href).catch(err => notify({
|
||||
message: error,
|
||||
displayType: ['toast']
|
||||
}));
|
||||
if (this.props.effectOnTap) this.addTappedStyle();
|
||||
Linking.openURL(href)
|
||||
.then(() => setTimeout(() => { this.setState({ tappedStyle: false }); }, 2000))
|
||||
.catch(err => {
|
||||
notify({ message: error, displayType: ['toast']})
|
||||
this.setState({tappedStyle: false})
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
addTappedStyle() {
|
||||
this.setState({ tappedStyle: true });
|
||||
setTimeout(() => { this.setState({ tappedStyle: false }); }, 2000);
|
||||
}
|
||||
|
||||
render() {
|
||||
const {
|
||||
onPress,
|
||||
|
@ -31,6 +49,10 @@ export default class Link extends React.PureComponent {
|
|||
}
|
||||
}
|
||||
|
||||
if (this.props.effectOnTap && this.state.tappedStyle) {
|
||||
styles.push(this.props.effectOnTap);
|
||||
}
|
||||
|
||||
return (
|
||||
<Text style={styles} onPress={onPress ? onPress : this.handlePress}>
|
||||
{text}
|
||||
|
|
|
@ -149,7 +149,8 @@ class FilePage extends React.PureComponent {
|
|||
<Link key={j}
|
||||
style={filePageStyle.link}
|
||||
href={token}
|
||||
text={token} />
|
||||
text={token}
|
||||
effectOnTap={filePageStyle.linkTapped} />
|
||||
);
|
||||
} else {
|
||||
return token + space;
|
||||
|
|
|
@ -160,6 +160,9 @@ const filePageStyle = StyleSheet.create({
|
|||
},
|
||||
link: {
|
||||
color: Colors.LbryGreen
|
||||
},
|
||||
linkTapped: {
|
||||
color: "rgba(64, 184, 154, .2)"
|
||||
}
|
||||
});
|
||||
|
||||
|
|
Loading…
Reference in a new issue