about summary refs log tree commit diff
diff options
context:
space:
mode:
authorThibaut Girka <thib@sitedethib.com>2018-07-25 14:13:18 +0200
committerThibG <thib@sitedethib.com>2018-07-26 08:42:25 +0200
commit82ab5aacb24edf793f391cb4122116bf92ee0e7a (patch)
tree04ff36ab9d2f2531827215430dd8658f69aaff28
parent02326a432239c58a6cb9ae18486826827b35a190 (diff)
Prevent scrolling main frame when navigating in image gallery with arrow keys
-rw-r--r--app/javascript/flavours/glitch/features/ui/components/media_modal.js10
1 files changed, 7 insertions, 3 deletions
diff --git a/app/javascript/flavours/glitch/features/ui/components/media_modal.js b/app/javascript/flavours/glitch/features/ui/components/media_modal.js
index bffe3b1f7..d4fd45d4d 100644
--- a/app/javascript/flavours/glitch/features/ui/components/media_modal.js
+++ b/app/javascript/flavours/glitch/features/ui/components/media_modal.js
@@ -48,23 +48,27 @@ export default class MediaModal extends ImmutablePureComponent {
     this.setState({ index: index % this.props.media.size });
   }
 
-  handleKeyUp = (e) => {
+  handleKeyDown = (e) => {
     switch(e.key) {
     case 'ArrowLeft':
       this.handlePrevClick();
+      e.preventDefault();
+      e.stopPropagation();
       break;
     case 'ArrowRight':
       this.handleNextClick();
+      e.preventDefault();
+      e.stopPropagation();
       break;
     }
   }
 
   componentDidMount () {
-    window.addEventListener('keyup', this.handleKeyUp, false);
+    window.addEventListener('keydown', this.handleKeyDown, false);
   }
 
   componentWillUnmount () {
-    window.removeEventListener('keyup', this.handleKeyUp);
+    window.removeEventListener('keydown', this.handleKeyDown);
   }
 
   getIndex () {