Show url when mouse enters a link

This resolves #47

1 files changed, 24 insertions, 0 deletions

diff --git a/src/components/services/content/ServiceWebview.js b/src/components/services/content/ServiceWebview.js
index 043ff42ea..7e33d694c 100644
--- a/src/components/services/content/ServiceWebview.js
+++ b/src/components/services/content/ServiceWebview.js
@@ -6,6 +6,7 @@ import Webview from 'react-electron-web-view';
 import classnames from 'classnames';
 
 import ServiceModel from '../../../models/Service';
+import StatusBarTargetUrl from '../../ui/StatusBarTargetUrl';
 
 @observer
 export default class ServiceWebview extends Component {
@@ -20,6 +21,8 @@ export default class ServiceWebview extends Component {
 
   state = {
     forceRepaint: false,
+    targetUrl: '',
+    statusBarVisible: false,
   };
 
   componentDidMount() {
@@ -33,6 +36,17 @@ export default class ServiceWebview extends Component {
     });
   }
 
+  updateTargetUrl = (event) => {
+    let visible = true;
+    if (event.url === '' || event.url === '#') {
+      visible = false;
+    }
+    this.setState({
+      targetUrl: event.url,
+      statusBarVisible: visible,
+    });
+  }
+
   webview = null;
 
   render() {
@@ -47,6 +61,13 @@ export default class ServiceWebview extends Component {
       'services__webview--force-repaint': this.state.forceRepaint,
     });
 
+    let statusBar = null;
+    if (this.state.statusBarVisible) {
+      statusBar = (
+        <StatusBarTargetUrl position="bottom" text={this.state.targetUrl} />
+      );
+    }
+
     return (
       <div className={webviewClasses}>
         <Webview
@@ -62,11 +83,14 @@ export default class ServiceWebview extends Component {
             webview: this.webview.view,
           })}
 
+          onUpdateTargetUrl={this.updateTargetUrl}
+
           useragent={service.userAgent}
 
           disablewebsecurity
           allowpopups
         />
+        {statusBar}
       </div>
     );
   }