Link effect #199

Merged
akinwale merged 3 commits from link-effect into master 2018-07-06 03:00:24 +02:00
3 changed files with 31 additions and 5 deletions

View file

@ -2,17 +2,35 @@ import React from 'react';
import { Linking, Text, TouchableOpacity } from 'react-native'; import { Linking, Text, TouchableOpacity } from 'react-native';
export default class Link extends React.PureComponent { export default class Link extends React.PureComponent {
constructor(props) {
super(props)
this.state = {
tappedStyle: false,
}
this.addTappedStyle = this.addTappedStyle.bind(this)
}
handlePress = () => { handlePress = () => {
const { error, href, navigation, notify } = this.props; const { error, href, navigation, notify } = this.props;
if (navigation && href.startsWith('#')) { if (navigation && href.startsWith('#')) {
navigation.navigate(href.substring(1)); navigation.navigate(href.substring(1));
} else { } else {
Linking.openURL(href).catch(err => notify({ if (this.props.effectOnTap) this.addTappedStyle();
message: error, Linking.openURL(href)
displayType: ['toast'] .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() { render() {
@ -31,6 +49,10 @@ export default class Link extends React.PureComponent {
} }
} }
if (this.props.effectOnTap && this.state.tappedStyle) {
styles.push(this.props.effectOnTap);
}
return ( return (
<Text style={styles} onPress={onPress ? onPress : this.handlePress}> <Text style={styles} onPress={onPress ? onPress : this.handlePress}>
{text} {text}

View file

@ -149,7 +149,8 @@ class FilePage extends React.PureComponent {
<Link key={j} <Link key={j}
style={filePageStyle.link} style={filePageStyle.link}
href={token} href={token}
text={token} /> text={token}
effectOnTap={filePageStyle.linkTapped} />
); );
} else { } else {
return token + space; return token + space;

View file

@ -160,6 +160,9 @@ const filePageStyle = StyleSheet.create({
}, },
link: { link: {
color: Colors.LbryGreen color: Colors.LbryGreen
},
linkTapped: {
color: "rgba(64, 184, 154, .2)"
} }
}); });