about summary refs log tree commit diff
diff options
context:
space:
mode:
authorThibG <thib@sitedethib.com>2018-07-26 04:50:50 +0200
committerEugen Rochko <eugen@zeonfederated.com>2018-07-26 04:50:50 +0200
commitd199806969be99f968cc9b3a74cc233e86e0cc12 (patch)
treebf0184df82b1a2308a0fcf83caa283b54233a892
parentc9739ca86b65d67b106c770849aba19d3b32a638 (diff)
Prevent scrolling main frame when navigating in image gallery with arrow keys (#8073)
-rw-r--r--app/javascript/mastodon/features/ui/components/media_modal.js10
1 files changed, 7 insertions, 3 deletions
diff --git a/app/javascript/mastodon/features/ui/components/media_modal.js b/app/javascript/mastodon/features/ui/components/media_modal.js
index 6af0a101c..12db95326 100644
--- a/app/javascript/mastodon/features/ui/components/media_modal.js
+++ b/app/javascript/mastodon/features/ui/components/media_modal.js
@@ -54,19 +54,23 @@ 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);
     if (this.context.router) {
       const history = this.context.router.history;
       history.push(history.location.pathname, previewState);
@@ -77,7 +81,7 @@ export default class MediaModal extends ImmutablePureComponent {
   }
 
   componentWillUnmount () {
-    window.removeEventListener('keyup', this.handleKeyUp);
+    window.removeEventListener('keydown', this.handleKeyDown);
     if (this.context.router) {
       this.unlistenHistory();