web: global key handling

2 files changed, 24 insertions, 4 deletions

diff --git a/web/src/js/components/mainview.js b/web/src/js/components/mainview.js
index 54687373..f102ed5e 100644
--- a/web/src/js/components/mainview.js
+++ b/web/src/js/components/mainview.js
@@ -130,7 +130,7 @@ var MainView = React.createClass({
         }
         this.selectFlow(flows[index]);
     },
-    onKeyDown: function (e) {
+    onMainKeyDown: function (e) {
         var flow = this.getSelected();
         if (e.ctrlKey) {
             return;
@@ -229,7 +229,7 @@ var MainView = React.createClass({
         }
 
         return (
-            <div className="main-view" onKeyDown={this.onKeyDown} tabIndex="0">
+            <div className="main-view">
                 <FlowTable ref="flowTable"
                     selectFlow={this.selectFlow}
                     setSortKeyFun={this.setSortKeyFun}
diff --git a/web/src/js/components/proxyapp.js b/web/src/js/components/proxyapp.js
index 411e1be8..4013c3e4 100644
--- a/web/src/js/components/proxyapp.js
+++ b/web/src/js/components/proxyapp.js
@@ -9,6 +9,7 @@ var header = require("./header.js");
 var EventLog = require("./eventlog.js");
 var store = require("../store/store.js");
 var Query = require("../actions.js").Query;
+var Key = require("../utils.js").Key;
 
 
 //TODO: Move out of here, just a stub.
@@ -26,6 +27,9 @@ var ProxyAppMain = React.createClass({
         flowStore: React.PropTypes.object.isRequired,
         eventStore: React.PropTypes.object.isRequired
     },
+    componentDidMount: function () {
+        React.findDOMNode(this).focus();
+    },
     getChildContext: function () {
         return {
             settingsStore: this.state.settingsStore,
@@ -46,6 +50,22 @@ var ProxyAppMain = React.createClass({
             eventStore: eventStore
         };
     },
+    getMainComponent: function () {
+        return this.refs.view.refs.__routeHandler__;
+    },
+    onKeydown: function (e) {
+        switch(e.keyCode){
+            case Key.I:
+                console.error("unimplemented: intercept");
+                break;
+            default:
+                var main = this.getMainComponent();
+                if(main && main.onMainKeyDown){
+                    main.onMainKeyDown(e);
+                }
+        }
+
+    },
     render: function () {
         var eventlog;
         if (this.getQuery()[Query.SHOW_EVENTLOG]) {
@@ -57,9 +77,9 @@ var ProxyAppMain = React.createClass({
             eventlog = null;
         }
         return (
-            <div id="container">
+            <div id="container" tabIndex="0" onKeyDown={this.onKeydown}>
                 <header.Header/>
-                <RouteHandler query={this.getQuery()}/>
+                <RouteHandler ref="view" query={this.getQuery()}/>
                 {eventlog}
                 <Footer/>
             </div>