Add select via shortcut (#61)

- [web][select via dialog] Add shortcuts M and V.
- [web][select via dialog] Asynchronously handle "select via" method, so that shortcut callback can continue to run (and then set its state) without waiting for callback return. This should help to prevent React from updating an unmounted shortcut component.

2 files changed, 7 insertions, 2 deletions

diff --git a/diplomacy/web/src/gui/forms/select_via_form.jsx b/diplomacy/web/src/gui/forms/select_via_form.jsx
index 8b340af..c0f13a5 100644
--- a/diplomacy/web/src/gui/forms/select_via_form.jsx
+++ b/diplomacy/web/src/gui/forms/select_via_form.jsx
@@ -18,6 +18,7 @@ import React from "react";
 import PropTypes from "prop-types";
 import {Button} from "../components/button";
 import {FancyBox} from "../components/fancyBox";
+const HotKey = require('react-shortcut');
 
 export class SelectViaForm extends React.Component {
     render() {
@@ -27,6 +28,8 @@ export class SelectViaForm extends React.Component {
                 <div>
                     <Button title={'regular move (M)'} large={true} onClick={() => this.props.onSelect('M')}/>
                     <Button title={'move via (V)'} large={true} onClick={() => this.props.onSelect('V')}/>
+                    <HotKey keys={['m']} onKeysCoincide={() => this.props.onSelect('M')}/>
+                    <HotKey keys={['v']} onKeysCoincide={() => this.props.onSelect('V')}/>
                 </div>
             </FancyBox>
         );
diff --git a/diplomacy/web/src/gui/pages/content_game.jsx b/diplomacy/web/src/gui/pages/content_game.jsx
index 457d901..a98c739 100644
--- a/diplomacy/web/src/gui/pages/content_game.jsx
+++ b/diplomacy/web/src/gui/pages/content_game.jsx
@@ -243,8 +243,10 @@ export class ContentGame extends React.Component {
         this.getPage().dialog(onClose => (
             <SelectViaForm path={orderPath}
                            onSelect={(moveType) => {
-                               this.setSelectedVia(moveType, powerName, orderPath, location);
-                               onClose();
+                               setTimeout(() => {
+                                   this.setSelectedVia(moveType, powerName, orderPath, location);
+                                   onClose();
+                               }, 0);
                            }}
                            onClose={() => {
                                this.clearOrderBuildingPath();