From af2319aa6458a92caec2c09386fdf251502c03cb Mon Sep 17 00:00:00 2001
From: Jason <jason.daurus@gmail.com>
Date: Tue, 5 Jul 2016 22:28:00 +0800
Subject: [web] listen to window.onKeyDown

---
 web/src/js/components/Header/FilterInput.jsx |  5 ---
 web/src/js/components/MainView.jsx           |  4 +-
 web/src/js/components/Prompt.jsx             |  9 +----
 web/src/js/components/ProxyApp.jsx           | 58 ++++------------------------
 web/src/js/components/ValueEditor.jsx        | 12 +-----
 5 files changed, 13 insertions(+), 75 deletions(-)

(limited to 'web/src/js')

diff --git a/web/src/js/components/Header/FilterInput.jsx b/web/src/js/components/Header/FilterInput.jsx
index 5b49b788..e421f1a4 100644
--- a/web/src/js/components/Header/FilterInput.jsx
+++ b/web/src/js/components/Header/FilterInput.jsx
@@ -7,10 +7,6 @@ import FilterDocs from './FilterDocs'
 
 export default class FilterInput extends Component {
 
-    static contextTypes = {
-        returnFocus: React.PropTypes.func,
-    }
-
     constructor(props, context) {
         super(props, context)
 
@@ -91,7 +87,6 @@ export default class FilterInput extends Component {
 
     blur() {
         ReactDOM.findDOMNode(this.refs.input).blur()
-        this.context.returnFocus()
     }
 
     select() {
diff --git a/web/src/js/components/MainView.jsx b/web/src/js/components/MainView.jsx
index 7bb6f196..756fa22e 100644
--- a/web/src/js/components/MainView.jsx
+++ b/web/src/js/components/MainView.jsx
@@ -69,5 +69,7 @@ export default connect(
         updateFlow: flowsActions.update,
     },
     undefined,
-    { withRef: true }
+    {
+        withRef: true
+    }
 )(MainView)
diff --git a/web/src/js/components/Prompt.jsx b/web/src/js/components/Prompt.jsx
index e6564896..262b5ff0 100755
--- a/web/src/js/components/Prompt.jsx
+++ b/web/src/js/components/Prompt.jsx
@@ -4,17 +4,13 @@ import _ from 'lodash'
 
 import {Key} from '../utils.js'
 
-Prompt.contextTypes = {
-    returnFocus: PropTypes.func
-}
-
 Prompt.propTypes = {
     options: PropTypes.array.isRequired,
     done: PropTypes.func.isRequired,
     prompt: PropTypes.string,
 }
 
-export default function Prompt({ prompt, done, options }, context) {
+export default function Prompt({ prompt, done, options }) {
     const opts = []
 
     function keyTaken(k) {
@@ -35,7 +31,7 @@ export default function Prompt({ prompt, done, options }, context) {
         }
         opts.push(opt)
     }
-    
+
     function onKeyDown(event) {
         event.stopPropagation()
         event.preventDefault()
@@ -44,7 +40,6 @@ export default function Prompt({ prompt, done, options }, context) {
             return
         }
         done(key.key || false)
-        context.returnFocus()
     }
 
     return (
diff --git a/web/src/js/components/ProxyApp.jsx b/web/src/js/components/ProxyApp.jsx
index e8c0e6d6..62b13932 100644
--- a/web/src/js/components/ProxyApp.jsx
+++ b/web/src/js/components/ProxyApp.jsx
@@ -12,23 +12,18 @@ import { Key } from '../utils.js'
 
 class ProxyAppMain extends Component {
 
-    static childContextTypes = {
-        returnFocus: PropTypes.func.isRequired,
-    }
-
     static contextTypes = {
         router: PropTypes.object.isRequired,
     }
 
-    constructor(props, context) {
-        super(props, context)
-
-        this.focus = this.focus.bind(this)
-        this.onKeyDown = this.onKeyDown.bind(this)
-    }
-
     componentWillMount() {
         this.props.appInit()
+        window.addEventListener('keydown', this.props.onKeyDown);
+    }
+
+    componentWillUnmount() {
+        this.props.appDestruct()
+        window.removeEventListener('keydown', this.props.onKeyDown);
     }
 
     componentWillReceiveProps(nextProps) {
@@ -42,49 +37,10 @@ class ProxyAppMain extends Component {
         }
     }
 
-    /**
-     * @todo listen to window's key events
-     */
-    componentDidMount() {
-        this.focus()
-    }
-
-    componentWillUnmount() {
-        this.props.appDestruct()
-    }
-
-    /**
-     * @todo use props
-     */
-    getChildContext() {
-        return { returnFocus: this.focus }
-    }
-
-    /**
-     * @todo remove it
-     */
-    focus() {
-        document.activeElement.blur()
-        window.getSelection().removeAllRanges()
-        ReactDOM.findDOMNode(this).focus()
-    }
-
-    /**
-     * @todo move to actions
-     * @todo bind on window
-     */
-    onKeyDown(e) {
-        if (e.ctrlKey) {
-            return
-        }
-        this.props.onKeyDown(e.keyCode)
-        e.preventDefault()
-    }
-
     render() {
         const { showEventLog, location, children, query } = this.props
         return (
-            <div id="container" tabIndex="0" onKeyDown={this.onKeyDown}>
+            <div id="container" tabIndex="0">
                 <Header ref="header" query={query} />
                 {React.cloneElement(
                     children,
diff --git a/web/src/js/components/ValueEditor.jsx b/web/src/js/components/ValueEditor.jsx
index 0316924f..5f1bf2dc 100755
--- a/web/src/js/components/ValueEditor.jsx
+++ b/web/src/js/components/ValueEditor.jsx
@@ -4,27 +4,17 @@ import ValidateEditor from './ValueEditor/ValidateEditor'
 
 export default class ValueEditor extends Component {
 
-    static contextTypes = {
-        returnFocus: PropTypes.func,
-    }
-
     static propTypes = {
         content: PropTypes.string.isRequired,
         onDone: PropTypes.func.isRequired,
         inline: PropTypes.bool,
     }
 
-    constructor(props) {
-        super(props)
-        this.focus = this.focus.bind(this)
-    }
-
     render() {
-        var tag = this.props.inline ? "span" : 'div'
+        var tag = this.props.inline ? 'span' : 'div'
         return (
             <ValidateEditor
                 {...this.props}
-                onStop={() => this.context.returnFocus()}
                 tag={tag}
             />
         )
-- 
cgit v1.2.3