Link effect (#199)

* Add style to link on video file on tap. Adds a timeout to set it to false as Linking has a weird behavior when chrome vs youtube page is open.
* Add link to be semi-transparent onPress instead of green background.

app/src/component/link/view.js

@@ -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({
+      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() {
     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}

app/src/page/file/view.js

@@ -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;

app/src/styles/filePage.js

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