about summary refs log tree commit diff
path: root/app/assets/javascripts/components
diff options
context:
space:
mode:
authorEugen Rochko <eugen@zeonfederated.com>2017-02-05 03:01:23 +0100
committerEugen Rochko <eugen@zeonfederated.com>2017-02-05 03:01:23 +0100
commit6cdcac1396e60286284fd8cbfe5c859050c696af (patch)
treef105f4e655819f41cb1b84e306c1d5c08f3831ba /app/assets/javascripts/components
parent44fad0160f4b390a97fae8bb23cdc98ccf5649d9 (diff)
Fix #598 - arrow keys to navigate media; fix #481 - non-exact matches no longer
overshadow requirement for remote-lookup
Diffstat (limited to 'app/assets/javascripts/components')
-rw-r--r--app/assets/javascripts/components/components/lightbox.jsx2
-rw-r--r--app/assets/javascripts/components/features/ui/containers/modal_container.jsx23
2 files changed, 24 insertions, 1 deletions
diff --git a/app/assets/javascripts/components/components/lightbox.jsx b/app/assets/javascripts/components/components/lightbox.jsx
index 646484539..65ff708b4 100644
--- a/app/assets/javascripts/components/components/lightbox.jsx
+++ b/app/assets/javascripts/components/components/lightbox.jsx
@@ -44,7 +44,7 @@ const Lightbox = React.createClass({
 
   componentDidMount () {
     this._listener = e => {
-      if (e.key === 'Escape') {
+      if (this.props.isVisible && e.key === 'Escape') {
         this.props.onCloseClicked();
       }
     };
diff --git a/app/assets/javascripts/components/features/ui/containers/modal_container.jsx b/app/assets/javascripts/components/features/ui/containers/modal_container.jsx
index 0ffbfe8b3..1e69fc59c 100644
--- a/app/assets/javascripts/components/features/ui/containers/modal_container.jsx
+++ b/app/assets/javascripts/components/features/ui/containers/modal_container.jsx
@@ -104,6 +104,29 @@ const Modal = React.createClass({
     this.props.onPrevClicked();
   },
 
+  componentDidMount () {
+    this._listener = e => {
+      if (!this.props.isVisible) {
+        return;
+      }
+
+      switch(e.key) {
+      case 'ArrowLeft':
+        this.props.onPrevClicked();
+        break;
+      case 'ArrowRight':
+        this.props.onNextClicked();
+        break;
+      }
+    };
+
+    window.addEventListener('keyup', this._listener);
+  },
+
+  componentDidUnmount () {
+    window.removeEventListener('keyup', this._listener);
+  },
+
   render () {
     const { media, index, ...other } = this.props;